テンプレートキングのスライド画像をSmart Slider 3 に変更する方法 | ニュース特報館

テンプレートキングのスライド画像をSmart Slider 3 に変更する方法

スポンサーリンク

企業サイトを作るので、テンプレートキングの無料テンプレートを使いました。

プルダウンメニューが8つ一列に並ぶこと、copyright 表示を変更できるが、選んだ理由でした。

問題は、トップページの画像サイズが、1200×300の固定で融通が利かない事でした。

そこで、word press のプラグイン smart slider 3 を使うことにしました。

  • 目標は、トップページのヘッダーにスライド画像を置く。
  • 個別ページには、トップページの画像を表示しない。

テーマヘッダーからヘッダー画像の記述を削除する。

117行目、</div><!– #header-nav-area –>

の次、119行目

<?php
if ( is_home() || is_front_page() ) :
$slide_count = 0;
for ( $i = 1 ; $i < 6 ; $i++ ) {
// Slider URL

から後ろ
</div><!– #header-title-area –><?php
endif;
endif; // is_home()/is_front_page() ?>
までを削除します。

Smart Slider 3 のPHP コードを削除した場所に挿入

Smart Slider にヘッダー画像を挿入する方法は、投稿ページと個別ページにショートコードを記述する方法と、PHP コードをテーマヘッダーに記述する方法があります。

20190915225027
投稿ページと個別ページにショートコードを記述した場合は、記事タイトルの下に画像が挿入されます。

PHP コードをテーマヘッダーに記述した場合は、各ページの一番上に画像が表示されます。
トップページの場合は、テンプレートキングのテーマの所定の場所に画像が収まります。

挿入したPHPコード
<?php
echo do_shortcode(‘[smartslider3 slider=3]’);
?>

画像サイズを調整する

今回は、PHP コードをテーマヘッダーに挿入したので、画像がページの横幅一杯に表示されて大きくなりすぎました。

20190915230456
この場合は、右上の赤丸で囲んだ「SETTINGS」をクリックすると、画像サイズを始め、いろいろな設定ができます。

トップページだけカル―セルを表示するようにテーマヘッダーを変更する

全部のページに同じヘッダー画像が表示されるのは、うっとしいのでトップページだけに表示するように変更します。

<?php if ( is_home() || is_front_page() ) : ?>
php
echo do_shortcode(‘[smartslider3 slider=3]’);
<?php endif; ?>

これで、トップページだけに、ヘッダー画像が表示されるようになりました。

ところで、デスクワークをしていると、食事の準備をしたり、外に食べに行くのも面倒になることが多いです。
そんな時に最近利用するのが、マッスルデリという冷凍の弁当の宅配サービスです。
冷凍の弁当といってもただの弁当じゃなくて、ボディメイクをしている人用の弁当なんです。

そのため、管理栄養士が監修した高タンパク質で低カロリーに設計された弁当なんです。
オタクみたいな生活をしていると、体に良くないので、せめて食事だけでも専門家が作った食事を食べるのもいいんじゃないかと思って注文してみました。

見た目がきれいで、味も美味しいし、体にもいいとなれば、利用価値あると思っています。
マッスルデリの口コミなどはこちら

ARECA ARC-8050T3-12 3.5/2.5HDD対応SAS/SATA12台搭載可 Thunderbolt3対応RAID装置

  • 40Gbpsの高速データ転送に対応したThunderbolt3は、4K映像などの高容量データでもストレスのない転送をサポート
  • Thunderbolt3ポートが2基搭載されているので、デイジーチェンにより最大6台までのThunderbolt周辺機器を接続することが可能
Tips
スポンサーリンク
管理者をフォローする
ニュース特報館