WordPress TCDテーマ『Bloom』H2見出しとTwitterカードの設定方法

WordPress

おしゃれで洗練されたデザインが人気の有料テーマ『Bloom』。インターネットで検索してもBloomの設定情報があまりなかったので、私が設定で困ったこと&調べたことを残しておこうと思います。

”見出しH2”がトップページにも反映されてしまう

投稿記事の見出しH2にのみ下線を引きたかったのですが、「追加CSS」で下記コードを設定するとトップページのH2にも反映されてしまいました。


H2に細い下線を引くCSS↓↓  

h2 {  
border-bottom: thin solid #カラーコード; 
padding-bottom: 10px 
}

これを追加CSSに入力すると下記のようにトップページにも下線が出現。これが地味に気になる。


追加CSSは、外観⇨ウィジェット⇨ライブプレビューで管理⇨追加CSSにあります。 

解決法

H2の前に【.l-primary】をつけたCSSを設定すると解決しました。h2は投稿記事だけではなく、トップページにも使われているので、『投稿記事内の見出しH2にのみ反映する』というCSSを設定する必要があります。

”記事内”と指定するためのクラスはTCDテーマによって異なり、Bloomの場合は.l-primaryでした。「記事内の見出しH2に下線を引く」というCSSは下記です。(#以降は指定したいカラーコードを入力。)



.l-primary h2 {  
border-bottom: thin solid #カラーコード;  
padding-bottom: 10px  
}

これを「追加CSS」に入力すると、トップページの下線が消えて記事内にのみ反映されます。希望通りのデザインになってよかった〜。

WordPress Bloom /Twitterカードの登録方法

Twitterカードとは、画像付きで投稿記事をシェアできる方法。下記のような投稿をTwitterで見たことありませんか?

設定方法は、


 1)外観⇨TCDテーマオプション⇨基本設定⇨Facebook OGP設定に✔︎を入れる。
 2)下にある「Twitter Card設定」✔︎を入れる。
 3)「あなたのtwitterアカウント名」に自分のアカウントの@以降を入力

これで設定完了。

Twitterカードが設定できたかの確認方法は、こちら。Twitterへの共有ボタンを押すとURLが表示されますが、「Tweet」を押すとちゃんと画像付きになりました。

最後に

私は初心者なので詳しい知識はありませんが、ネットで調べてみたら設定できました。bloomを使っていてお困りの方のお役に立てば幸いです。

Ayano

15歳のときに初めて海外へ行ったことをきっかけに海外に興味を持つようになりました。英語は中学生の頃に洋楽にハマって以降、マイペースに勉強をしており今ではTO...

プロフィール

ピックアップ記事

関連記事一覧