スティンガー5 カスタマイズ 第4回「グローバルナビの下に「Meta Slider」を使用して、スライド画像の挿入」

グローバルナビの下に「Meta Slider」を使用して、スライド画像の挿入

今回は上記画像のようにグローバルナビの下にスライド画像を挿入してみたいと思います。

スライド画像作成

スライド画像の作成には「Meta Slider」というプラグインを使用し「ショートコード」を作成します。
インストール方法とショートコードについては下記のリンク先で紹介しています。
ワードプレス プラグイン「Meta Slider」 のインストールと使用方法

ショートコードを挿入する方法は下記のリンク先で紹介しています。
スティンガー(stinger)のテーマのトップ、投稿ページ、に「Meta Slider」を挿入する方法

ショートコードの挿入位置

スティンガー5 カスタマイズ 
次にスライド画像を入れるため「Meta Slider」を使用して作成された、シュートコードを挿入します。

ワードプレスのダッシュボードから、テーマの編集を選択して「home.php」をの編集画面にし、上記画像にもありますが、挿入位置は上から4行目に作成されたショートコードをいれます。

ショートコードを入れるときの注意点

<?php echo do_shortcode( 'ショートコードが入る部分' ); ?>

ショートコードを入れるときの注意点としては、上記のコードのようにphpコードを使用して挿入することです。
「ショートコードが入る部分」の所に作成したショートコードをそのままいれれば大丈夫です。

最後に作成したトップページ

スティンガー5 カスタマイズMeta Slider 
これで上記のように、トップページにスライド画像が入ると思います

前回と前々回はこちら
[stinger5]スティンガー5をビジネステンプレートに、カスタマイズする方法 第2回「ヘッダーに企業電話番号の追加」
[stinger5]スティンガー5をビジネステンプレートに、カスタマイズする方法 第3回「グローバルナビの変更」

スティンガー5のカスタマイズまとめ記事はこちら

ワードプレスのテーマ「stinger5」をカスタマイズして、企業のホームページとして2015年1月から運用します

The following two tabs change content below.
AKIRA

AKIRA

上尾市在住の、リサイクルショップで働くサラリーマン。 Twitter・Facebookやってます。 小心者なので、誰か声かけてくれると嬉しいです。
スポンサーリンク
スポンサーリンク
スポンサーリンク

コメントをどうぞ

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