鈴木メモ

Illustratorの練習メモとか、作ったものとかのブログです。

*

素人がWordPressでブログをつくるのにやったこと・使ったもの

      2015/10/04

Pezibear / Pixabay

先日2つめのブログをWordPressで作りました。
ひたすらググりながら作ったんですが、全体の流れが見えないために、やるべき手順が抜けたり、やらなくても問題ないカスタマイズに時間を取られたりといったことがありました。

自分がまたいつかWordPressでサイトを作るときのためと、
今無料ブログでやっているけどそろそろWordPressも気になってきたという人の参考になるように、ブログづくりの手順をまとめました。

おおまかな流れとつまづきやすい所だけを簡単に書いてますので、具体的な手順は検索して下さい。

ちなみに作った新ブログはこれ。
制作日数は記事を5コ書いたのも込みで、三週間くらい。(実際やったのは土日中心。)

こんなかんじの普通の個人ブログをつくります

jill111 / Pixabay

ふだん更新する記事ページと、あんまり書き換えないプロフィールページがあり、右上に広告があって、ブログ記事の中で本などを紹介する時はAmazonにリンクする、というごく一般的なブログをWordPressを使って作ります。

レンタルサーバーとドメイン代で年12,000円程度かかりますが、ブログにgoogleアドセンスの広告を貼ってサーバー代の足しにしています。

ブログづくりの手順はなるべく既存のテーマの設定をいじらず、そのまま活かす方針です。WordPressは自由度の高いカスタマイズが魅力ですが、下手にいじると表示が崩れた時に元に戻すのも一苦労なのでカスタマイズは最低限。

※この記事はWEBをよくわかってない素人が書いています。
※長文になってしまったので、読み飛ばせる部分はグレーの文字にしてあります。

超大雑把なWordpressブログのしくみ

記事を書きたい人のための説明
自分で好きなレンタルサーバーを借りて、そこにWordpress(無料のブログシステム)をインストールするとブログ記事を書ける投稿画面が出てくる。書いた文章や画像のデータはレンタルサーバーに日々貯まっていく。

コードとふだんの使い道
html…記事の中で見出しを付けたり他のページにリンクするのに使う。
css…タイトルや背景の色を変えたり全体の文字の大きさを変えるのに使う。
php…サイドバーや記事のスペースに何を載せるかの構成を決めるのに使う。
MySQL…サーバーの引っ越しとか難しい設定に使う。
私はphpとMySQLは何だか分からないし、htmlとcssがぼんやり分かるくらいだけど普通に記事を書くぶんにはこれで何とかなってます。

登録するものリスト

WordPressブログ制作に必ず必要なもの

メールアドレス
(色んな登録のために必要。Gmailやyahoo mailなんかの無料メールで大丈夫。)
(ブログに載せる連絡先はメールフォームを設置すれば自分のメールアドレスをそのまま載せなくても済みます。でもメールフォームから来た知らない人へ返信するのに、本名+誕生日みたいなアドレスだと気まずいので、ブログ用のメールアドレスがあると便利です。)

独自ドメイン(サイトアドレスのこと。年/900円くらい。)
(私はムームードメインで取ったけどどこでも大体同じっぽいです。)
(WHOIS公開情報を「弊社の情報を代理公開する」を選べば、自分の自宅住所を公開せずにサイトを作れます。)
(サイトのタイトルは後からでも気軽に変えられるけど、ドメインはこれ自体にお金がかかって気軽に変えられないものです。ブログの方向性が決まってないなら、どうタイトルが変わってもいいような名前で取る方が無駄にならないかも。)




レンタルサーバー(データ置き場のこと。月/1000円+初期費用くらい。)
(私はwpxサーバーのレンタルサーバープランを使ってます。wpxサーバーはWordPressに特化しているので最初のWordPressインストールが簡単です。)(使い勝手はここのメインのブログで一年半使っているけど、遅いと思ったことはありません。WordPressで一番気になったセキュリティも、今のところサイトを乗っ取られたりのトラブルも無いです。WordPressの複数設置も可能です。)
(wpxサーバーは一般的なhtml+cssだけみたいなサイトは作れません。)



無くてもブログ自体は出来るけど、あったほうが良いもの

—–サイトアドレスが決まってから登録するもの
googleアナリティクス(アクセス解析・登録無料)
(アクセス数やリンク元を調べられます。)

—–サイトが出来て、記事を書いてから必要なら登録するもの
googleアドセンス(広告を載せる・登録無料)
(※アドセンスは規約が細かいです。うっかり違反しそうなものもあるので「アドセンス 停止」で事前に検索すると規約が分かりやすいです。一度審査に通れば新しいサイトの追加申請は不要です。)

Amazonアソシエイト(商品リンク・登録無料)
(アマゾンのストアにリンクすることで、本の表紙画像などを著作権を心配せずに載せられます。そのリンクから売れると紹介料がもらえます。)
(Amazonアソシエイト=Amazonアフィリエイトと同じです。公式ではアソシエイトと表記されます。)
(※最初の審査が難しいです。私は1個めのここのブログで5回位落ちましたが、半年後に再申請して通りました。サイトを1つ追加するごとに追加申請が必要です。)

【アドセンス、アソシエイトには入金受け取り用の銀行口座が必要です。】

今回使ったWordPressテーマ

fc2ブログでいう『共有テンプレート』がWordPressの『テーマ』にあたります。
元々入っているいかにも海外っぽいレイアウトのテーマより日本人作者さんの作られているものの方が読みやすい気がします。「国産テーマ」などで検索。
Affinger
このメインのブログで最初に使っていたテーマ「stinger3」の作者さんが、ちょうど新しくテーマを公開されていたのでこれに決めました。広告の設定が簡単で、スマホ表示もちゃんと出来ます。

今回使ったWordPressプラグイン

WordPressは初期設定はシンプルな機能だけで、自分に必要な機能はプラグインを選んで追加していくというスタイルになっています。
何かトラブルがあった時に特定しやすいように、プラグインの入れ過ぎには注意。特にキャッシュ系とショートコード系のプラグインは慎重に。ここに書いたものも人によっては全部は要らないです。

●Flickr-Pick a Picture(Flickrにあるイメージ画像とクレジットを入れる。Flickrは全てがCC0ではないので著作権に注意。)
●Pixabay Images(Pixabay Imagesにあるイメージ画像とクレジットを入れる。Pixabayは全てパブリックドメインです。加工可。商用可。クレジット無し可。)
●WP Maintenance Mode(ブログをメンテナンスモードにできる、けど最初は人が来ないのでやらなくてもよかったと思うので手順には省いています。)
●Table of Contents Plus(記事に目次を自動で入れる)
●WordPress Popular Posts(人気の記事をサイドバーウィジェットに表示)
●Google XML Sitemaps(サイトマップを送信、検索にかかりやすくするために、これは入れるのおすすめ。)
●BackWPup(バックアップを自動でとる)
●AmazonJS(Amazonアソシエイトリンクを入れる)
●WP Canvas – Shortcodes(Amazonアソシエイトを横並びにするなどのグリッドが楽につくれる・ショートコード系)

ブログをつくるための全体の流れ

jill111 / Pixabay

ここからは順番にやっていきます。
※この手順では、本来初めにやったほうが良いと言われるローカル環境づくり(XAMPP)及び子テーマの作成をやっていません。カスタマイズを色々する場合や商用のサイトではちゃんとやったほうが良いと思います。
※この手順では他ブログからの引っ越しについて書いていません。

はじめにすること。
●ドメインを用意しておく。
●wpxサーバーの管理画面にログインし、自分のドメインにWordPressをインストールする。
(他社で取ったドメインの場合、インストールの前にドメイン認証が必要です。私は最初のブログの時はWhois認証を選びました。ドメインの反映には24時間程度かかります。)(今回の私の新しいブログには新しくドメインを取らずにサブドメインbooks.suzukimemo.comを使用して2個めのブログにしています。)
(今後ずっとブログ記事を書きこむWEB画面のことを「ダッシュボード」と言います。ダッシュボードログインID=WordPressID=ダッシュボードにログイン時のユーザー名=管理ユーザです。呼び名で混乱するけど同じものです。これは自分で決めます。後から変えられません。)
(インストールが完了するとダッシュボードログイン用のパスワードが自動生成で与えられるのでメモっておきます。)
●インターネットで自分のサイトアドレスに初期ページが表示されているのを確認する。
(サイトのアドレスをアドレスバーに直接打ち込むとWordPressの初期サンプルページが公開されているのが見られます。ページが出来たてのうちはgoogleのクローラーが回ってきてないのでほぼ人は来ませんが、準備中の様子を見せたくない人はこの後にメンテナンスモードにするプラグインを使うなどして非公開にして下さい。)

その次にすること。
●FTP接続を有効にする。
(wpxサーバーのWordPress一覧ページでグレーのボタンを順に、設定・FTPアカウント設定・設定変更・設定変更(確認)とクリックします。設定編集を完了するとFTP接続に必要なパスワードが自動生成で与えられるのでメモっておきます。もう一度FTPアカウント設定をクリックしてFTPホスト名もメモっておきます。)
(FTPのパスワードを忘れたら、設定-FTPアカウント設定-設定変更でパスワード欄に自分で新しく考えて入力すると上書きできます。)
●FTPソフトを使って自分のサイトアドレスに接続してみる。
(自分のサイトアドレスには、インターネットブラウザだけでなくFTPソフトでも接続することができ、フォルダやファイルを触ることができます。これは後でWordPressのカスタマイズに失敗すると(特にfunction.php)、サイトが真っ白になった上ダッシュボード画面にすら入れなくなるため、ここからも接続できるように設定しておきます。)
(cssのカスタマイズの後やプラグインを入れる前などに随時バックアップを取るのにも使います。)(FTPソフトをまだ使ってない人は「FTPソフト 無料」で検索してダウンロードして下さい。私はFTPソフトはFileZillaを使用してます。FFFTPも有名です。)(FTPソフトは入力欄の名称が分かりにくいのでFileZillaとFFFTPの参考画像を作りました。)
●Affingerのサイトでテーマをダウンロードしてきて、自分のデスクトップにzipファイルを置いておきます。

↑↑↑ここまで終わったら、後はダッシュボード(ブログ記事を書く画面)にログインして作業します。↑↑↑
●wpxサーバーにログインし、一覧から「ダッシュボードへ」をクリック。ログインページが出てきます。
(毎回サーバーログイン→ダッシュボードログインとたどるのは面倒なので、ダッシュボードログインページをブラウザのお気に入りに入れておくと便利。)
●ダッシュボードにログインし、外観-テーマにAffingerをアップロードし有効化します。
(テーマを入れ終わった後に、ここでもう一度FTPソフトで接続するとwp-contentフォルダの中のthemesフォルダの中にAfingerのフォルダが増えていることが分かると思います。カスタマイズに失敗した場合はここから該当のファイルを削除しアップロードしなおせば復旧できます。)
●外観-カスタマイズで背景色、タイトル、ヘッダー画像、見出しの色などを設定します。
●設定-メディアの「アップロードしたファイルを年月ベースのフォルダに整理」のチェックを外してあるのを確認します。
●もしも設定-パーマリンク設定を変える場合はこのタイミングで。〈 重要!!後のやり直しがききません。〉
(パーマリンクとは記事ごとのアドレスのことです。初期状態でも大丈夫ですが、変える場合はカテゴリは含めないほうがいい、日本語タイトルを入れるのはやめたほうがいい、などと言われています。)(後から変更すると過去記事がすべてリンク切れになるので注意。)

↑↑↑ここまで終えてから投稿記事を書きはじめます。↑↑↑
●投稿記事を書き、公開し始める。記事ごとにアイキャッチ画像やタグを設定すると見やすいです。
●固定ページにプロフィールを書き、連絡用メールフォームを設置。
(メールフォームはプラグインで設置可能です。私は旧サイトにあるのでリンクしてそっちを使ってもらうことにしました。)
●googleアナリティクスのページでアナリティクス設定-新しいアカウントを設置でアドレスを登録しトラッキングIDを取る。トラッキングコードをコピー。
●ダッシュボードに戻り、header.phpにさっきのgoogleアナリティクスコードをペーストしてアクセス解析の設置完了。
(設置した日からカウントされます。設置前の日付のアクセスは見られません。)
●もし外観-カスタマイズで変えられない見た目部分をどうしても変えたい場合は外観-テーマの編集からstyle.cssなどをいじります。なるべく変えないほうが楽です。
(私が変えた部分:ヘッダー下メニューバーのグレーのグラデーションを白色に。サイドバーのタグクラウドの調整にstyle.cssとfunction.phpにコピペ追加。関連記事のランダムをカテゴリではなくタグで拾うように変更。最新記事の抜粋文を削除。スマホの文字が大きい気がしたのでp(本文)サイズをすこし小さく。)
(もしカスタマイズした外見がすぐにサイトに反映されない場合はブラウザのキャッシュが残っています。放置してれば長くて半日も待てば反映されます。)
●記事が出来てきたらプラグインを使ってgoogleにサイトマップを送信します。
(一回送信すれば今後記事を更新するごとにgoogleに知らせてくれ、検索されやすくなります。余裕があればGoogle Search Console(旧Googleウェブマスターツール)にも登録。Search Consoleのサイトで確認用のメタタグをコピーしheader.phpにペースト。)
●スマホや他のパソコンでサイトの表示が崩れていないかを確認し、メールフォームやコメント欄があればテスト送信して試しておくと安心です。

↑↑↑ここまででブログが出来上がってます。記事が5個位たまってきたら、必要があればアドセンスとアソシエイト審査を申請します。↑↑↑
●googleアドセンスへ新規で申し込む(二次審査まであります)。すでに別のサイトで通っていればサイトの追加申し込みは不要。
●googleアドセンスのページでコードを取ってコピーし、ダッシュボードに戻り、サイドバーウィジェットにペーストして設置。
(※Affingerは336pxと300pxのコードを入れる場所が用意してあるため、広告の設定-「新しい広告ユニット」を2回作ってコードを取得します。)
(※レスポンシブサイズで1個取って使いまわそうとしたらサイトがやたらに重くなったのでそれぞれサイズ指定で取得しなおしました。)
(アドセンスはたとえ広告内容の確認のためであっても自分でクリックしてはいけないので注意!!うっかり1・2回クリックまでなら見逃してくれますが不正クリックと見なされると停止されます。もし広告先を見たかったら「広告の許可とブロック」-「広告(レビューセンター)」を使ってください。)
(記事下の広告はAffingerの方でサイドバーウィジェットにアドセンスを入れたらここにも自動で入ってくるようになっているので設定不要です。もし非表示にしたければsingle.phpをいじる。)
(アドセンス審査が通った後、時期をおいてgoogleから口座確認用にPINコードのハガキが郵便で届きます。ぺらぺらなのでチラシと一緒に捨てないように注意。)

●Amazonアソシエイトへ新規で申し込む、または追加サイトの申請をする。
(※今回私は追加サイトとして申請しました。5記事書き、すでに記事内にアソシエイトリンクを入れたうえに、固定ページにAmazonアソシエイト参加の旨の文言をいれた状態で申請しました。)

余裕があれば後でやるといいかもしれないもの

やっておくと安心なもの
●googleアドセンスの右上歯車マーク-「設定」から「アクセスと認証」-「サイトの認証」で自分のサイトを登録する。
(他人の不正な貼り付けから守れます。)(追加でサイトを作った場合、アドレスを追加するのを忘れないこと、収益が入りません。)
あると親切なもの
●更新のお知らせをフェイスブックやツイッターに連携させる。ツイッターカードの設定。
●ファビコンの設定。

作った後のメンテナンスについて

ブログが出来た後もちょこちょこやることがあります。

●時々WordPressとプラグインの更新をする。
ダッシュボードに更新マークが出てたら常に最新のものに更新します。月一くらいは確認すること、古いまま放置するとセキュリティが危うくなるので注意。
●アナリティクスに変なアクセス履歴があってもクリックして見に行かないこと。
「リファラースパム」で検索。ビュー設定で「ボットのフィルタリング」を設定する。
●アドセンスに怪しげな広告(主に海外系の無料ダウンロードボタンが緑色のもの。)が出て嫌ならブロックすること。
「広告の許可とブロック」-「広告(レビューセンター)」-「フィルタ」で探してブロックできる。でも週一くらいで新しい困った広告がでるので、もぐらたたき状態になっている。このメインのブログは無料素材配布をやっているからこういう広告が出やすいのかも。あとアドセンスページはなるべくChromeブラウザで開くこと。IEだとレビューセンターがずっと見れない事がある。
●時々バックアップを取る。
(もしもに備えて時々記事や画像やカスタマイズしたテーマはバックアップを取っておきます。wpxサーバー側では無料で14日間保存しておいてくれてますが復旧は有料です。自分でプラグインBackWPupを入れて自動バックアップするのが便利そう。)
(何らかのトラブルでまっさらな状態に戻したい場合wpxサーバーの管理画面で編集-アプリケーションの初期化でWordPressを初期化して一から全部やり直すという方法があります。記事がすべて消えるので最終手段です。)

感想

jill111 / Pixabay

改めてWordPressのためにやったことを書き出したら、結構大変だなと思いました。
私は元々fc2ブログで始めてから2年で100記事位貯まったところで、WordPressってどうなってるんだろう?って試したかったので引っ越したけど、初めてのブログだったら挫折したかも。
最初は記事を書くのだけに集中出来る方がいいので、WordPressでもカスタマイズを後回しにして運営するか、無料ブログでスタートするほうが身軽でいいかもしれないです。

思いがけず、すごーく長い記事になってしまいました。
あとで思い出した点とかあれば、また随時更新します。

 - WEB