ストークのサイドバーのタイトル文字を中央揃えにする方法




当ブログでも活用しているWordPress専用テーマの「ストーク」。

実装されているサイドバーのタイトル文字は左詰めになっています。

それを中央揃えにする方法についてまとめみてました。

ストークでサイドバーのタイトル文字を中央揃えにする方法がなかったので紹介!

たくさん出回っているWordPressのテーマ。

そのほとんどのサイドバーは、左詰めです。

そのままでも、問題はありませんが中心に表示されることで、左右でバランスがとれて見栄えが良くなります。

片方に、余白が残るのもイヤだったので中央揃えにすることにしました。

ネットで調べても方法についてまとめた記事がなかったので、今回自分なりにまとめてみました。

ストークでサイドバーのタイトル文字を中央揃えする方法

今回のカスタマイズは、ストークの小テーマが入っている前提でお伝えします。

子テーマについては、ストークの公式サイトをご参照ください。

ざっくり手順
  1. 「ダッシュボード」を開く。
  2. 「外観」を開く。
  3. 「テーマ編集」を開く。
  4. 「スタイルシート(style.css)」を開く。
  5. コードを書き込んで、「ファイルを更新」で完了。

▲手順は以上のようになります。

ダッシュボード→外観→テーマ編集→に移動する。

スクリーンショット 2017 10 16 17 20 41

「ダッシュボード」を開いて、「外観」から「テーマ編集」のページに進みます。

スタイールシートを開いて確認。

スクリーンショット 2017 10 16 17 25 17

「テーマ編集」を開いた直後に「スタイルシート(style.css)」ですが、念のためチェック。

前述しましたが、ストークの子テーマの「スタイルシート(style.css)」であるかもしっかり確認してください。

スタイルシートにコードを記入する。

コードを書き込みます。

スクリーンショット 2017 10 16 17 32 30
/* サイドバーのタイトル中央寄せ */
#sidebar1 h4 {
    text-align: center;
}

▲書き込むコードはこちらコード。

書き込んだ後、「ファイルを更新」で作業終了です。

中央揃えしているか確認。

スクリーンショット 2017 10 16 17 35 01

▲最期に、中央揃えになっているか確認しましょう。

☞まとめ

今回紹介した方法を用いなくても、ブログの執筆や運営には、なんら問題はありません。

しかし、毎度ブログを眺めていると細かいところが気になってくるものです。

ほんとうに、ささいなことだけど個人的に見た目が変わったことに満足。

また、今回はストークを用いての説明でしたが、販売元が同じアルバトロスハミングバードも中央揃えは可能です。

同テーマを使っている方は、この機会に修正してみてはいかがでしょうか!?

以上、「ストークのサイドバーのタイトル文字を中央揃えにする方法」と題して記事をお送りしました!!