HOME > Seesaaブログのカスタマイズ :このページの記事一覧
2007-08-21

「続きを読む」を折りたたみ式に改造(Seesaa)


Seesaaブログでは「続きを読む」をクリックすると、追記記事の内容は別ページに表示されます。
でも私は個人的には「続きを読む」をクリックしたら同一ページにそのまま表示される折りたたみ式の方が好みなので、HTMLを書き換えて改造してみました。

その際、以下のページがたいへんに参考になりました。
記事の追記部分を折りたたみ :Style book

でも、実際に「続きを読む」という機能ってどういう場面で使うのが適切なのかよく分かりません。

ブログの『続きを読む』機能の本当の使い方 :ホームページを作る人のネタ帳

このブログにおける「続きを読む」考 :ekken



2007-08-13

画像の隅のイメージツールバーを非表示にする HTML


画像にマウスカーソルを重ねたときに、その画像の左上隅に出てくるイメージツールバーを表示させないようにします。



HTMLの部に以下のタグを書き加えればOKです。
<meta http-equiv="imagetoolbar" content="no">


イメージ ツール バーの使用による Web での画像処理 :Microsoft

イメージ ツール バーのカスタマイズ :Microsoft
2007-08-08

カテゴリのページに記事タイトルの一覧を表示(Seesaa)


SeesaaのブログはHTMLが書き換えられるので、また少しカスタマイズしてみました。

カテゴリのページの上部に、記事タイトルの一覧が表示されるようにしてみました。
Googleで「カテゴリ 記事タイトル Seesaa」を検索すると、カスタマイズ方法を紹介しているページがたくさん見つかります。

カテゴリページ記事タイトル一覧表示:シーサーブログカスタマイズ

どのページも、使っている方法はほぼ同じでした。それらを参考にして、私も以下のようにしてみました。

管理画面から[デザイン]→[コンテンツ]→[記事]→[コンテンツHTML編集]と進み、
<% if:page_name eq 'category' -%>
<div class="sidetitle"><a href="<% blog.page_url %>">Top</a> / <% category.name %></div>
<% if:pager.need_pager -%>
<div class="navi">
<% if:pager.previous_page %><a href="<% category.page_url(pager.previous_page) %>"><% /if %><<<% if:pager.previous_page %></a><% /if %><% loop:list_pager %> <% if:current_page ne pager_number %><a href="<% category.page_url(pager_number)%>"><% /if %><% pager_number %><% if:current_page ne pager_number %></a> <% /if %><% /loop %><% if:pager.next_page %><a href="<% category.page_url(pager.next_page) %>"><% /if %>>><% if:pager.next_page %></a><% /if %>
</div>
<% /if -%>
<div class="sidetitle"><a href="<% blog.page_url %>">HOME</a> > <% category.name %> :このページの記事一覧</div>
<div class="side">
<% loop:list_article -%>
<a href="<% article.page_url %>" class="a"><% article.subject %></a><br />
<% /loop -%>
</div>

<% /if -%>

という風にしてみました。青い文字の部分が追加・書き換えたところです。赤い文字の部分は削除しました。
2007-08-06

ブログのタイトルをWeb2.0風の画像に


ブログのタイトルを文字から画像に変えてみました。
とっても便利なサイトを見つけれたので、本格的なソフトを使わなくても、Web2.0風の文字が反射してる画像を作れました。

LOGO! 高機能で使いやすいレイヤ対応のロゴ作成ソフト / Vector
文字を装飾してロゴを作成するソフトです。
グラデーション文字や、テクスチャ文字も作れますし、透明度を指定して影をつけたり、縁取りをすることも出来ます。BMP、JPEG、PNGに対応しています。

Reflection.js
任意の画像を、下に反射したWeb2.0風の画像に変換してくれるJavascriptが配布されているサイトです。
ページ自体は英語ですが、分かりやすく説明されているので簡単に使えます。
URLを指定してWeb上で画像を変換することも出来ますし、Javascriptファイルをダウンロードすることも出来ます。


上の二つを使って、ページの一番上に表示されるタイトル画像を作ってみました。
2007-08-06

ブログのカスタマイズ HTMLとCSS (Seesaa)


SeesaaブログはHTMLもCSSも自由に書き換えることが可能です。
ネットで検索すると、カスタマイズの方法がいろいろ見つかるので、私もいくつか試してみました。

Seesaaで用意されているテンプレートの「アイボリー(左サイドバー)」を基にして、色や文字サイズなどを自分の好きな感じに変えてみました。

HTMLとCSSを変更する際には、以下のサイトが大変参考になりました。

ブログカスタマイズ
Seesaaのカスタマイズ方法が多数、分かりやすく紹介されています。

Style book
多数のオリジナルテンプレートと共に、Seesaaブログ改造の方法が紹介されているブログです。
×

この広告は180日以上新しい記事の投稿がないブログに表示されております。