WordPress デジタル系

ウェブライターのための実践ホームページのWordPressのテーマとプラグインなどをご紹介

更新日:

「実はこのサイトの管理人の片割れは、WordPress書籍の著者だったりするので、このサイトもそれなりに工夫を凝らしています。

ライターさんがブログをやったほうがいいという話は以前書いていますが>>こちら
無料ブログでなくてWordPressでサイト(ブログ)を立ち上げてる方もよくお見かけします。

といってもライターさんはコンテンツ制作のプロではないため、WordPressがやや重荷になっているかもしれません。

このサイトも、見栄えがそれほど極端に素晴らしいというわけでもありませんが、
いくつか工夫はしています。実は仕様をいろいろ考えた末、見栄えより、中身をとって変更したんですね。

そういう工夫って、目に見えにくいし、目に見える部分のデザインって、実はもうスマホが中心になるので、あまりこだわらなくていいのかな、スマホの見栄えは意識するけど、そんな感じで設定をしています。

せっかくなので、お教えできる範囲でこのサイトの仕様をご紹介しましょう。

テーマはSTINGER

まず、WordPressのテーマですが、現在はSTINGERを使っています。

正確に言えば「STINGER_PLUS2(β)」ですね。

STINGERの良さは、コードが割とシンプルで、なおかつ不要な機能がテーマに含まれていないので「これ」という、ページに表示させる要素に合わせて、ウィジェットとちょっとした工夫をするだけで思い通りのサイト構成にできることにあります。

実は僕の著書でも、STINGERをメインで紹介していました。バージョンは5の時代でしたが。

ちなみに現在では、有料版のテーマが販売されていますので、お試しして気に入ったのなら購入したほうが良いです。僕の場合はノーマルでどこまでできるかの説明が教材などで必要なので、このサイトはまだ無料バージョンなんですけど。

無料版のダウンロードは

http://wp-fun.com/dl/

わかりにくいのでスクショを。

サイトのSSL(https)化

面倒がってほかっておきましたが、やっとこさSSL対応に変更しました。

SSLとは、接続の暗号化でセキュリティを高めるための通信で、Googleが「これに対応させると検索順位が上がりますよ(というかやらないと下がるよ)」というアナウンスをしたのがしばらく前。

スマホ対応の時もそうだったけれど、それほど急激に順位が大きく変わるわけでは無さそうですが、かといってほっとくとジリジリ下がる。

使っているレンタルサーバーも、無料でSSL対応できるようになっていたので(2年前くらいまでは年間1万円くらいしたのに!)今のうちに、ということで対応しておきました。

http →httpsの際にWordPressでやることの一覧を書いておきます。(これは詳細を自分のWordPress本サポートサイトに書かないと…)

  1. レンタルサーバーの管理画面でSSlサーバーの利用をオンにする
  2. WordPressの「設定」→「一般」で「
  3. レンタルサーバーの反映が終わるのをしばし待つ
  4. プラグイン「Search Regex」を使ってサイト内の
  5. FTPで.htaccessをダウンロードして

といった感じです。

あとは周辺のサーチコンソールやらアナリティクスなどを設定し直し。

アドセンスは多分いじらなくてもよさそう。

アドセンスのプラグイン

ご覧になるとわかるように、このサイトはGoogleの広告システム「アドセンス」を入れています。

まだこのサイトではアクセスが月間1万5000PV程度(2017年9月現在)なので、それほど収益は上がっていませんが、アドセンスはロングテールの収益を上げられる仕組みですので、やらないのは損。

とは言っても、コードを貼ったりするのが結構手間なので、基本はプラグイン任せ。

収益が数万円になり始めたらこまかなチューニングはしていきますが、現状はほぼ「WP QUADS」というプラグインに丸投げです。

プラグインにしておけば、コードを変えたいときなどに、一括で変更できるのがいいですし、ウィジェットだけだと記事中にはコード貼れないですからね。

AMP対応

AMPとは「Accelerated Mobile Pages」のこと。モバイル専用ページをGoogleがキャッシュとして作ってくれて、対応させておくと「多分」順位が上がると思われる仕組み。

個人的にこれのいいところは、読者がアクセスするページがGoogleのキャッシュページなので、自分のサイトのサーバーに負荷がかからない(はず)のところ。

この仕組みなら、万一記事がバズっても、アクセス集中によるサーバーエラーが回避されるんじゃないかと思うのですが、詳しいことはまだバズっていないので、不明。

AMPはTwitterからのリンクでも表示されるので、普通のサーバーを使っているのなら確実に表示スピードが上がりますので、対応させておきたいものです。

ただし、アドセンスのコードはAMPでは表示されませんので、専用のコードを張る必要があります。

さらっとだけ書いておきます。

 

  1. レスポンシブ広告ユニットを作成するAdSense アカウントでレスポンシブ広告ユニットを作成して、レスポンシブ広告コードから次の情報をメモします。

    • サイト運営者 ID(data-ad-client)(例: ca-pub-1234567891234567)
    • 広告ユニット ID(data-ad-slot)(例: 1234567890)

    AMP 対応の広告コードを作成するには、これらの 2 つの値が必要になります。

    <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
    <ins class="adsbygoogle"
    style="display:block"
    data-ad-client="ca-pub-1234567891234567"
    data-ad-slot="1234567890"
    data-ad-format="auto"></ins>
    <script>
    (adsbygoogle = window.adsbygoogle || []).push({});
    </script>

https://support.google.com/adsense/answer/7183212?hl=ja

まだ新しい仕組みで、これにするとアクセスやアフィリの収益が下がるという噂も散見するので、必ずしもお勧め、というわけではありませんが、競合サイトと差別化したいのなら、その必殺技になるかもしれない仕組みと言えます。

AMPコードを貼るプラグイン

上記の AMP専用コードは、通常ページには表示されません。AMPページ専用のコードですから、

このコードを記事中に挿入すれば、AMPページでもアドセンス広告を表示されることができます。(逆にこれを忘れてAMP対応だけを済ませると、広告が表示されずに収益が減ります←経験済み)

しかしWordPressでは、記事の中にコードを貼ると勝手にコードが消されてしまったりします。上記コードもこちらの環境ではビジュアルモードにするとコードが消えてしまいました。

そこでプラグインの登場です。ショートコードの中にAMPアドセンスコードを格納し、記事中にショートコードを入れるという作戦です。仕様するプラグインは「Post Snippets」。

これで記事を書くときに任意の場所に、編集画面のツールバーの「Post Snippets」アイコンをポチッとするだけで、AMP用のアドセンスコードが挿入できるようになり楽チンです。

コード挿入すべて丸投げはできないけれど、AMPページは基本的に入らない要素を表示しないので、本文中に3〜4箇所コードを貼るだけですから、これでよしとします。

フロントページの表示

このサイトはどちらかというと雑記型のため、読者は検索エンジンやTwitterからやってきます。ですからフロントページ(トップページ)へのアクセスは個別のページに比べれば比較的少ないのですが、それでも少し工夫しています。

構成としては「ヘッダー画像」→「フロントページウィジェット」→「投稿一覧(新着順)」という感じです。

このなかで工夫といえば投稿一覧の前に、「ライター養成講座のお知らせとメルマガ登録」へのリンク、そしてウィジェットで人気投稿を3つ表示されていることです。

一応サイトの目的としてはライター養成講座の募集告知が重きを占めているので、これをフロントページのヘッダー下に入れているのがミソ。

この位置にウィジェットを入れられるのが、はじめに紹介したSTINGERの良いところですね。

 

さて、ややマニアックな内容になってしまったかもしれませんが、こういうことを気をつけながら、ライターが収益化できるWordPressサイトを所有し、管理していくということは、ライターの収入を増やしていく大切な手段です。

近々ライターさん限定で、WordPressサイト構築の安価なパッケージを企画していますので、オープンの際はまた改めてご紹介しますね。

ちなみにWordPressマンツーマンレッスンはこちらで紹介しています

旬なオススメ記事

-WordPress, デジタル系

Copyright© ライターによるニュースサイトライターズニュースJP名古屋・東海のイベント情報も! , 2017 All Rights Reserved Powered by STINGER.