音ものっち)を「音ものバスラ」と名前を変え新しいコンセプトでリニューアルしたのでその方法を紹介します。音ものっち)を立ち上げた最初の誕生日は2019年1月23日でした。以後6月末まで運用してきましたが、最近になって仕事上でお付き合いを始めたyajirobeeさんの以下のブログからインスパイアーされてリニューアルを決断しました。春夏秋冬〜季節のネタ帳〜考えたコンセプトは「バスラ」の「バースデーライブ」から「誕生日」と「ライブ」をキーワードとして展開することにしました。誕生日は、最初は女性アイドルグループのメンバーの誕生日をその季節に沿ってメンバー紹介とともに行うつもりでした。それではレッドオーシャンなので、誕生日の解釈を「デビュー/復活/再出発/転身/開拓なども含む」とし、グループの動向を中心に「変化」を捉えて、技術者の視点から独自の表現手法を確立していきたいと思います。Blogger初心者には?今回はすでにあるBloggerで作ったブログがベースなので、採用した最新の公式テーマ「Contempo」によるリニューアルの方法について紹介します。Bloggerのブログを初めて立ち上げる初心者の方は、まず以下の日本語テーマでブログの構築を行って慣れてから今回紹介する方法をお試しください。blogger日本語テンプレート「Tokyo」ダウンロードページ上記のページの一番下には、他にも3つの日本語テーマへのリンクがあるので参考にしてください。ラムネグBlogger最新公式テーマ「Contempo」なぜContempoを使おうと考えたか?ですが、元々このブログの記事は「乃木坂46」だの「Perfume」だのレッドオーシャンの土俵でやっているわけですが、その中でのブルーオーシャンを見つけようという方向性の一環です。ユニークさを出すことで、ニッチなニーズからのアクセスを期待して、それでGoogle検索の上位表示を狙おうという魂胆です。おとなしく一般的なテーマを使いたい方には向きません。苦労すると思うので、Tokyoあたりで頑張った方が労力の投資対効果が高いと思います。そもそもBloggerに手を出そうとしているあなたなら、その時点でリスクを取っているので、WordPressを止めてBloggerにする意義は意識した方が良いとは思いますが・・・Adsenseコードの設置Bloggerの公式テーマを採用した時に最初に困るのがAdsenseコードの設置場所です。WordPressの一般的なテーマのように簡単には行きません。今回は上から、右サイドトップ、moreタグ、記事直下、ページ最後、さらに自動広告と、ページ内の5箇所に表示される可能性があります。「可能性」と行ったのは、自動広告を設定するとGoogleがAIを使って適切な位置に適切な広告を表示するので、こちらの意図した広告が意図した場所に表示されるとは限りません。右サイドトップとページ最後の広告はレイアウト画面上で「Adsense」ガジェットを配置することで行いました。テーマのHTML画面上での配置moreタグ、記事直下は「data:post.body/」で検索(Ctrl+F)してその上下に広告コードを配置します。具体的には以下の記事を参考にしてください。自動広告はAdsenseサイトからコードをコピーして<head>タグの直下にコピーしました。自動広告の設定と詳細URL設定をしています。実際の表示moreタグの前段階でタイトル下に表示された広告は以下です。moreタグに移動した結果は以下です。下側の広告は自動広告です。ページ最後は以下です。合計で5箇所に広告が表示されています。広告の数が増えるとクリック単価が下がる傾向にあるので、1ヶ月程度様子を観て、収益の低い広告は外すように将来的には考えています。カスタマイズで参考になる記事集Contempoに対するカスタマイズ方法ではありませんが、考え方として参考になります。新規Bloggerブログで最低限カスタマイズする4項目。上記のコードはContempoでは異なっていたので、検索後に以下のような形で修正しています。最初は左サイドバーと記事下の2箇所に設置しましたが、記事下が表示されなかったので、左サイドバーを削除すると記事下に表示されました。右下に現れるページトップボタンは、以下のコードを「HTML/JavaScript」ガジェットに貼ってレイアウト画面の一番下に配置しました。false;});});</script>ボタンのデザインを変えたい場合は以下のコードの末尾近くの番号を以下のサイトで選んで変えてください。Buttons「続きを読む」でジャンプ後に目次がトップになる?トップページの「続きを読む」をクリックすると目次がトップになるので目次以前が見えないだけでなく、最もクリック単価が高いmoreタグ広告(またはタイトル下広告)が見えなくなり広告クリックの機会損失にも繋がります。Contempoでは「data:post.hasJumpLink」で検索してmoraタグ部分を削除したところ、ページトップにジャンプするようになりました。「data:post.hasJumpLink」で検索すると5箇所見つかりました。トップページ(index画面)や検索結果など複数のページに「続きを読む」があるようです。expr:title='data:post.title'><data:blog.jumpLinkMessage/></a></div>タイトルのクリックなどではページトップを表示します。カスタマイズはキリがないので、このあたりにしておきます。まとめブログの形は整いましたが、課題は記事のタイトルの付け方と記事の内容や修飾の仕方、貼り付ける画像をフリー画像サイトからダウンロードするか?など多岐に渡ります。今後試行錯誤を繰り返しながら、アクセス数の変化や広告の収益などをウォッチして最適化していきたいと思います。Japan広島市出身で札幌市在住の64歳独身男性です。2018年3月に札幌市に移住して年金生活をしつつクラウドワークス経由でWebライターを始めました。詳しくは「お問い合わせ/ウェブページ情報」をクリック/タップしてプロフィールページをご覧ください。