筆者のとーなです！
最近、友人がブログを始めたいとのことで、ブログで収益を上げるために必要なことをまとめてみました。
みなさんもブログを始めるならば、やっぱり利益を出したいですよね。一方で、広告ばかりに目が行ってしまうと、肝心のアクセス数が伸びず、ブログもやめてしまったという結果になることも多くあります。
今回の記事では、これからブログを書き始める方に向けて、ステップを踏んで、収益を上げることができるようになるまでをご説明します。
なお、筆者のブログですが、ありがたいことに１ヶ月で15万PV以上のアクセスを頂いています。10/19 時点では100PV程度だったのが、ピークでは1日に16,674PV のアクセスを頂きました。
まだまだ、これから精進という段階ではありますが、皆様の参考になれば幸いです。他サイトでは、かなり細かく解説している場合もありますが、本サイトでは収益化までの道筋を示すことを目的とします。
以下は、目次ですが、ブログ収益化までの道筋を箇条書きで書き出したものとなります。
ブログ収益化までの道を、大きく３ステップに分けて説明します。「ブログの記事を書く」「Googleに登録する」「広告を設定する」です。
初心者は、どうしても広告をどうつければ良いの？というところに悩みがちですが、広告をつけるためにも一定以上のアクセスがある記事を書かなければ収益にすることができませんので、まずは記事を５つ書くことを優先しましょう。
詳しく知りたい方は、下記の書籍が発売されています。
はてなブログ Perfect GuideBook [改訂第２版]
STEP. 1：ブログ記事を書く
ブログを開設しよう！
ブログが書けるサービスって色々ありますよね。検索すると、はてなブログ、WordPressなどがトップに出てくるかと思います。筆者が初心者にオススメするのは、はてなブログです。
理由は、はてなブログであれば、記事を公開するとはてなブログのコミュニティに公開がされます。少しでも人の目に触れる機会が多くなり、Google の検索もされやすいはてなブログをオススメしています。
筆者はいきなりWordPressからブログを始めたのですが、アクセスがゼロの日も珍しくなく、やめてしまいました。。
WordPressは自分独自で設定もできるメリットも多いのですが、設定が初心者には分かりづらいです。はてなブログからWordPressに移行もできるので、中級者になればWordPressも良いかと思います。
下記のリンクにアクセスすると、はてなブログを作成することができます。「はてなIDを作成」からアカウント作成を進めてみてください。登録後、メールアドレスに本登録のメールが届くはずです。
なお、スマホでアクセスした場合に、下記のような注意書きが表示される場合があります。Cookieはサイトのアクセス情報が分かる設定なのですが、iPhone などでは初期設定でオフにされています。
iPhone の場合は、「設定」→「Safari」を選択後に下記の２つをオフにしてください。
・サイト超えトラッキングを防ぐ
・すべてのCookieをブロック
サイト閲覧時に楽天などで自分が見た商品が表示されているケースがあると思いますが、Cookieはそれを有効にするような設定です。危険なものでは無いので解除しても問題はありません。
ブログ記事を書こう！
さて、アカウントができれば、一度記事を書いてみましょう。
はてなブログの場合は、ログイン後に、ブログのURLを決めます。URLの変更はできませんので注意しましょう。なお、URLの末尾は、hatenablog.com で良いと思います。「すべての人に公開」を選びます。次は、「無料でブログを始める」を選んで開始です！
無料版だと、はてなブログの広告が付いてしまうのですが、慣れてきてからはてなブログの広告がない有料版に移行しましょう。
なぜか編集画面へのリンクが分かりにくいのですが、ブログの編集画面へ行くことができる下記にアクセスしてみてください。編集画面は、お気に入りに登録しておくことをおすすめします。
あとは、作成したブログを選び、「記事を書く」を選択して、タイトル・記事本文を入力していきましょう。はじめてのブログ記事第一歩です。まずは、自己紹介などでも良いかもしれませんね。
「公開する」を押すことで、あなたの記事がネット上に公開されます。
ブログのトップページの基本設定をしてみよう！
さて、記事の公開方法がわかれば、せっかくなのでブログのトップページの設定をしてみましょう。
はてなブログの編集画面 からあなたのブログを選んで、「設定」を押してみてください。基本設定として、下記の設定を変えてみましょう。なお、設定はいつでも変えることができます。
基本設定の項目
- ブログ名 を設定
- ブログアイコン を設定
- ブログの説明 を記載
- about ぺージ に自己紹介を記載
- 編集モード は見たままモード
- コメント承認 にチェックを入れる
※たまに変な広告コメントが来るため
なお詳細設定は、STEP.2 で説明をします。
ブログ記事を最低５記事書こう！
さて、ここまでくればブログとしての形にはなっているはずです。広告を貼るにしても、アクセス数を増やすにしても、まずは記事を書いてみるということが欠かせません。
スタート時期は、全然アクセスが無くてつまらない方が大半で、多くの方がここで脱落していきます。広告を貼るためにも、まずは最低５記事は書きましょう。
STEP. 2：ブログをGoogleに登録＆デザインを洗練
Google Search Console に登録しよう！
せっかく書いた記事であれば、Google の検索で見てほしいですよね。はてなブログであれば、勝手にGoogle検索に登録がされるのですが、時間がかかってしまうケースがあります。
Google Search Console に登録をしておくと、Google検索の登録と合わせて、「どのような検索キーワード」で「どのくらい検索結果に表示された」のか、「どれくらいクリックされたか」を見ることができます。下記リンクから、最新の設定方法の検索ができるので、設定を進めてみてください。
「はてなブログ Google Search Console」で検索
Google Analytics に登録しよう！
アクセス解析のために、Google Analytics というものがあります。あなたのブログに来た閲覧者が、「どこからきて」「どのようなページを見て」「どれくらい滞在したか」が分かるツールとなります。こちらも、今後のアクセスを増やしていく分析のためにブログ初期の段階で入れておきましょう。
なお、簡易的には、はてなブログの機能でもアクセス数は確認することができます。はてなブログ編集画面の「アクセス解析」を押してみてください。
ブログテーマを変えてみよう！
せっかく、ブログを作ったならばかっこいいデザインにしたいですよね。５記事書かれたならば、ブログの体裁もしっかりしたものにしていきましょう。
なお、ここから先はスマホでは設定に限界があるため、パソコンでの作業となります。
はてなブログでは、デザインがテーマという形で公開されています。好きなデザインを選んでポチポチするだけで反映することができます。下記から、自分の好きなデザインを選んで、「プレビューしてインストール」を押してみてください。
なお、筆者のサイトではUnderShirtというテーマを使用させて頂いています。
ブログのデザインを変えてみよう！
ここから先は、デザインの詳細を決めていく段階になります。筆者のサイトではサイドバーに他の記事などを表示していますが、細かく決めたりしたいですよね。また、記事内の文字を太字にしたときに蛍光ペンで線引いたようにする設定なども行うことができます。
デザインの各設定
はてなブログの編集画面 から「デザイン」を押してみてください。その後、左上のカスタマイズ（スパナのアイコン）を押すと細かな設定ができるようになります。
背景色や、ヘッダ、記事、サイドバーなど、モノは試しで色々いじってみると、なんとなく分かってくるかもしれません。この当たりは、ご自身でも検索しながら自分がやりたい方法を見つけてみてくださいね。
デザインCSS
一番下の「デザインCSS」を押すと、CSSというプログラミングのような内容でデザインを指定することができます。慣れてきた方用の設定になってしまいますが、筆者が使っている設定を公開しておきますので、面倒であれば↓をデザインCSSに貼り付けしてもらえればと思います。
デザインCSSに入力する内容を表示
/* <system section="theme" selected="8599973812333959601"> */
@import "https://blog.hatena.ne.jp/-/theme/8599973812333959601.css";
/* </system> */
/* <system section="background" selected="ebe9e3"> */
body{background:#ebe9e3;}
/* </system> */
/*シンプルな目次*/
.entry-content .table-of-contents {
margin: 0;
padding: .7em 1.2em 1.2em;
background: #f6f6f7;
font-size: 100%;
border: solid 1px #5a598c;
}
.entry-content .table-of-contents::before {
content: "目次";
position: static;
display: block;
text-align: center;
margin: 0 0 .8rem;
padding: 0 0 .4rem;
border-bottom: 1px dashed #9aa0c1;
font-size: 120%;
}
.table-of-contents ul {
padding-left: 10px;
}
.entry-content .table-of-contents li {
margin: .2em 0 1em 1em;
list-style-type: decimal;
line-height: 1.6em;
}
.entry-content .table-of-contents li ul li {
margin: .2em 0 0 1em;
}
.table-of-contents li a {
text-decoration: underline;
line-height: 1.6em;
color: #3f3f3f;
}
/*見出し*/
.entry-content h3 {
border-bottom: initial;
}
h3 {
padding: 0.4em 0.5em;/*文字の上下 左右の余白*/
color: #494949;/*文字色*/
background: #f4f4f4;/*背景色*/
border-left: solid 5px #7db4e6;/*左線*/
border-bottom: solid 3px #d7d7d7;/*下線*/
}
h4 {
position: relative;
padding: 0.6em;
background: -webkit-repeating-linear-gradient(-45deg, #fff5df, #fff5df 4px,#ffe4b1 3px, #ffe4b1 8px);
background: repeating-linear-gradient(-45deg, #fff5df, #fff5df 4px,#ffe4b1 3px, #ffe4b1 8px);
border-radius: 7px;
}
h4:after {
position: absolute;
content: '';
top: 100%;
left: 30px;
border: 15px solid transparent;
border-top: 15px solid #ffebbe;
width: 0;
height: 0;
}
/* 太字の蛍光ペン 黄色 */
.entry-content strong{
background: -webkit-linear-gradient(transparent 60%, #fef5c2 60%)!important;
background: -o-linear-gradient(transparent 60%, #fef5c2 60%)!important;
background: linear-gradient(transparent 60%, #fef5c2 60%)!important;
}
/* コメントを書く */
.leave-comment-title {
display:inline-block;
width:100%;
text-align:center;
padding:1em 0;
border:thin solid #bbb;/*枠の色*/
border-radius:3px;
transition: 0.3s ;
font-size:16px;
}
.leave-comment-title:hover {
color:#fff;
background-color:#111;/*マウスオーバー時の色*/
}
/**
* シェアボタン
*/
.share-btn-type2 {
margin: 1.2em 0;
display: flex;
justify-content: space-between;
}
.share-btn-type2 .share-btn__item {
width: 24%;
height: 40px;
color: #fff;
font-size: 16px;
text-align: center;
line-height: 40px;
border-radius: 4px;
transition: all .3s;
}
.share-btn-type2 .share-btn__item--hatebu {
background-color: #00A4DE;
box-shadow: 0 4px #038ebf;
}
.share-btn-type2 .share-btn__item--facebook {
background-color: #1778F2;
box-shadow: 0 4px #1366ce;
}
.share-btn-type2 .share-btn__item--twitter {
background-color: #1BA1F3;
box-shadow: 0 4px #1280c3;
}
.share-btn-type2 .share-btn__item--pocket {
background-color: #EF4155;
box-shadow: 0 4px #c3293b;
}
.share-btn-type2 .share-btn__item:hover {
transform: translateY(4px);
box-shadow: 0 0 #333;
}
/* UnderShirt - スマホでも記事を２列で表示 */
@media (max-width: 767px){
.archive-entry {
width: calc( 50% - 6px);
}
.archive-entry:nth-child(2n) {
margin-left: 12px;
}
.page-archive .entry-thumb {
height: 28vw;
}
}
/**** レスポンシブデザイン *****/
/* レスポンシブヘッダー調整 */
@media (max-width: 480px){
#blog-title-inner,#title a{
height:80px!important;
width:auto;
}
#blog-title-inner {
background-size: contain!important;
}
/* タイトル画像上下の余白を調整 */
#blog-title {
margin: 50px auto 5px auto;
padding: 0;
}
}
/* UnderShirt - 一覧（スマホ）での記事の余白を狭くする */
@media (max-width: 767px){
.archive-entry {
padding: 10px;
}
.page-archive .entry-thumb-link {
width: calc( 100% + 20px);
margin: -10px 0 10px -10px;
}
}
/* 記事の説明をトップページから消す */
@media (max-width: 767px){
.page-archive .entry-description {
display: none;
}
}
/* デフォルトのヘッダーを消す */
.header-image-wrapper {
display: none;
}
#blog-title {
display: none;
}
/* ヘッダー画像を画面サイズに自動で合わせる */
.header1 img, .header2 img {
display: block;
width: 100%;
margin: 0 auto;
}
/**** 記事一覧へボタン ****/
.btn-kizi{
background-color: #333;
border: 2px solid #333;
color: #fff;
padding: 0.5em 5em;
line-height: 50px;
}
.btn-kizi:hover{
background-color: #fff;
border-color: #59b1eb;
color: #59b1eb;
}
/*フッタの上に戻るボタンに対する設定*/
#page-top{
/*display:none;*/
position:fixed;
right:50px;
bottom:20px;
margin: 0;
padding: 0;
text-align:center;
font-size: 55px;
}
#move-page-top{
color:rgba(0,0,0,0.4);/*color:rgba(R値,G値,B値,透明度)*/
text-decoration:none;
display:block;
cursor:pointer;
}
/*"↑"のアイコンに触れたときのカラーリング設定*/
#move-page-top:hover{
color:rgba(0,0,0,0.6);
}
/* トップのバナー(モバイル時) */
.top_banner a img {
width: 80px; /* 横幅を割合で指定 */
height: auto; /* 高さは自動指定 */
}
/* カテゴリやタグを非表示 */
.categories, .archive-entry-body{
display: none;
}
/* はてなブログをはじめようを削除 */
.guest-footer-content{
display: none;
}
.footer-inner div{
background: #fff;
}
/* フッターの著者名を消す */
.fn {
display: none;
}
/* ヘッダー設定 */
/* 画面がスマホサイズの時、PC版ヘッダーを消す */
.header1 {
display: none;
}
/* 画面がスマホサイズの時、スマホ版ヘッダーを表示 */
.header2 {
display: block;
}
/**** 通常のCSS追加するならばここより上記に設定すること ****/
/**** 以下、パソコン画面ならば設定を反映するCSS ****/
/* メディアクエリ */
@media screen and (min-width: 480px) {
/* 画面がPCサイズの時、スマホ版ヘッダーを消す */
.header2 {
display: none;
}
/* デフォルトのヘッダーを表示 */
.header-image-wrapper {
display: block;
}
#blog-title {
display: block;
}
細かな説明は省略しているので、詳しいサイトを検索してみてください。慣れてくれば、改めて自分でCSSを設定してみてください。
スマホのデザイン設定
スマホにもデザインを反映させることができます。デフォルトでは、はてなブログの設定そのままで、それなりにきれいではあるのですが、以下のスマートフォンアイコンを押して「詳細設定」の「レスポンシブデザイン」にチェックを入れると、スマホ用のデザインを反映させることができます。
詳細設定する
はてなブログの編集画面 から「設定」を押して、「詳細設定」のタブを開いてみてください。
一番上の「独自ドメイン１年分プレゼント！」は、初めの段階では不要です。hatenablog.com 以外の自分だけのドメインというものが使える代わりに、育てる必要があるので、Googleからの検索順位が低くなる可能性があるためです。
下記の項目を設定するようにしましょう。お好きな設定で構いませんが、筆者のオススメ設定を記載しておきます。
詳細設定の設定が必要な項目
PROと書いてある項目は、はてなブログの有料版のみの設定となります。なお、１回だけ有料の支払いをしておいて、PROの設定をした後に、次の月は支払わないということもできます。
設定は無料版に戻ってもそのままのようなので、１回だけ有料版を使ってみるということもありです。
なお、PROの設定項目に「AMPを配信する(β版)」がありますが、よく理解をしないままに、これにチェックを入れることは絶対にオススメしません。スマホでアクセスされる場合に、後に説明する広告が機能しない、デザインの設定の意味がなくなるなどの問題があるためです。
表示速度が早くなる設定なのですが、チューニングが必要な設定になるので、よくわからないうちは必ずオフにしていてください。（筆者は、よく分からずに、一時期オンにしており、広告収入低下やアクセス低下を招きました）。
SNSと連携させよう！
Google の検索結果を上位に表示させるためには、他のページからURLがリンクとして設定されているかが重要になってきます。良いコンテンツほど、他のサイトからも参照されているだろうということですね。
Twitterなどを連携させれば、記事の投稿と同時にTwitterにつぶやくような設定ができるようになります。はてなブログの編集画面 から「アカウント設定」を押して、「外部サービス連携」を選択してください。Twitterなどの連携ができるようになるので、ブログ用にTwitterアカウントなどを作って連携しても良いかと思います。
STEP. 3：ブログに広告を設定する
さて、ここまでくればようやく広告を貼っても良い準備が整いました。「誰でも登録ができる楽天アフィリエイト」、「いろいろな広告が貼れるValue Commerce」、「審査が厳しいが単価が高いGoogle Adsense」をまずはご紹介します。
楽天アフィリエイトを貼ろう！
みなさんは楽天のアカウントをお持ちですよね。楽天アカウントさえあれば、すぐに楽天の商品や旅行などのサービス紹介を始めることができます。
ネットに広告を載せて収益を得る仕組みをアフィリエイトと言います。
はてなブログでの詳しい貼り方は、下記から検索してもらえればと思いますが、楽天アフィリエイトは審査なしで始めることができ、楽天ポイントで受け取りもできるので、入門としてはオススメです。
ただし、あまり関連のない記事ですと、ほとんど収益にならないので、その点はご認識ください。
Value Commerce に登録しよう！
２つ目に紹介をするのは、Value Commerceです。広告を掲載したい多くの企業が登録をしており、あなたが広告を選んで掲載することができます。下記からValue Commerce にアクセスすることができるので、登録後にいろいろな企業の広告を見てみてください。
例えば、広告検索で「Yahoo」を検索してみましょう。Yahoo!ショッピングやYahoo!トラベルが出てきたはずです。即時提携と、審査ありというものがありますが、提携をすると、広告素材が選べるようになります。
自分が表示させたい広告を選んで、「広告を作成」を押すと下記のようなプログラムコードが作られます。少し上級者向けになりますが、はてなブログで記事を書くときに「HTML編集」モードで下記の広告を入れると、数分後に表示されるようになります（すぐにはプレビューに反映されないので注意です）。
LyncSwitch で自動で広告変換
なお、本来HTMLというコードの中にひとつずつ広告を設定しないといけないのですが、このValue Commerce の凄いところは、はてなブログでは商品のURLを貼り付けるだけで提携している企業であれば勝手に広告に変換をしてくれる「LyncSwitch」という機能があることです。
下記のリンクから、Value Commerce にアクセスして、LyncSwitch の利用を開始するを押しましょう。
Value Commerce の LyncSwitch を有効にする
なお、この後に、はてなブログのヘッダに設定をすることが必要になります。詳しくは、下記より検索をしてみてください。
「はてなブログ valuecommerce Lyncswitch」で検索する
老舗アフィリエイトサイトの紹介
なお、Value Commerce 以外にも老舗ASP(アフィリエイトサービスプロバイダー)は数多く存在します。代表的なサイトをご紹介するので、ご興味あれば登録を進めてみてください。なお、企業によっては、このASPにしか登録していないというケースも多々あります。
Google Adsense に登録しよう！
最後になりますが、Google Adsense の紹介です。
Google Adsense は登録をしておくと、Googleが自動でサイトを解析してくれて、一番適した広告を自動で設定してくれます。
かなり楽で、かつ広告の表示・クリックの単価も他に比べると高いため、審査が通りさえすれば、アクセス数を稼ぐだけで収益化することができます。
ただ、審査のハードルがそれなりに高く、一発合格しない場合も多いそうです。審査は複数回受けることができるので、何度か挑戦をしてみてください。
なお、審査にあたっては、「プライバシーポリシー」を設定することが必須になるので、ブログに必ず設置しましょう。
一部の記事では、はてなブログでは Google Adsense は申請できないとの記載もありますが、筆者のサイトは2020年10月に問題なく審査に通りましたので、はてなブログでも申請することに問題はありません。
まとめ
今回は、ブログ初心者の方向けに、はてなブログの始め方とアフィリエイト広告についてご紹介をしました。かなり長文にいなってしまいましたが、これでも設定方法などの細かなところのご説明がまだまだできていません。
一方で、知らないと検索すらできない状態になると思うので、上記記事を参考にぜひブログ収益化に向けて、ブログをスタートしてみてもらえればと思います。
記事一覧に行ってもらえれば、他にもお得な記事を公開しています。よろしければクリックしてみてください。ご覧頂きありがとうございました。
