趣味のウェブサイトを3日で作る方法;WordPressによるサイト制作メモ

いまの勤務先に転職する前、ウェブ関連の会社で、立ち上げから1年間だけ働いていた経験があります。 まったくの無知の状態からはじめて、専用サーバーを契約してSSHと悪戦苦闘したり、Photoshopでフリー素材を加工したり、Illustratorでバナーをつくったり、WordPressを管理画面まで含めてフルカスタマイズしたり。社長の無茶ぶりに応え続けていたら、一年で結構スキルアップできました。

3年前に転職したのですが、時間もあるし、そろそろウェブサイトでも趣味的につくりたいなあと思ってたので、この3連休を利用して突貫で制作しようと思った次第です。

 

サイト制作にあたり、全て無料で3日でつくる、という目標を設定しました。続くかどうかわからないし、よしんば続いたとしてもアフィリエイトで収益化できるとは思えないので予算をかけるほどでもないし、本来の目的である読書に時間をかけたいのでサイト制作に使う時間は3日間に限定しました。

 

CMSの選択

まず最初に悩んだのが、CMSの選択です。XOOPSとかMODXとかtumblrとかbloggerとかもちょっと考えたのですが、最終的には、はてなにするかWordPressにするかでの二択で悩むことになりました。カスタマイズ性はWPのほうが高いな、でもWPは挙動が不安定だし、記事を書くだけのはてなのほうがいいかな、なんて。

結論としては、今後の発展性に夢を馳せて、何でもできるWordPressを選択。

 

基本からしっかりわかる WordPress 3カスタマイズブック (Web Designing Books)

基本からしっかりわかる WordPress 3カスタマイズブック (Web Designing Books)

 

前職で大変お世話になった一冊。ボロボロになるまで使い倒しました。 

 

サーバの選択

商用可能な無料のサーバで、アカウントが「http://www.example.com/hoge」みたいにディレクトリ構造になっているのはあんまり好きじゃないので、「http://hoge.example.com/」みたいにサブドメインが使えて、広告なし、という条件でサーバ探し。

 

まずはhostingerでアカウントを取得してWordPressを設置。サブドメインがいくつか選べるけど、ドメインがどれも微妙。課金するとサーバのスペックあがるみたいです。試しにWordPressをインストールしてみたんだけど、非常にレスポンスが悪い。レスポンスが悪いのはユーザビリティ的にもSEO的にもよろしくないので、さっさと見切りをつけて他を探す。

 

それで、広告入りだけどわりと評判の良さそうなwpblogを試してみる。

レスポンスは許容範囲。 広告が上部に少し入るのと、ドメインが選べないのがマイナス。 ftpでの接続が「/wp-contents」以下のディレクトリに限定されるので、WordPressに慣れている人には痒いところに手が届かない思いをするでしょう。その一方で、WPのインストールはスムーズで、コントロールパネルからボタンひとつでインストール完了です。

 

これ以上探すのも時間がないなので、レスポンスを重視してwpblogに決定しました。

 

テーマの設定

WordPressデフォルトのテーマだといかにもなので、カスタマイズをしないでそれっぽく表示されるシンプルな無料のもの、という条件で小一時間探して、Iconic Oneというテーマを選択(デモサイト)。ヘッダー部分のタイトル画像とSNS連携は管理画面から簡単に設定できます。ほかのカスタマイズは最小限。content-page.phpを修正してトップページにアイキャッチ画像を挿入して、CSSを少しいじって色を修正したくらい。

f:id:kmthrfm:20141125232743j:plain

 

プラグインのインストール

プラグインは「絶対に導入しておきたいWordPressプラグイン9選 」を参考にしました。


絶対に導入しておきたいWordPressプラグイン9選

 

導入したプラグイン

  • All in One SEO Pack:SEO対策の定番。
  • WP Social Bookmarking Light:twitterFacebookはてななどのソーシャルボタンが簡単に設置できます。
  • Head Cleaner:WordPressは<head>要素とフッター部分に、そのページには不要な出力をたくさんするのですが、それを整形してくれる。っぽい。

 導入を見送ったプラグイン

  • W3 Total Cache W3 Total Cache:インストールすると505エラーが帰されてしまいます。原因をネットで調べたところ、どうやら .htaccess が壊れてしまうのでファイルの書き換えが必要なのですが、wpblogでは .htaccess が更新できないので使えません。
  • Lazy Load:画像はAmazonから引っ張ってくるので使わないかなと。
  • EWWW Image Optimizer:同上。
  • TinyMCE Advanced:管理画面のビジュアルエディタを強化してくれるプラグインのようですが、不要。
  • Akismet:コメントスパム対策。コメント欄は全部閉じる予定です。
  • Contact Form 7:コンタクト欄もいらない。

 

その他に導入したプラグイン

  • Google Analytics Dashboard for WordPress:言わずと知れたGoogle Analyticsを簡単に導入してくれる上、ダッシュボードにAnalyticsの結果を表示してくれるプラグイン。2週間前くらいにメジャーバージョンアップしたみたいで、日本語の紹介サイトがみつからなかったので設定がんばった。
  • Favicon Rotator:ファビコンを簡単に設置できるプラグイン。なんの説明も読まずにそれっぽく操作したらすぐに設定できました。 icoファイルはスムーズだったんだけど、なぜかicnsファイルがアップロードできなくて困っています。そのうち気が向いたら原因を調査します。思い当たる方がいたらブコメください。アイコンは、フリー素材かつ加工なしでそのまま使えそうなやつを探して、Icons DBというサイトで見つけました。本当はベクターデータの素材が良かったんだけど、ウェブ上でサイズ指定してDLできるのでオッケーということにしました。サーバが不安定で、たまに落ちているときがあります。

    Icons DB - free custom icons

 

この他、「Wordpressでアフィリエイトするなら絶対に知っておきたいプラグイン6選 | Wordpress奮闘記」の記事にあるプラグインもひととおり見たんだけど、目的に合うものがないので、見送り。21世紀になって久しい現在、HTMLのタグ打ち作業をひたすらこなしました。 コピペに次ぐコピペ。カスタムフィールドを使ってcontents.phpをごにょごにょして、みたいなことも脳裏をよぎったのですが、今回はアイテム数が限定されているため努力と根性でアイテムの流し込みを行いました。このコピペ作業にほとんどの時間を費やしてしまいました。とほほ。アイテム数が未定のアフィリエイトサイトなどの場合には、何らかの手段を講じた方がいいと思います。

 

まとめ

構築は集中すればなんとなくできるんだけど、デザインがイマイチ。あとはコンテンツ。