FC2blogの着せ替えブログ

以前に、記事中で紹介させていただいていた、ＨＰ作成お役立ち系サイトの、ＤＦＪさんのページが閉鎖されてしまったようなのです。
先日、記事からアクセスしてみて、リンク切れに気付きました。
とっても残念です。

そこで、また、タグの入れ子関係や、ブロックレベル要素とインライン要素について、わかりやすく書かれているページを探して参りましたので、紹介させていただきますね。

ばあどさんの「1ページで騙（かた）るホームページ作成」というページです。
少々乱暴なのですが(^^;)わかりやすいので、紹介させていただきます。

しつこいようですが、テンプレートの表示崩れやスタイルシートのスタイルが効かない等の場合、タグの閉じ忘れの他の、原因ナンバーワンですから、是非、ご一読くださいますようお願いいたします。

今回ＦＣ２の共有テンプレートスペースへ登録したテンプレートは、「Ｗ３Ｃ検証サービス検証済み」とか、書いておりますが、登録した実際のテンプレートは、Ｖａｌｉｄとは言えない仕様になっております。
それでは、検証に通った各サンプルテンプレートと登録したテンプレートとは、どこが違うのか？説明させていただきますね。

まずは、ブログのテンプレートとは何か？についての前置き（笑）

ＦＣ２のブログテンプレートは、ＨＴＭＬが１シートしか無いですよね？
しかし、ブログには、色々なページ（トップページ、コメント投稿が出来るページ、など）があります。
それは、１枚のテンプレートの中から、ある特定の部分が、その都度必要に応じて使われる仕組みになっているからです。
したがって、その１シートの中でＨＴＭＬが正しく書かれ、完結する必要は無く、それぞれのページで正しく使われ、きちんと完結されるように書く必要があります。

ですから、ブログのテンプレートの場合は、管理画面から投稿した内容を取り込んで吐き出されたソースこそが、検証されるべきＨＴＭＬとなります。
そう言った意味で、実際の私のブログのある特定のページを検証に使っています。
あまり、流動的なページを対象にすると、私が記事中で、うっかりおかしなタグの使い方をして、いつエラーが出るとも限りませんので（笑）

さて、それでは、サンプルとの相違点は？と言うと・・・・

・登録したテンプレートには、ＸＭＬ宣言が抜けている（抜いている）
・登録したテンプレートには、スクロールバー装飾のスタイルを設定している
・登録したテンプレートは、プラグイン対応版

以上の３点です。
詳しい内容を知りたい方は、続きをどうぞ。
続きは、すっごく長くてクドイです。すみません。

Ｗ３Ｃ検証サービス検証済みとは言っているもののの続きを読む▽

プラグインのフリーエリアの内容の追加で、気付いた事なのですが、プラグインのフリーエリアというのがありますが、あそこにディフォルトで入っている内容には、注意が必要かも？です。

プラグインのフリーエリア（プラグインHTMLの編集という所）はディフォルトでは、以下のようになっていると思うのですが・・・

<!-- ＆freeareaの中にHTMLが代入されます。 -->
<p class="plugin-freearea" &align>
&freearea
</p>

フリーエリアに内容を入れる時に、こちらの内容を変更せずに、プラグインの「設定の変更」画面の「フリーエリア内容の変更」の欄に、内容を追加する場合、使用するＨＴＭＬのタグに注意が必要かと思われます。

こちらの欄に、たくさん内容を入れる場合、例えば、＜div＞で括ってあったり、＜p＞で括ってあったりするＨＴＭＬのカタマリは、ディフォルトのままでは追加する事は出来ません。
（ブログパーツなどの場合、他に＜table＞タグなどでタグが発行される物もあるかもしれません。）
ていうか、追加する事は出来ますが、実際の問題として、スタイルシート（ＣＳＳ）が効かなくなったり等の不具合が生じる事になるかもしれません。

それは、なぜか？

先程のプラグインＨＴＭＬの部分をもう一度見てみましょう。

<!-- ＆freeareaの中にHTMLが代入されます。 -->
<p class="plugin-freearea" &align>
&freearea
</p>

「代入されます」と書いていますね？
つまり、プラグインの「設定の変更」画面の「フリーエリア内容の変更」の欄に追加された内容が、「＆freearea」と書かれた場所に置き換えられるわけです。

その場合、上記の＜p＞から＜/p＞までの間に代入されるわけですから、その間にまた＜p＞タグや＜div＞タグを入れるわけには行かない、という事です。
（注：こちらの詳しい事に関しては、ＨＴＭＬの、タグの入れ子関係、タグのネスト、インライン要素とブロックレベル要素、などで検索してみてください。）

ですから、もし、ブログパーツなどのサイトで発行されたタグに＜div＞が含まれていたり、テキストを＜p＞タグで括ったものをいくつか入れる場合、＜table＞タグを使った画像テーブルなどをサイドバーへ入れる場合、上記の「プラグインＨＴＭＬ」の部分の書き換えが必要となります。

いろいろやり方はあるのですが・・・

ひとつは、代入方式をやめてタグを直書きする、という方法があります。
先程の「プラグインＨＴＭＬ」の内容をゴッソリ削除してしまい、入れたいＨＴＭＬを直書きします。
その場合、コンテンツの文字位置などは、自分でＨＴＭＬで書く事になります。

その他に「プラグインＨＴＭＬ」に直書きしないで、プラグインの「設定の変更」画面の「フリーエリア内容の変更」の欄に追加する場合で、「設定の変更」画面の「コンテンツの文字位置：」で設定された設定を反映させたい場合は・・・

<!-- ＆freeareaの中にHTMLが代入されます。 -->
<p class="plugin-freearea" &align>
&freearea
</p>

上記を以下のようにする。

<!-- ＆freeareaの中にHTMLが代入されます。 -->
<div class="plugin-freearea" &align>
&freearea
</div>

もしくは、以下のようにする。
（注：こちらの場合は、「設定の変更」画面の「コンテンツの文字位置：」の設定は反映されませんので、追加タグ内で文字位置の設定を書きます。）

<!-- ＆freeareaの中にHTMLが代入されます。 -->
&freearea

その他の書き方は、入れる（追加する）タグによって色々あるのですが、だいたい上記のやり方で回避する事が出来ます。
え、ちょっと乱暴な記事ですね(^^;)
不具合に心当たりのある方は、お試しください（ぉ

ブログのカスタマイズお役立ちサイトを紹介させていただきます。

ブログを始めたばかりで、ブログの構造だとかをまだ良く把握していない、アフィリエイトの始め方がよくわからない、検索サイトにより拾われる為には？ＲＳＳって何？等の情報がわかりやすく掲載されています。

私も、検索でたどり着き、よくお世話になったサイトです。
お薦めです。

・ブログ別！作成・カスタマイズ講座
（管理人は、りっちさんです。）

前回のカスタマイズしたい場所を探そう（２）では、カスタマイズしたい部分は、ＨＴＭＬのどこに記述してあるのか探す方法を書きました。
そして、実際に[default]のテンプレートを使って、「記事タイトル」はどこに記述されているのか？という事で、テンプレートのＨＴＭＬ内を探してみました。

今回は、カスタマイズしたい部分のスタイルについて、スタイルシート（ＣＳＳ）のどこに記述してあるのか、実際に探してみましょう。
前回同様、[default]のテンプレートを使い、記事タイトル＜ｈ３＞記述の場所を探しますます。
以下のページをブラウザで開いておきます。

★ブラウザで開いておくページ

・[default]のプレビュー画面
・[default]のテンプレート修正画面

カスタマイズしたい場所を探そう（３）の続きを読む▽