「WordPress」ショートコードとは?記事中にアドセンスを設置する

Short code
photo by Odyssey

WordPressにはショートコードという機能がついています。WordPressを使っている方なら是非とも覚えたい機能です。今回はこのショートコードについて紹介したいと思います。

SPONSORED LINK

▼この記事の目次

ショートコードとは

2008年3月以降、WordPressバージョン2.5から備わっている機能です。だいぶ前のバージョンから利用可能なので大抵のWPなら使えることかと思います。

まず「functions.php」にショートコードの関数をあらかじめ記述しておきます。

あとは投稿記事内で関数を実行したい場所に短い「ショートコード名」を指定するだけで「functions.php」で指定しておいた関数が呼び出され実行されるという仕組みです。長いコードを書く手間がはぶけるというわけです。

記事内だけではなく固定ページやサイドバーでも実行することができます。

ショートコード・メリット

通常の記述方法に比べ短い記述で呼び出せるということはわかりましたが、どんな場合に使うのでしょうか?
投稿記事内に毎回同じ記述をしているといった場合はショートコードを利用することでだいぶ効率的になるでしょう。例えば「[sc]」といった簡単な記述で実行されるのですから。([]で囲む)

後になって記述を変更したいといった場合は「functions.php」のショートコードの記述元だけ変更すれば一度に変更できるというメリットもあります。各記事ごと変更してまわるというのは非効率ですからね。

このように効率的に投稿記事内の関数を管理できますし、覚えやすい名前「ショートコード名」を自由に付けられるという点もメリットなのでしょう。

ショートコード・使い方

8f79749597a622ad4c1a2fecf9f69cb4_s

「functions.php」に「add_shortcode」を記述します。実際どのように記述するのか見てみましょう。

add_shortcode(‘ショートコード名’ ,’実行する関数名’);

このようになります。「ショートコード名」は記事内で指定する名前です。以下のように必ず [] で囲んでください。

ショートコード名 = [sc]

それでは動作を確認してみましょう。

シンプルな表示例

「functions.php」に以下の記述を追加します。「ショードコード名」、「関数名」は任意の文字列で結構です。

function display() {
return “ショートコードを表示”;
}
add_shortcode(‘sc’, ‘display’);

・sc =ショートコード名
・display =実行する関数名

「functions.php」に記述したら、投稿の編集で [sc]を記述します。ちなみにビジュアルエディタ・テキストエディタ(HTML編集)どちらに追加してもショートコードとして認識されます。

[sc]

記事中にGoogleアドセンスを設置

続いて記事中にGoogleアドセンス広告を設置する方法を見てみましょう。
プラグインを使い記事中に設置する方法もありますが、この方法の方がシンプルで一度設置すれば後々編集する時の手間がかかりませんし簡単です。

「functions.php」に以下の記述を追加

//adsenseショートコード
function display() {
return’
<div class=”ad”>
<p style=”color:#504e4e;margin:0;”>スポンサーリンク</p>
※※ アドセンスコード貼り付け位置 ※※
</div>
‘;
}
add_shortcode(‘sc’, ‘display’);を入れる

※「functions.php」の場合、記述方法が間違えていたり改行があるとすぐにサイトが真っ白になってしまう可能性があるので注意が必要です。そうなってしまった場合FTPクライアントソフトでファイル修正する必要があります。

関連記事 : functions.phpで画面が真っ白になった時の対処法

「style.css」には以下の記述を追加でOK

/* adsenseショートコードを中央に */
.ad{
margin: 0 auto;
text-align: center;
margin-bottom:85px
}

まとめ

ショートコードを使えば編集時も一度に変更可能なので作業効率化につながります。PHPの記述に慣れていない場合でも簡単に設置できることかと思います。

関連記事




この記事が気に入ったら
いいね!しよう

最新情報をお届けします

Twitterでめちゃログをフォローしよう!