WordPressテーマ「STORK」のコピーライトをセンタリング表示させてみる(PC)

WordPressテーマ「STORK」のコピーライトをセンタリング表示させてみる(PC)

当ブログでも愛用しているWordPressテーマ「STORK」のコピーライトをセンタリング表示する方法を書いてみます。

複数のブログに導入するには、複数のライセンスが必要!

STORKのコピーライト

今回のSTORKのコピーライトの話は、全てPCで閲覧した場合のお話です。

スマホ表示では、コピーライトはデフォルトでセンタリングされています。

PCで閲覧すると、通常、STORKのコピーライトは以下のように表示されているはずです。

STORK コピーライト
  • 運営者プロフィール
  • お問い合わせ
  • プライバシポリシー
  • サイトマップ

のように、自分の好きな「フッターメニュー」を作成して設定する使い方が一般的ですかね。

念のため、この「フッターメニュー」の設定方法も説明してみます。

STORK フッターメニューの設定方法

公式サイトに載っています。

一応、僕も書いてみます。

STORK フッターメニュー設定方法
  1. 管理画面にGo!
  2. 外観の「メニュー」
  3. 「フッターナビ」メニューがある場合は「編集するメニューを選択」から選択
  4. 「フッターナビ」メニューがない場合は「新規メニューを作成」から新規作成
  5. メニュー名は「フッターナビ」でOK
    ※キャプチャ画像では「フッターメニュー」としています。
  6. 「メニュー設定」欄の「フッターナビ」にチェックを付けるのが重要です!

以上でフッターメニューを作成できます。

ただ、このメニューは不要だから、一切表示させなくていいという人もいるかもしれませんね。

そういう場合は、「メニュー設定」欄の「フッターナビ」のチェックを外す、もしくはこのメニュー自体を削除するかでOKです。

コピーライトをセンタリング(中央寄せ)する方法

フッターメニューを非表示にしても、コピーライトの位置は自動的にセンタリングしてくれません。

※今後のSTORKのアップデートで改善される可能性もあります。

こんな状態ですね↓

コピーライトを中央に表示させたい!ですよね。

対応する方法を説明してみますね。

STORKのCSSをカスタマイズするので、STORKの子テーマのCSSに追記します。

STORKをカスタマイズしていきたい人は、必ず子テーマを導入しましょうね。

子テーマのCSS

STORKの子テーマを導入すると、CSSのパスは以下のようになります。

/example.com/wp-content/themes/jstork_custom/style.css

「example.com」はドメインの例なので、ご自身のドメインに置き換えてくださいね。

このCSSファイルのどこかに以下を追記します。

/* コピーライトをセンタリング */
.footer .copyright {
  display: block;
  float: none;
  text-align: center;
}
マメ知識
通常ブロック要素は「text-align: center;」を指定するだけで、テキストをセンタリングできるんですが、STORKの親テーマで設定されるCSSを見たところ、コピーライトには「display: inline-block;」と「float」が指定されていました。
それらを解除することでセンタリングできました。

CSSのどこかに追記すると言っても、今回はPC閲覧時に適用させたいので、スマホ用のスタイル部分には書かないようにしてくださいね。

もし、スマホ用のスタイルをカスタマイズしていて、既に書かれている場合は、下記のように「@media」で始まるメディアクエリが使われているはずです。

この括弧の中には記述しないようにしてください。

@media only screen and (max-width: 767px) {
・
・
・
(これはスマホ用のスタイル)
・
・
・
}

以上でコピーライトをセンタリング表示させることができました!

STORK固定フッタープラグインをリリース

当ブログでも使用している、人気WordPressテーマ「STORK(ストーク)」に関し、スマホで閲覧した際に以下のような固定フッターメニューを表示できるプラグインをリリースしました。

年々大型化するスマホの画面では、もはやページ上部のハンバーガーメニューはイマイチ使いづらくなってきたと言えます。

ページ下部、スマホホームボタンのそばに固定フッターメニューが表示されるとかなり使いやすくなります。

STORKテーマ限定の機能とはなりますが、ユーザービリティの向上やSNSでの拡散、他の記事への誘導などに、このプラグインをぜひ使ってみてください。

Facebookアカウントでコメント

※本コメント機能はFacebookによって提供されており、この機能によって生じた損害に対してザ サイベースは一切の責任を負いません。

WordPressテーマ「STORK」のコピーライトをセンタリング表示させてみる(PC)

ABOUTこの記事を書いた人

とみっち

数年前までバンド活動してました。現在はブログを運営して暮らしています。サウンドクリエイター、Webクリエイター。息子は4歳になりました。長野市出身。埼玉県本庄市在住。 【興味】音/Web/車(GolfV GTI等)/田舎/旅/酒 ※自然の音からデスメタルまで聴きます。 @tomicci 詳しいプロフィール 【運営サイト】 ザ サイベース おと風景