【Jettheme#03】記事毎にカテゴリ表示をする

JetThemeはなぜか記事ごとのカテゴリ表示がなくハッシュタグのみになっていまうす。

で、表示させたい。

【Blogger】JetTheme カスタマイズ方法一覧 | リモスキ

JetTheme を導入するにあたって、いくつかカスタマイズを行いました。当ブログでのカスタマイズ内容・修正方法をこちらで紹介していきたいと思います。

www.limosuki.com

ほとんどこちらの「記事下にカテゴリーを表示」を参考に書換。

しかし、表示がそっけないので少し書換

<div class='entry-category'><b><i>CATEGORY : </i></b>
<b:loop index='i' values='data:post.labels where (l =&gt; l.name contains &quot;#&quot;) skip data:skin.vars.maxLabel' var='label'>
<b:class expr:cond='data:i == 0' name='mb-2'/>
<a class='btn jt-btn-light rounded me-2 mb-2 px-3' expr:href='data:label.url.canonical + &quot;?max-results=10&quot;' rel='tag'><data:label.name/></a>
</b:loop>
<b:loop index='i' values='data:post.labels where (l =&gt; l.name not contains &quot;#&quot;)' var='label'>
<b:class expr:cond='data:i == 0' name='mb-2'/>
<a class='btn jt-btn-light rounded me-2 mb-2 px-3' expr:href='data:label.url.canonical + &quot;?max-results=10&quot;' rel='tag'><data:label.name/></a>
</b:loop>
</div>

赤字部分を書換ました。

素で表示されてしまうので、「CATEGORY :」とでるように追加。

ボタン表示に切り替えて、ハッシュタグが丸い rounded-pill 表示なので、カテゴリーはそれと区別すべく角丸の  rounded で表示するように。

こうなると、メニュー部分の表示とずれるので

widget-content categories の部分も書き換えが必要

 <a class='text-reset fw-bold hover-text-primary' expr:href='data:label.url + &quot;?max-results=10&quot;'>

 ↓

  <a class='btn jt-btn-light rounded me-2 mb-2 px-3 text-reset fw-bold hover-text-primary' expr:href='data:label.url + &quot;?max-results=10&quot;'>

赤字を追加で、メニュー部分と記事下部の表示が同じに。

まだまだ先はながい。

• B!