ラベル nend の投稿を表示しています。 すべての投稿を表示
ラベル nend の投稿を表示しています。 すべての投稿を表示

2014年11月2日日曜日

Bloggerで作成したブログにnend広告を貼る(ブログ貼り付け編)

今回はnendで作成した広告枠をBloggerで作成しているブログに貼り付けます

まずは貼り付け用の広告を取得します
nendにログインして[広告枠の管理]-[広告枠]を選択
自分が登録した広告枠が表示されます


そこで広告枠名の下にある[広告コード]を選択。

上がオーバーレイ用、下がインライン用。
パラメーターを隠してしまうと一緒ですね^^;

何度でも表示できるので、いったんは置いておきます。
(別タブorウィンドウにしておいておきましょう)

次にBloggerに埋め込みます。
ここからが肝心です。

Bloggerのテンプレートを選択してください
すると、左にPCでの表示サンプル、右にモバイル時の表示サンプルが出ます
ここで[HTMLの編集]を選択してください。

すると画面に自分のブログのHTMLソースが表示されます

そこに先ほど置いておいた広告コードを埋め込みます
まずはオーバーレイの方。(インラインと挿入位置が違います注意してくださいね)
オーバーレイはヘッダーと言われる部分に挿入します
スクリーンショットの赤枠の部分。
<head> 〜〜〜 </head> の間に挿入です。
今回はインデント(段落揃え)等気にせず、どん!と<head>のすぐ下に
コピー&ペーストしました。
はい。これでオーバーレイは完了!
無事に埋め込まれました。

次にインライン。
こちらはヘッダーではなくボディと言われる部分に挿入します。

こちらも赤枠の部分。
今度は<body> 〜〜〜 </body> の間に挿入です。
(</body>は見えませんがずっと下にあります)
こちらもインデント等気にせず、ドンッ!と<body>のすぐ下にコピー&ペースト!!
はい。これでインラインも完了!

(余談)
ちょっとおや?と思った方もいるかもしれませんが、行番号とHTMLコードの間。
ここをクリックすると三角がでてタグを閉じることはできます。
オーバーレイのとき開いていたheadタグがインラインのときは畳まれています。
見やすいですね。
三角をクリックすると開きますので、自分の使いやすいように編集するところ以外は
閉じたり開いたりしちゃいましょう!

ここまでできたら[テンプレートの保存]を選んで編集したHTMLを保存します
これでまずはひとつ山を越えました。
そうまだひとつだけ。といってももうひとつしか山はないのですけどねw

今、編集したテンプレートはPC表示用のテンプレートなのです。
なのでモバイルで使用できるようにしてあげないとモバイルで表示されません。
nendはモバイル向け広告なのでPCでいくら表示しても
ちーーっとも見ることはできないのです^_^;

次はBloggerのテンプレートにあるモバイルの歯車アイコンを押しましょう
(さっき[HTMLの編集]を選択したページです)
するとモバイル用のテンプレートが選択できるようになります。
最初はデフォルトになっているので、ここを選択し選択肢をびろっと広げます。
旅行までしか表示されていませんが、なんとスクロールさせるとその下に
こっそりと[カスタム]が隠れていますw
選択して保存しましょう

さぁこれでBlogger側の設定は完了です。

これでモバイルアクセスしたブログにnend広告が表示されていると思います
(パラメーターをテスト用にして表示確認を行えます)
ここに実際の画面をスクリーンショットでお伝えできればいいのですが
サイト運営者による表示確認がOKなのかわからないので、
現在nend運営に問い合わせています。
もしOKの場合、追ってここにスクリーンショットで追記したいとおもいます。
nend運営より、実際の広告を表示させても問題無しとの回答が得られましたので。
このような感じで表示されます。
タイトルの上にインライン表示、一番下にオーバーレイ表示です。
インラインはスクロールさせると隠れますが、
オーバーレイはスクロールさせても付いてきます。

iPhone6になってディスプレイサイズも大きくなったので、
広告が表示されても過去の機種ほど邪魔じゃありませんね(^_-⭐︎

2014年10月29日水曜日

Bloggerで作成したブログにnend広告を貼る(広告枠作成編)

前回はnendにメディアパートナー登録完了まで書きました。
今回はnendで広告枠を取得し、自分のブログに貼るところまで書きたいと思います

nendにログインするとサイト(アプリ)とサイト内に貼る広告枠の管理画面になります
どうやらひとつのサイトに対してヘッダー部、フッター部など、広告を複数箇所に
貼ることができるようなので、まずその親となるサイトを登録します

まずはログイン画面

ここで広告枠の管理タブにマウスを持っていきます
すると「サイト/アプリ」、「広告枠」と選択肢が表示されるので
「サイト/アプリ」を選んでください。
するとサイト(アプリ)を管理する画面になりますので
最初は「新規サイト/アプリの作成」ボタンを押してください。


情報を入力する画面になります
自分のサイト情報を入力しましょう。
注意書きにもありますが、nendはスマホ専用の広告ですので
基本スマホ向けサイト、もしくはiPhone/Androidアプリになるかとおもいます
書いてある通り入力していきましょう。
すべて入力が終わったら作成を押します

[広告枠の管理]-[サイト/アプリ]の中に先ほど作成をしたサイトが表示されます
これでサイトの登録ができました。(アプリは作成していませんが同じ手順だと思います)
次はいよいよ広告枠の作成です
サイト名の下にある[広告枠作成]を押してください

広告枠作成の登録画面です。

・サイト/アプリ
作成済みのサイトしか選べないようになっていますので
先ほど作成したサイトを選択しましょう(要はそのサイト用の広告ですということ)

・広告枠のタイプ〔バナーorアイコン〕
バナーは横に広がる一本の帯のようなタイプ、アイコンは名の通りアイコン型になります
ちなみにアイコンはオーバーレイ表示ができません
(サイトの上にフロートして表示する形式。
 ページ内をスクロールしても同じ場所(画面下部)に表示されます)

・広告枠の名前
管理上、自分の分かり易くつけておけば大丈夫です(ヘッダー用とかフッター用とか)

・広告枠の形式〔インライン(ヘッダーorフッターorその他)orオーバーレイ〕
インラインはサイト内のどこでも自分の好きな場所に自分で配置できます
オーバーレイは先にも少し触れましたが画面の下部にフロート表示されます

・広告枠の紹介
広告主が広告を出すのに適しているか判断する材料のようです
正確に書いた方がお互いにハッピーなはず。

・18禁広告〔ブロックor掲載〕
まんまですね^^
自分のサイトが18歳以下にも読まれる内容でしたらブロックしましょう
ちなみに後からでも細かく設定できます

・広告枠のサイズ
バナー表示用のサイズになります
広告を大きくて目立たせるか(その分自分のサイトの表示サイズが減ります。。。)、
広告を小さくさせてサイト情報を多く見せるか。
適宜決めましょう。

すべてが入力できたら[作成]を押します


スクリーンショット上では広告二つできていますが
作成した分だけできます。
そして作成した直後は「承認中」となり、承認に2〜3日かかります。
(スクリーンショットにもあるように実際に広告の配信が始まるとアクティブになります)

今回はここまで。
次回はブログの中に実際の広告を貼り付けていきたいとおもいます


Bloggerで作成したブログにnend広告を貼る(nend登録編)

このブログはgoogleのサービスであるBloggerを使用して作成しています

前にも一度触れましたが、googleにはAdsensetという広告サービスがあります
ですが、半年間はブログを続けていないとダメという制約が日本国内版にはあるようです。
そこで他の収益化の手段として今回は「nend」を使ってみます
(このnendはスマートフォン向けのサービスになっています。
 PCサイトでは使用できないので注意!)

まずはnendに登録


文中のリンク、もしくはweb検索で「nend」を入力し、サイトまで行きましょう。
ここで上部左にある「アプリ・サイト運営者様」をクリックします。



すると「今すぐ始める」が下に出てきました。
ここで「今すぐ始める」をクリックすると

nend用のアカウントを作成するために各種情報を入力していきます。
ここは個人や法人、サイト作成者アプリ開発者で各々違うと思いますので
相応の入力をして先に進みましょう。

全て入力が完了すると、nend運営より仮登録確認のメールがきます
仮登録サイトのURLが記載されてきますので、アクセスし仮登録しましょう



すると引き続き、仮登録完了のメールがきます
ここからサイトの承認待ちにはいります

仮登録から約3日くらい経ちますとnend運営より

正式にメディアパートナーとして登録が完了したとメールがきます。
これでnendサイトにログインし管理画面で各種管理を行えるようになります


実際にブログに広告を表示させるのは次回に続きます