ハズ部さんのテーマ「Xeory Extension」

私にとってネットの神様である「ハズ部」さん

最近、バズ部のXeoryという無料テーマができたので、Xeory Extensionというサイト型テーマで構築・カスタマイズしてみたいと思います。

Xeory Extensionのトップページのメインビジュアルは、爽やかな無地にメッセージととてもシンプルになっていますが、私個人としてはちょっと大きすぎるかなという気がしたので修正してみました。

Xeory Extensionの初期トップページ

Xeory Base（ブログ型）とXeory Extension（サイト型）が出ています。

サイト型のExtensionももちろんブログとして使えるので、私はXeory Extensionで制作してみます。

私はトップはしっかりデザインされていて、記事ページは2カラムになるタイプを探していたので、今回のXeory Extensionは理想どおりでした。

しかし、デデデーンとしたTOPで記事がまだ少い今は、ちょっと強調しすぎて恥ずかしいので、ちょっとカスタマイズします。

ヘッダーをスライダー画像に設定

スライダー式にしようと思うので、画像を4枚用意しました。

私の場合は画像サイズ：1400×400にしました。

ヘッターに「Meta SLider」を差し込み、バックのカラーをホワイトに変更してスライダーに使用する画像カラーを目立つように変更しました。

スライダーの画像によっては、バックになるカラーでスマートさがなくなるので、淡いカラーが良いと思います。

フッターのバックカラーの変更

管理画面＞外観＞テーマの編集＞スタイルシート (style.css)

/* —————————————-
* header
—————————————- */
#header {
background: #47B39D;
padding: 0;
overflow: visible;
}

上記の部分の　background: #◯◯◯◯◯がカラーになっているので　ホワイトの場合は　#ffffff　に変更と、好きなカラーに変更してください。

私の場合は…ホワイトなので下記のように変更しました。

/* —————————————-
* header
—————————————- */
#header {
background: #ffffff;
padding: 0;
overflow: visible;
}

スライドショーを入れる

今回はプラグイン「Meta Slider」を使用して制作しました。

「Meta SLider」はテンプレートに含めるショートコードが作成できるので、簡単にheader.phpに差し込むことができます。

 TOMOIKUロハス生活で丁寧な暮らしを！ 

WordPressプラグイン・スライドショー「MetaSlider」初心者でもセンスあるサイトに！

https://tomoiku.com/2016/06/02/%e3%82%b9%e3%83%a9%e3%82%a4%e3%83%89%e3%82%b7%e3%83%a7%e3%83%bcmetaslider/

スライドショー「Meta Slider」でサイトに動きを表現プラグインをしようすることで、センスあるサイトができちゃいますね。ただWordPressのバージョンによって、正常に作動しない場合もあるので、確認しましょう。注意事項を記載した、下記の記事も合わせてお読みい...

「Meta SLider」のショートコートをテーマヘッダー (header.php)に貼ります。

管理画面 ＞ 外観 ＞ テーマの編集 ＞　テーマヘッダー (header.php)