PR PR

記事タイトルもパーマリンク(Permalink)させる

スポンサーリンク
新着情報
2023.04.09
2023.04.06
2023.04.03
2023.03.19
スポンサーリンク
スポンサーリンク

この記事は2013年4月8日の1年以上前に書かれたものです。現在は状況が異なる可能性がありますのでご注意ください。

記事内に広告が含まれています。

テンプレートにもよりますが、
デフォルト(default)では記事のタイトルにはリンクがありません

そこで、
記事タイトルにもユーザービリティを考慮し、
記事へのパーマリンクをつける方法。

テンプレート>HTML の編集で「ウィジェットのテンプレートを展開」にチェック


<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<b:if cond='data:blog.url != data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>

この部分を以下のように変更する


<h2 class='post-title entry-title'>
<a expr:href='data:post.url'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<b:if cond='data:blog.url != data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</a>
</h2>

記事タイトルを「h2」へ変更し、「a」タグで囲んであげる。
「h2」へ変更することによってフォントの大きさが小さくなるため
CSSで任意の大きさに調整する。


/* 記事タイトルフォントサイズ */
h2.post-title a{
font-size: 21px; //Sample
color:#666666; //Sample
}

h2.post-title a:hover{
color:#999999; //Sample
}

 
 
 
スポンサーリンク
タイトルとURLをコピーしました