このサンプルの注意事項と補足

本サンプルのようにするには事前に以下のプラグインを有効化及びサムネイル画像の設定が必要です※アイキャッチ画像は「Featured Video Plus」使用を想定したデザインデータです。

サンプルサイトについての補足

YouTube動画背景

「テーマ管理」>「「ヘッダー」>「YouTube背景」で設定できます。

ヘッダーエリアのテキスト説明はコチラ

記事トップスライドショー

トップページ

トップページトップのスライドショーは「Smart Slider 3」を併用しています。

Smart Slider 3」で作成したショートコードを「トップページ上部ウィジェット」に設定します。

そのままでは

  • サイト全体に表示される
  • 周りに隙間ができる

のでPCだけに表示するショートコード([pc][/pc])と隙間をなくすCSSクラス<div class="st-eyecatch">で囲んでいます。

記事トップ

記事トップのアイキャッチ画像をYouTube動画に変えるには「Featured Video Plus」を使用しています。

プラグイン設定例

②の登録ボタンはコチラ

YouTuberスライドショー

トップページや投稿記事下のYouTubeスライドショーは同じく「Featured Video Plus」で設定したアイキャッチ動画(YouTube)をカテゴリ一覧スライドショーで表示しています。

また、<div class="youtube-slider">で囲むことで専用CSSを適応してデザイン崩れを防いでいます。

表示速度について

YouTube動画を大量に張るとサイトの読み込み速度が低下します。

「キャッシュ系プラグイン」や「LasyLoadSEO(遅延読込プラグイン)」等と併用することで軽減できる場合があります。

※紹介している他社製プラグインはバージョンや使用方法、環境などにより正常に動作しない可能性もございます

人気動画紹介

Featured Video Play Icon
1

これはダミーのテキストですこれはダミーのテキストですこれはダミーのテキストですこれはダミーのテキストです これはh2タグの見出しです これはダミーのテキストですこれはダミーのテキストですこれはダミーの ...

Featured Video Play Icon
2

Welcome to WordPress. This is your first post. Edit or delete it, then start writing!

Featured Video Play Icon
3

見出し 見出し壱 見出し弐 見出し参 見出し四 見出し五 見出し六 引用 (Blockquote) テスト 一行の引用。 ハングリーであれ、愚かであれ。 cite 参照を含む複数行の引用。 これは言語 ...

Copyright© YouTuber , 2024 All Rights Reserved Powered by AFFINGER5.