[ 解決済 ] 投稿リストのごとのフォントについて

[abetchi]

lightning proを使用しています。
固定ページにVK Blocks Proの投稿リストを2つ配置しており各々カテゴリーをわけて表示しています。
表示自体は意図した動きになっていますが、各々でタイトル部分のフォントを変更したいと考えております。
chromeの検証機能を使用して
.vk_post .vk_post_title {
font-size: 14px;
line-height: 1.4;
font-weight: 700;
margin-bottom: 0;
}
と言うのにたどり着きました。
ここに追加で
font-family: “フォント名”;
を入れるとフォントが変わるので、
ExUnitの追加CSSに追加すると全ての投稿リストのフォントが変わってしまいます。
特定の投稿リストブロックだけのフォントを変更するにはどの様なやり方があるのでしょうか？
どなたかアドバイスよろしくお願い致します。

[Vektor,Inc]

ご質問ありがとうございます。
まず　VK Blocks Pro に不具合がありましたので 0.27.4 にアップデートしてください。

その上で、編集画面で投稿リストブロックを選択した状態で、右側設定パネルの一番下に「高度な設定」で追加CSSクラスを入れるところがあります。

ここの test と入れた場合は

.test .vk_post .vk_post_title {
    font-family: Helvetica;
}

のように書く事ができます。

[abetchi]

ご回答ありがとうございます。
まずは0.27.4へアップデートしました。
「複数クラスを半角スペースで区切ります」とあり、今回は複数ではない！？ので
.test.vk_post.vk_post_title{font-family:”Helvetica”;}
と入れれば良いのでしょうか？
そして.testとは何を意味するのでしょうか？

よろしくお願い致します。

[Vektor,Inc]

いえ、追加cssクラスには test だけ入力してください。
そうすると投稿リストブロックの一番外側のdivにtestというクラス名が追加されるので、
外観 > カスタマイズ > 追加css に

.test .vk_post .vk_post_title {
    font-family: Helvetica;
}

と書く事になります。

追加cssに書く名前が vektor なら

.vektor .vk_post .vk_post_title {
    font-family: Helvetica;
}

になります。

全てのWordPressテーマで使える！デザインをピンポイントで変更する方法 〜親テーマのCSSは書き換えないで〜

[abetchi]

ありがとうございます！無事に解決しました！
高度な設定の使い方がようやくわかりました、、、

[投稿者]

投稿