> テンプレート関連

widedocシリーズ・カスタマイズ法 

下の解答は、それぞれいただいた質問に対し、考えられるいくつかの方法から質問者のレベルを考慮して回答しております。
(レイアウトは大きく崩れないように配慮して回答しておりますが、カスタマイズという行為の性質上、細かい見た目(表示位置、行間、)などはあまり考慮していません。あしからず)


Q ページ最下段のl INDEX l次ページ の表記を、本文末の 日付・時刻・コメント l トラックバック l URL l の真下右ならえに置きたい。

A テンプレートの設定 - 『テンプレートの管理』画面より、HTML編集にて下の部分を

<ul class="e_navi">
<li><%topentry_year>.<%topentry_month>.<%topentry_day> <%topentry_hour>:<%topentry_minute> </li>
<li><!--allow_comment--><a href="<%topentry_link>#comment_post"
title="コメントを書く">Comment</a> : (<za href="<%topentry_link>#comment_list"
title="コメントを見る"><%topentry_comment_num></a>)<!--/allow_comment-->
<!--deny_comment-->Comment(-)<!--/deny_comment--> | </li>
<li><!--allow_tb-->Trackback : (<a href="<%topentry_link>#trackback"
title="トラックバックを見る"><%topentry_tb_num></a>)<!--/allow_tb-->
<!--deny_tb-->Trackback(-)<!--/deny_tb--> | </li>
<li><a href="<%topentry_link>" title="記事を参照">URL</a> | </li>
</ul>


下のように書き換える

<ul class="e_navi">
<li><%topentry_year>.<%topentry_month>.<%topentry_day> <%topentry_hour>:<%topentry_minute> </li>
<li><!--allow_comment--><a href="<%topentry_link>#comment_post"
title="コメントを書く">Comment</a> : (<za href="<%topentry_link>#comment_list"
title="コメントを見る"><%topentry_comment_num></a>)
<!--/allow_comment-->
<!--deny_comment-->Comment(-)<!--/deny_comment--> | </li>
<li><!--allow_tb-->Trackback : (<a href="<%topentry_link>#trackback"
title="トラックバックを見る"><%topentry_tb_num></a>)<!--/allow_tb-->
<!--deny_tb-->Trackback(-)<!--/deny_tb--> | </li>
<li><a href="<%topentry_link>" title="記事を参照">URL</a> | </li>
</ul>
<ul class="e_navi"><!--prevpage--><li><a href="<%prevpage_url>"
title="前のページへ戻る">≪前ページ</a> </li><!--/prevpage-->
<li>| <a href="<%url>" title="INDEXへ戻る">INDEX</a> | </li>
<!--nextpage--><li><a href="<%nextpage_url>" title="次のページへ進む">
次ページ≫</a></li>
</ul>


Q 個別エントリーページでは、最下部に 前ページl INDEX l次ページ リンクが表示されないが、表示させるようにするにはどうしたら良いか?

A テンプレートの設定 - 『テンプレートの管理』画面より、HTML編集にて下の部分を

<!--固定リンクページエントリー下部(ナビ)・始-->
<ul class="c_navi">
<li><a href="<%url>" title="INDEXへ戻る">INDEX</a></li>
</ul>
</div>
<!--固定リンクページエントリー下部(ナビ)・終-->


下のように書き換える

<!--固定リンクページエントリー下部(ナビ)・始-->
<ul class="c_navi">
<li><!--prevpage--><li><a href="<%prevpage_url>"
title="前のページへ戻る">≪前ページ</a> </li><!--/prevpage-->
<li>| <a href="<%url>" title="INDEXへ戻る">INDEX</a> | </li>
<!--nextpage--><li><a href="<%nextpage_url>" title="次のページへ進む">
次ページ≫</a></li>
</ul>
</div>
<!--固定リンクページエントリー下部(ナビ)・終-->
  • 2008.04.03 08:51 
  • Comment : (0) |
  • Trackback : (0) |
  • URL |

> テンプレート関連

widedocシリーズ 

 caseofb_widedoc_or.gif caseofb_widedoc_gy.gif caseofb_widedoc_dr.gif

登録から認証通るまで時間がかかり過ぎて忘れそうになっていましたがが、ようやくwidedocシリーズが共有登録され、公開が始まったようです。

本当はちょっと前に赤、青、緑の3種が共有登録されていたのですが、バグが発覚したため削除したのでした。

共有登録コメントには「手引き公開中」なんてこと書いておいて、実は何も用意していなかったりするのですが、今回の奴は基本的なレイアウトにカスタマイズ性を許さない仕様となっているので、後はそれぞれ出来る範囲で頑張ってください♪って感じのものになっています。

とりあえずこのテンプレの仕様から

トップ(エントランス)ページの存在する左メニュー2カラム、幅可変タイプ。

ま、この辺からして一般受けしないレイアウト(^^;

サイト内第2階層的扱いとしてカテゴリー、アーカイブ、リセントエントリーへのリンクを上部グローバルナビとして装備。

つまり日記レベルでブログをやっているような人には必要ないであろう構造!

個別エントリーページでは左カラムにコメントフォーム搭載!
IE6ではみすぼらしいが IE7 とか FireFox だと位置固定!
長いエントリーを右側に表示させ、読みながらコメントが書ける!(XGA以上推奨だが…)

同様の仕組みとしてフッター常時下部表示!
これによりよくある 『 このページのトップへ戻る▲ 』 がいつでも右下に!!


とまぁ、地味な割にユーザビリティの高い機能を相応にひっさげて・・・
しかもそれって一度使ってみないとわからないという・・・

ビジュアル面が人気(DL数)を左右するブログテンプレにおいて自虐的作品となりました。

これを一般的なブログユーザー向けのテンプレとして作るのには私にとって全く意味はなかったのだけど、ちょっと需要を知りたかったのでカラーパターンを複数用意して共有登録したのですが、どうなんだろうなぁ・・・?

質問等あればお気軽に♪
出来る限り正しくわかりやすいようにアドバイスさせて頂きます。

→ カスタマイズ法
→ FAQ

関連記事 : テンプレート

  • 2008.03.22 03:13 
  • Comment : (1) |
  • Trackback : (0) |
  • URL |

> テンプレート関連

カスタマイズ法:graydoc 

● レイアウトに関して
内側の白い領域の幅及び、ヘッダーの高さに関しては修飾に使用している画像の問題から、変更しない方が良いです。

白い領域内の各カラムの幅に関してはある程度変更可能です。

● ブログタイトルとブログ説明の位置関係及びサイズと色について

ブログタイトルが長いとブログ説明と重なり見づらくなってしまいます。

元々はデザインとしてブログ説明を入れるつもりは無かったのですがテンプレ登録するにあたり急遽設置したものです。
上部左上より表示されるテキストがh1要素で、右の大きなタイトル文字はただのP要素となっているので注意。

このh1を削除するとレイアウトが崩れるのでcolorを#000000にして一見無いようにしてしまうのが楽な方法。

● INDEXページのカスタマイズ
○ Welcomeバナーの欄は是非ともオリジナルの画像に差し替えて使っていただきたい!と思っています。幅540pxだとぴったりだったと思います。
  • 2007.11.24 18:19 
  • Comment : (0) |
  • Trackback : (0) |
  • URL |

> テンプレート関連

graydoc_r シリーズ 

【特徴】
INDEXページ、カテゴリ及びアーカイブページ、個別エントリページとで、メニュー(プラグイン)表示の変わるテンプレート。
コメント記入欄をエントリ下ではなく、エントリ横サイドメニュー内に設置。
上部にタブ型グローバルナビを搭載。(追加容易、テキストの長さによって可変)
初心者でもプラグイン等公式のものがデフォルトのままで使用が可能なように制作しましたが、画像制作やフリーエリアの使用などができるレベルだと、より個性的に演出できると思います。

【仕様】
XHTML 1.0 Transitional W3C準拠。
幅固定タイプ。プラグイン無効・有効両用タイプ。
プラグイン1は INDEX 左カラム。
プラグイン2は INDEX 右カラム。
プラグイン3がカテゴリ及びアーカイブページ右メニュー内に対応しています。

【基本的な使い方】
まずはプラグイン無効にして表示確認してみて下さい。
INDEX 左カラム以外は公式プラグインの設置を前提にスタイルを整えてますので有効にすることで並べ替えや入れ替えも容易です。

description 及び Keywords を設定しておりません。
『 テンプレートの設定 』から HTML 編集にて下記の部分に記述してください。
<meta name="description" content="ここにブログ紹介文を書く。" /> 
<meta name="Keywords" content="ここにブログのキーワードを書く。" />


利用規約
カスタマイズ法
  • 2007.11.24 18:17 
  • Comment : (0) |
  • Trackback : (0) |
  • URL |

> テンプレート関連

blacknote3c風squares3 

ウチの共有登録していないテンプレ(squares)のように、トップページにだけ表示されるフリースペースをblacknote3cにも付けたい、という要望がありました。

元々blacknoteシリーズは私の旧squaresをベースにしてるけど私がデザインしたものではなく、私としては今更古いソースを弄るのヤダなぁ…という気持ちがあって先延ばししていたのですが、やってみたら思ってたより簡単に着せ替え出来ちゃった(^^;

ただしベースはあくまでsquares3になので各カラムのサイズ変更はメンドーになってます。あしからず。

つーわけで、下のリンク先にHTML用とCSS用のtxtファイルを置いておきます。
必ずダウンロードしてお使いください。
(IEの場合【右クリック】→【対象をファイルに保存】)
(ブラウザで開いても表示されないかも。)

HTML:blacknote3c2html.txt
CSS:blacknote3c2css.txt

上記をファイルをテキストエディタ(メモ帳は文字コードが対応していない為ダメ)で開き、『テンプレートの編集』ページにて、それぞれの編集欄にコピペしてください。

基本的にサポート対象外とさせていただきますが、ご利用及び、バグ報告、他の色のリクエスト等、このエントリーへのコメントもしくはメールにて、記名及びアドレス明記して頂いた方へは対応したいと思います。

なお、使い方に関してはコチラも参考になさってください→

  • 2007.06.15 02:26 
  • Comment : (2) |
  • Trackback : (0) |
  • URL |

> テンプレート関連

gray_squares3(仮) 

どこの誰かもわからない御方からテンプレートに関してリクエストを頂きました。
これまでも何度か書いてきたように、本来ならば『どこの誰かもわからない』って時点で無視するところ。
何らかの情報発信の為にブログ立ち上げて、それで人に頼みごとするなら(というか、私としてもなるべく適切な対応をしたいので)、最低でもハンドルネームと管理してるブログのアドレスくらいは書いてよね。

と、愚痴りつつも、リクエストの内容は既に自分のブログで仕込み完了していたものだったので、公開する良い機会かと思いまして…。

本当は『squaresシリーズ公開一周年記念!』に全色用意してから、長期にわたりご利用頂いてる方へのお礼として準備していたんですがね…。(ま、そんな方々は決して多いわけでは無いし…。)

んで新バージョン、パッと見は同じなんですが中身は大分変更されております。

んで、導入のメリット
  1. エントリー欄上部にプラグインカテゴリー3に対応したスペースを設置。(デフォルトではトップページのみの表示)
    フリーエリアをひとつ用意していただき、使って貰えれば良いかと。
  2. エントリー欄内に全記事リストが表示されるようになった
  3. 管理画面へのリンクをフッターに装備

逆にデメリット
  1. 旧バージョンをお使いの方ですら表示が崩れる可能性アリ。
    (特にプラグイン(メニュー)関係)
  2. プラグインの設定が不可欠
  3. 細かいチェックが済んでないので細かいコトは自己責任で
  4. グレーしか用意していない

どーでもいいこと
  1. テンプレ自体はW3C準拠
  2. コメント入力欄が全体的にデッカクなった

といった感じ。

つーわけで、下のリンク先にHTML用とCSS用のtxtファイルを置いておきます。
必ずダウンロードしてお使いください。
(IEの場合【右クリック】→【対象をファイルに保存】)

(ブラウザで開いても表示されないかも。)

HTMLソース(共通):graysquares3html.txt
グレー用CSS:graysquares3css.txt
オレンジ用CSS:orangesquares3css.txt
ブルー用CSS:bluesquares3css.txt

オレンジ用リンク色変更の要望があったのですが、場所ごとに色が違う等々悩んだ挙句以前のもののままです。(jirokonpeiさんゴメンなさい。)

基本的にサポート対象外とさせていただきますが、ご利用及び、バグ報告、他の色のリクエスト等、このエントリーへのコメントもしくはメールにて、記名及びアドレス明記して頂いた方へは対応したいと思います。

関連記事 : テンプレート

> テンプレート関連

カスタマイズ法:changeability 

changeabilityシリーズのカスタマイズ法です。
FAQに寄せられた内容や、リクエストに応じて適時更新してまいりたいと思います。

が、このテンプレのコンセプト上、絶対指定へのカスタマイズ法は取り扱わないつもりです。
(個人的にではありますが、SVGA、XGA、SXGA下において、IEにおける文字サイズの最小から最大まで、想定した範囲内での表示を確保できたのではないかと思っています。)

で、私の希望としては、いつも自分が使ってる環境ではなくて、例えば画面(ディスプレイ)の解像度や、色調、コントラストを変更してみたり、表示文字サイズを変更したりして、各々のブログを閲覧してみて欲しいと思っています。

その辺をご理解いただき、さらに『もっとここをこうした方が良いのでは?』みたいなのがありましたら、お聞かせください。
  • 2006.03.27 02:42 
  • Comment : (0) |
  • Trackback : (0) |
  • URL |

> テンプレート関連

カスタマイズ法:blacknote 

blacknoteシリーズのカスタマイズ法です。
FAQに寄せられた内容や、リクエストに応じて適時更新してまいりたいと思います。
  • 2006.03.27 02:37 
  • Comment : (9) |
  • Trackback : (0) |
  • URL |

> テンプレート関連

blacknote2c 

【特徴】
黒を貴重とした幅固定右メニュー2カラムのテンプレートです。
エントリー欄の背景に画像を使って罫線風に見える処理をしています。
また各ボックス(全体やメニュー、エントリー)の幅の変更も楽チン。元がシンプルですのでカスタマイズにチャレンジしていただければ…と思います。
XHTML1.0 TransitionalのValid目指して記述しましたが、共有テンプレ登録にあたりカスタマイズしやすいようにしてあります。
(DLした素のままではValidになりません。)

【仕様】
全体の幅:760px
左右のメニューエリア幅:220px
エントリー幅:520px

エントリー内画像挿入時、周囲に2pxのボーダー(枠線)が付きます。
また画像挿入時に<br clear="all">を外すと自動的に右寄せ&テキスト回り込みになるようになっています。

プラグインは1に対応しています。
しかし、各プラグインごとにの表示確認はしていません。
プラグインを無効にしても一般的なメニューは(私好みの並びで)表示されるようになっております。

【使用法】
HTMLの編集で『ここにブログのキーワードを書いてね』とあるところに自分のブログのキーワード(宣伝文句等)を記述してください。
FC2のアクセス解析タグは<!--アクセス解析タグはここへ-->のところへコピペしましょう。

利用規約
カスタマイズ法
  • 2006.03.27 02:35 
  • Comment : (0) |
  • Trackback : (0) |
  • URL |

> テンプレート関連

blacknote3c 

【特徴】
黒を貴重とした幅固定3カラムのテンプレートです。
エントリー欄の背景に画像を使って罫線風に見える処理をしています。
エントリー欄は3カラムにしてはゆったりめに設定してあり、幅広のバナー(画像)も貼れます。
また各ボックス(全体やメニュー、エントリー)の幅の変更も楽チン。元がシンプルですのでカスタマイズにチャレンジしていただければ…と思います。
XHTML1.0 TransitionalのValid目指して記述しましたが、共有テンプレ登録にあたりカスタマイズしやすいようにしてあります。
(DLした素のままではValidになりません。)

【仕様】
全体の幅:870px
左右のメニューエリア幅:160px
エントリー幅:500px

エントリー内画像挿入時、周囲に2pxのボーダー(枠線)が付きます。
また画像挿入時に<br clear="all">を外すと自動的に右寄せ&テキスト回り込みになるようになっています。

プラグインは左メニューが1に対応、右メニューが2に対応しています。
しかし、各プラグインごとにの表示確認はしていません。
プラグインを無効にしても一般的なメニューは(私好みの並びで)表示されるようになっております。


【使用法】
HTMLの編集で『ここにブログのキーワードを書いてね』とあるところに自分のブログのキーワード(宣伝文句等)を記述してください。
FC2のアクセス解析タグは<!--アクセス解析タグはここへ-->のところへコピペしましょう。

利用規約
カスタマイズ法
  • 2006.03.27 02:34 
  • Comment : (8) |
  • Trackback : (1) |
  • URL |