【記事一覧に広告表示】ストーク19インフィード広告を複数設置する方法

・よく記事一覧に広告があるの見かけるけどどうやるの？

・収益をちょっとでもUPさせたい

こんな悩みを解決します。

記事一覧も収益化できたら嬉しいですよね。

僕もこのように思いブログの記事一覧に広告を貼り、収益を増やすことに成功することができました。

こんなところに広告なんか貼ってもみられないだろーとか思っていたのですが、意外とクリック率も高く収益UPにつなげることができます。

そこで今回は、記事一覧に広告を貼る方法について紹介します。

PHP作業は一見難しいように見えますが、今回はコピペのみで完了するので難しいことはありません。

難しそうな手順もありますが、無理に理解しようとせず「こうすればいいんだ〜」くらいで大丈夫です。

僕も始めの頃はよくわかりませんでした

この記事を読めば、誰でも記事一覧に広告を表示できるようになるので、収益をUPできるようになりますよ。

インフィード広告をざっと説明

「インフィード広告」と聞いてもあまり想像しづらいですよね。

投稿と投稿の間に馴染んで表示されている広告のようなものです。

よくTwitterなどみていると、「プロモーション」と書かれた投稿がありますよね。

あんな感じの広告がインフィード広告です。

ということで、今回は「インフィード広告」をSTORK19の記事一覧に設置する方法をご紹介します。

他のワードプレステーマもほとんど同じなので、参考にしてください。

インフィード広告をカスタマイズしよう！

インフィード広告のデザインをそのままにしてしまうと、ただの広告が表示されるだけなので、設定をしていきます。

Googleアドセンスで新しいユニットからインフィード広告を選択し、手動で広告スタイルを作成していきます。

自分のブログの記事一覧のレイアウトに合うデザインを選択しましょう。

ストーク19の場合「横画像」を選択します。

広告コードを設定

これから、インフィード広告のデザインの設定に入っていきます。

ストーク19のシンプルレイアウト場合、そっくり真似すれば同じようにできます。

まずはグローバルオプションから細かい設定をしていきましょう！

パディング・・・20、20、10、5に設定します。

次はイメージの設定をしていきます

パディング・・・0、15、5、0

次に見出し設定

フォントサイズ・・・20px
パディング・・・0、0、10、0

あとは、説明は非表示にしておきましょう。

これで設定は完了です。

ストーク19のファイル編集

テーマファイルを編集する際は、必ずバックアップを取った上で行うことをオススメします。

FTPソフトを使用してテーマからファイルダウンロード後、編集し再度アップロードする流れになります。

僕はFTPソフトは「FileZilla」を使っています。

こちらで、FTPソフトを接続する方法が載っているので参考にしてください。

これから、記事一覧に広告を表示させる方法を紹介しますが、複数のパターンを紹介するので見出しをみてから内容を読んでください。

その前に、今回編集させるファイルはこちらにあります。
※サーバーとFTPソフトが接続されているものとします

画像でみるとわかりやすいと思うので、こちらをみてください。

記事一覧に広告を一つ表示させる方法

ここからは難しく見えますが、コピペ作業で完了します。

まずは、先ほどのファイルを開いてください。
※編集前に必ずバックアップをとってください。

上の方にある

<?php while (have_posts()) : the_post(); ?>

のコードをこのように書き換えます。
上記のコードも含まれています。

<?php
$ads_infeed = '3'; //何番目に表示したいか
$ads_infeed_count = '1';
?>
<?php while (have_posts()) : the_post(); ?>
<?php
if($ads_infeed_count == $ads_infeed){
?>

<!-- ここに取得した広告コードをいれる -->



<?php
}
$ads_infeed_count++;
?>

これで、記事一覧の中に1つ広告を設置することができました。

‘3’と書かれている数字を変更すれば、広告の位置を変更することができます。

編集したファイルをアップロードするのですが、ここで親テーマにアップロードしてしまうとストーク19がアップデートされると消えてしまうので、

子テーマにアップロードしておきましょう。

記事一覧に2つ広告を表示する方法

まずは、先ほどのファイルを開いてください。
※編集前に必ずバックアップをとってください。

上の方にある

<?php while (have_posts()) : the_post(); ?>

を以下のように変更します。

<?php while (have_posts()) : the_post(); $count++; ?>

<?php if ($count == 3): ?>

<!-- 広告コード１ -->



<?php elseif ($count == 6): ?>
<!-- 広告コード２ -->




<?php endif; ?>

これで、記事一覧の中に2つ広告を設置することができました。

上記のコードでは、記事一覧の3番目と6番目に広告が表示されます。

‘3’ ‘6’と書かれている数字を変更すれば、広告の位置を変更することができます。

編集したファイルをアップロードするのですが、ここで親テーマにアップロードしてしまうとストーク19がアップデートされると消えてしまうので、

子テーマにアップロードしておきましょう。

記事一覧に複数の広告を表示する方法

まずは、先ほどのファイルを開いてください。
※編集前に必ずバックアップをとってください。

上の方にある

<?php while (have_posts()) : the_post(); ?>

を以下のように変更します。

<?php
$ads_infeed = array(2,4,6); //何番目に表示したいか
$ads_infeed_count = '1';
?>

<?php while (have_posts()) : the_post(); ?>

<?php
$ads_disp = in_array($ads_infeed_count, $ads_infeed);
if($ads_disp){
?>
<!-- ここに取得した広告コードをいれる -->



<?php
}
$ads_infeed_count++;
?>

これで、記事一覧の中に複数の広告を設置することができました。

上記のコードでは、記事一覧の2番目と4番目と6番目に広告が表示されます。

‘2’ ‘4’ ‘6’と書かれている数字を変更すれば、広告の位置を変更することができます。

<?php
$ads_infeed = array(2,4,6); //何番目に表示したいか
$ads_infeed_count = '1';
?>

上記のカッコの中の数字を増やせば広告の表示数を増やすことができます。
例

<?php
$ads_infeed = array(2,4,6,8); //何番目に表示したいか
$ads_infeed_count = '1';
?>

これで、4つ広告が表示されるようになります。

編集したファイルをアップロードするのですが、ここで親テーマにアップロードしてしまうとストーク19がアップデートされると消えてしまうので、

子テーマにアップロードしておきましょう。

最後に

今回は記事一覧に広告を表示させる方法について紹介しました。

記事一覧は意外と収益化できる部分ですので、少しめんどくさい作業かもしれませんがこの機会に設置してみましょう。

FTPソフトはこちらから

『なかなかブログ記事を読んでもらえない』という人は、以下の記事でクリック率が向上するアイキャッチ画像について紹介しているので、参考にしてみてください。

関連記事：
≫きれいなアイキャッチ画像の作り方