ブログテンプレートの【賢威7】で記事の下にスライドショーのCTAを設置する方法について

 

どうもやすです^^

 

 

今回はブログテンプレートの【賢威7】で

 

 

記事の下にCTA【コールトゥアクション】として

 

 

画像を使ったスライドショーを設置する方法について

 

 

解説をしていきたいと思います

 

 

 

僕のブログで実際に使っているブログテンプレート【賢威7】に関しては

下記を御覧くださいね＾＾

↓

賢威7はどんな事ができるテンプレートなのか？

 

 

 

プラグインの導入とスライドショーの準備をしておこう

 

 

このCTA【コールトゥアクション】の設定には

 

 

事前にプラグイン【Easing Slider】の導入と【スライドショーに使う画像の設定】

 

 

をしておく必要があります

 

 

この2つに関しては下記で図解【画像を使って】解説をしています

↓

プラグインのEasing Sliderの設定について

 

上記の文をクリックしますと　僕のブログの解説記事に飛びます＾＾

 

 

 

CTAとは何か？解説します！

 

 

 

まずCTAに関してですが

 

 

少しだけここでも解説をしていきたいと思います

 

 

CTAとは【コールトゥアクション】の略です

 

英文字ですと【Call To Action】これの頭文字をとって【CTA】と略します＾＾

 

 

日本語での意味は【行動喚起】の意味があります

 

 

行動喚起とはあなた自身のブログに訪れた読者さんに対して

 

 

【行動を促していく】為に使われます

 

 

ここでの行動とはどのような事なのかですが

 

 

あなた自身のメールマガジンに読者さんを増やしたい時に

 

 

ブログで　この【CTA】を使って【メールマガジンの登録ページ】に行ってもらったり

 

 

【保険の資料請求についてはこちら】など

 

 

あなた自身が見てもらいたいページに対して

 

 

読者さんに【行動してもらう】という目的で使う事ができますよ＾＾

 

 

 

やすのブログでも記事の下に僕自身の【メールマガジン登録ページ】のリンクを貼った

 

 

 

スライドショーの画像が動いているのがわかると思います

 

 

今回は　それと同じように　記事下に自動的に表示させる方法についての解説になります

 

 

 

テーマの編集を使用するので注意点が1あります

 

 

今回のCTA【コールトゥアクション】設定でテーマの編集【Single.php項目の編集】

 

 

をしますので　事前に編集していない【Single.php】をバッグアップ

 

 

しておくことをおすすめします

 

 

もし万が一間違えてしまった際にバックアップをしておけば

 

元に戻せますので＾＾

 

 

テーマ編集のSingle.phpのバックアップ方法について

 

 

バックアップの方法がわからないと作業に移れないと思いますので

 

 

 

バックアップの方法について解説していきますね＾＾

 

 

 

まず【外観】から【テーマエディター】もしくは【テーマの編集】をクリックします

 

 

 

このような一覧が出ますので　右下にある項目一覧にマウスの矢印をあわせて

下に動かしていき【個別投稿】の項目があるのでクリックします

 

 

 

でてきたコードを全てコピーします

 

 

 

コピーの仕方は　コピーするコードの先端にマウスの矢印をあわせ

 

 

左をクリックしたまま右に動かします

 

 

このように青の反転が出ますので

 

コードの最後の部分まで

 

 

この青の反転を持っていき　左クリックを離してから

 

 

キーボードの【CTRLキー】を押しながら【Cキー】でコピーできますよ＾＾

 

 

そしてメモ帳を起動します

 

 

起動の仕方になるのですが、Windowsでのみの操作解説になりますが

 

 

左下にあります　この項目に【メモ帳】と記載します

 

上記のようにメモ帳があるのでクリックします

 

 

 

そしてメモ帳に　このようにわかりやすい名前【賢威のシングルphp】という風に

上に記載して

 

 

その下から先程のコードを貼り付けます

 

 

貼り付け方法は　【CTRLキー】を押しながら【V】を押します

 

 

これでコピーしたものを貼り付ける事ができますので

 

 

これでコードのバックアップは完了です＾＾

 

 

保存の仕方ですが、左上の【ファイル】から【名前をつけて保存】

 

 

をクリックします

 

 

ファイルの名前を記載して　ファイルの種類は【テキスト文書】で大丈夫です＾＾

 

 

【保存】をクリックします

 

 

 

これで保存が完了しました

 

 

実際に作業に入っていきましょう！

 

 

 

賢威の個別投稿　Single.phpにスライドショーの画像を埋め込む方法

 

 

では本題のスライドショーの画像をどのようにして

 

 

埋め込んでいくのか　これについて解説していきます

 

 

まず上記で設定して頂いた【Easing Slider】のプラグインが入っていると

 

 

ブログのダッシュボード項目欄に【Sliders】があると思います

 

これにマウスをあわせますと

 

 

右側に一覧が出てくるので　その中から【All Sliders】を

 

 

クリックします

 

 

 

作成済みのスライドショーの一覧が出てきますので

 

 

貼り付けたいスライドショーの右端にある

 

 

このコード【Template Function】の中のコード

 

 

これをコピーしておきます

 

 

コピーの仕方は　コピーするコードの先端にマウスの矢印をあわせ

 

左をクリックしたまま右に動かします

 

 

青の反転が出ますので　コードの最後の部分まで

 

 

 

この青の反転を持っていき　左クリックを離してから

 

 

キーボードの【CTRLキー】を押しながら【Cキー】でコピーできますよ＾＾

 

 

 

コピーができましたら　次はテーマの編集に移ります

 

 

 

 

【外観】から【テーマエディター】もしくは【テーマの編集】をクリックします

 

 

 

このような一覧が出ますので　右下にある項目一覧にマウスの矢印をあわせて

下に動かしていき【個別投稿】の項目があるのでクリックします

 

 

 

個別投稿【Single.php】の画面に行きますので

 

 

今回は記事の1番下にCTAを表示させたいと思いますので

 

 

このページ【Single.php】の下にある【メインコンテンツ】の表記の上に

 

 

貼り付けたいと思います

 

 

コードを貼り付けましたら　画像のように

 

コードの上にわかるように　<!–スライドショー–> と表記をしておきます＾＾

 

 

 

そしてコードを貼り付けた下の方に　今度は<br>【改行のコードの意味があります】

 

 

を表記しておきます＾＾

 

 

 

そして下の方にあります【ファイル更新】をクリックします

 

 

 

更新をクリックした後　【ファイルの更新に成功しました】

 

 

という表示が出れば　保存は完了になります

 

 

 

実際にあなた自身の記事を1つクリックして

 

 

 

1番下まで移動させてみてください＾＾

 

 

 

このようにCTA【画像】が表示されていると思います＾＾

 

 

 

以上で記事の下にCTAを表示させる方法についての

 

 

 

記事解説を終わりにします＾＾

 

 

 

やすでした^^