Stinger 固定ページをカスタマイズする

stinger

WordPress用のテーマ「Stinger5」を色々とカスタマイズしています。

今回は、Stinger5のデフォルトの固定ページの見た目を少しカスタマイズする方法をご紹介します。

Stinger5のデフォルトの固定ページ

スクリーンショット 2015-11-06 10.24.05

Stinger5の固定ページのデフォルトの見た目はこんな感じになっているかと思います。シンプルで、わかりやすいなーと思いますが、少しアレンジして個性出したいなと思うので、今回は、固定ページの項目に色をつけたいと思います。

事前準備

固定ページの見た目をWordPressの管理ツールより操作したい場合、cssをいじれるようにするために、「Jetpack」のインストールが必要です。

Jetpackのインストールはこちらをご参考ください。

WordPressの管理ツールからcssを編集

スクリーンショット 2015-11-06 10.33.24

Jetpackインストール済みの場合、管理ツールの外観>cssの編集を選択可能になります。選択すると、上記のような画面に遷移するので、こちらの画面で、固定ページのcss編集を行います。

とりあえず、今回は、固定ページ部分の見た目変更のみなので、以下のソースをコピペすればOKです。

完成!

上記cssをコピペして保存し、サイトを確認します。

正常な場合、以下のように固定ページの見た目が変更されます。

スクリーンショット 2015-11-06 11.47.04

 

色コードなどを変えれば、違った見た目になるので、勉強がてら色々試してみてください。

 

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

ABOUTこの記事をかいた人

主に芸能ニュース・エンタメ・WordPress・iOS・Android・ゲームについて書いてます。 楽しいこと、面白いことが大好き。本業はシステムエンジニア。芸能ニュース、アフィリエイト、スマホゲーム、アプリ開発についての記事を書いていきます。