滋賀咲くブログ、バージョンアップ後 第2弾です。
前回に引き続き記事タイトルですが、みなさんのブログでは自動的にリンク化されているようですが、中にはリンク化されてないっという方もおられるみたいです。
そこで、だったら自分でリンク化してみようってことを紹介したいと思います。

設定

まず、個別記事へのリンク設定には「<%EntryPermalink%>」という置換タグを用います。
これは各個別記事のURLに変換させる役割があります・・・たぶん。
それをリンクさせるので「<a href="~">~</a>」と組み合わせます。

設定する場所は、「トップページ」、「個別記事」、「アーカイブ」のそれぞれhtml内です。
※「トップページ」だけでも構いませんが、すべてに設定されることをお薦めします。
その中から↓の画像のような欄を探してください。



変更する点は↑の画像で赤下線の、

<h3 class="title"><%EntryTitle%></h3>

という部分です。
ここに次の青文字の文章を加えます。

<h3 class="title"><a href="<%EntryPermalink%>"><%EntryTitle%></a><</h3>

 これで完了です。
もし個別記事やアーカイブのページにも記事タイトルをリンク化したい場合は、それぞれ同じ文章を加えればOKです。

まとめ

どうでしたか上手くリンク化できたでしょうか
僕もこれにはちょっと確信がないのですが・・・
自分のブログもみんなのブログと同じように記事タイトルのリンク化にしたいという方は、試してみる価値はあると思うのですが。
とりあえず参考までに記事にしてみました。
今回はお疲れ様ではなく、お粗末さまでしたってことで
  

今回の滋賀咲くブログのバージョンアップによって、ブログ記事タイトルがリンク化されましたね。
その記事タイトルのリンク化ですが、標準では下線が表示されているようになっていると思います。
また、記事タイトルのフォントを指定されてた方は、上手く表示されず、ページ全体のフォント設定が反映されていると思います。
ってことで、今回は、記事タイトルのリンク設定を紹介したいと思います。

設定

まずクラス名ですが、以前紹介したように、リンク設定してあるクラスには「a」が付きます。
そして記事タイトルのクラス名は「title」ですから、記事タイトルリンクは「title a」のようになります。
ですからスタイルシートには↓のように入力します。

/*記事タイトルリンク*/ .title a{ color:#0000cd; text-decoration:none; font-family:"HGS創英角ﾎﾟｯﾌﾟ体"; } .title a:link{ color:#0000cd; text-decoration:none; } .title a:visited{ color:#0000cd; text-decoration:none; } .title a:active{ color:#0000cd; text-decoration:none; } .title a:hover{ color:#ffffff; text-decoration:none; background:#0000cd; }

こんなかんじになります。
↑以外の属性（font-sizeなど）は今までのように「title」の方でも構いません。
みなさんの描くイメージどおりになるよう、いろいろ試してみてくださいね。
※リンクの各設定の意味が分からない方は、詳しい説明をこちらでしていますから参考にしてくださいね。

まとめ

どうでしたか僕も急な対処でまだまだブログ全体の変更点を把握しておりませんが、とりあえず記事タイトルのリンク化はクリアできたと思います。
まだまだこれまで紹介してきた画像などの修正が残っておりますが、のんびり楽しみながらやっていこうと思います。
それではお疲れ様でした
  

前回に引き続き、コンテント内の構造です。
今回は個別記事ページなどで表示されるコメント欄などの構造を紹介します。
前回よりも多少数は多いですけど、繰り返し使用されているクラスもありますから、めちゃくちゃ大変ってコトはないと思います。
ではまずいつもの画像をどうぞ

続いて各ID、CLASSの説明です。
前回紹介した「#content」 「.blog」 「.blogbody」 「.posted」 「.aposted」 「.menu」 「.amenu」 「.pagetop」の説明は省きますので、お忘れの方は前回の記事を参照してください
では上から順に参ります

「.comments-head」はこの記事へのトラックバックURL、この記事へのコメントといった文が表示されるところです。

「.trackback-url」は各個別記事のトラックバックのURLが表示されるところです。

「.trackback-body」はトラックバックされた方のブログ記事の概要、または本文が表示されるところです。

「.trackback-post」はトラックバックされた方のブログタイトルや日付が表示されるところです。

「.atrackback-post」はトラックバックされた記事タイトルが表示されるところです。（リンク）

「.comments-body」はコメントをくださった方の文章が表示されるところです。

「.comments-post」はコメントをくださった方の名前や日付が表示されるところです。

「label」は名前: メール: URL: 情報を記憶: コメント:が表示されるところです。
IDやCLASSではないので「#」や「.」を付けないよう注意しましょう。

「#author」はコメントされる方が名前を入力されるところです。

「#email」はコメントされる方がメールアドレスを入力されるところです。

「#URL」はコメントされる方が開設されているホームページアドレス、またはブログアドレスを入力されるところです。

「#bake」は、上のそれぞれ入力された情報を記憶するためのチェックボックスです。
ですが、安全にお使いいただくためにも変更はしない方がいいと思います。
っていうか、スタイルシート内には記載されていないと思いますけど・・・。

「#text」はコメント内容を入力するところです。

まとめ

これで滋賀咲くブログすべての構造がお解かりになったと思います。
こうして色分けすれば、重なりも分かりやすいと思うので、我ながら
いろんなところを自分好みにして楽しんでみてくださいね。
幅設定などは計算とかもしなくちゃいけなくて面倒臭いですけど、文字の大きさや背景の設定なら簡単で楽しいですからね。

次回はちょっと難しいかもしれませんけど、自分でIDやCLASSを設定して、スタイルシートを設定してみたいと思います。
それではお楽しみに、お疲れ様でした

  

今回からは記事が表示されるコンテント部分の構造を紹介したいと思います。
1度に紹介するとややこしいと思うので、今回はトップページで表示される場合の内容を紹介をします。
いつものように重なりが解るかなぁと思って絵でまとめてみたので御覧下さい

ではそれぞれの説明をしていきます。

「#content」は、記事部分の最背面枠といったところです。

「.blog」は次のページやこのページの上へを含めた枠です。

「.blogbody」は記事タイトルや投稿者名などを含めた枠です。

「.date」は投稿した日付です。
テンプレートによっては「.blogbody」内ではなく「.blog」内にある場合もあります。

「.title」は記事タイトルです。
記事タイトルがリンク化されている場合は「.title a」も設定が必要となります。

「.main」は記事内容枠です。

「.main-continues」は続きを読む（追記）を書いたときに表れます。
リンク化されていますから、「a.acontinues」の設定も必要となります。

「.posted」は投稿者名です。

「.aposted」は時間、コメント、トラックバック、カテゴリといったリンクです。
リンク設定は「a.aposted:link」などと書かれています。

「.menu」は前のページ、次のページのリンクです。
リンク設定は「a.amenu:hover」などと書かれています。

「.pagetop」はこのページの上へのリンクです。
リンク設定は「a.apagetop」などと書かれています。

設定方法は今まで紹介してきた属性を使ってアレンジしてくださいね。
枠だったら縦横の幅、余白、背景など、更に文章が入るところなら文字のスタイルなど、さまざまです。

まとめ

今回は各リンクのセレクタも紹介しました。
以前紹介したときは「.〇〇 a:link」などでしたが、今回のは「a.〇〇:link」でした。
どちらも「a」や「:link」といったかんじで書かれていますので分かると思います。

徐々に説明が適当になってきましたが、同じことを何度も書くより、シンプルな方が見やすいかなぁっと思って省くようにしました。
セレクタ、属性、値などをお忘れになったときは、過去記事を御覧になってくださいね

次回は構造の続きで、今度は個別記事ページなどで表示される、コメント欄などの紹介をしたいと思います。
それではお疲れ様でした