新規サイト作成時に見るとやることが分かるかもしれない記事
やること
・ドメインの取得
・サーバーの確保
・ネームサーバの設定
・ドメインの追加
・wordpressのインスト
・SSL設定
・httpからのリダイレクトとか
・テーマのアップロード
・プラグインの確保
・CSS（デザイン）
・WPの細かい設定
・キャッシュ
・よく使うコードを使いやすくしとく
ドメインの取得
どこでもいいからドメインとる。
その時、過去に悪い運営実績のあるドメインを取得するのなんとなく嫌なのでアーカイブを確認。
過去運営歴があるなら避ける。
サーバーの確保
エックスサーバーで良さげ。
複数同居させるのはありだが、大規模化（数百万PV）でるサイトを作る予定ならそれ用に確保しておくべき。
ただし後からサーバー移そうと思えば映せるのでそこまで考えなくてもいいと思われ。
ネームサーバの設定
ドメインとったところでネームサーバ設定する。
サーバ確保したサイトのサーバ情報のところにネームサーバ情報あるので、それをコピペして貼り付け。
ドメインの追加
サーバ側でドメインを追加する。
特に注意点なし。
wordpressのインストール
wordpressというかCMSを入れる。HTML直入れ予定なら省いてよし。
エックスサーバーなら自動インストールでおｋ
他だとFFFTP？とかのFTPソフトでソフト上げる感じになるのかな、謎。
MySQLは面倒なので常に新規作成にしてる、問題があるのかは不明。
SSL化
エックスサーバは無料なのでやっておく、後からやろうとするとクソ面倒くさいので必ずやっておくこと。
新規なのでバックアップは取らずスタート。
エックスサーバーだとSSL設定からドメインを選択して独自SSL設定の追加で出来る。
ちなみにSSL設定した後すぐはhttpsのURLは使えないので注意、ここまでで後ろは後日ってことにしても良いかも。
httpからのリダイレクトとか
これ忘れるとトラブルの発生源になりそうなのでやっとく。
とりあえず一般からURLをhttpsに変更。
エックスサーバーから.htaccessファイルにリダイレクト用のコードをぶち込む。
寝ログさんの所のコードを僕は使ってます。
WordpressをhttpからhttpsにSSL化した全手順まとめ（エックスサーバー環境）
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>
ちなみに僕の環境だけかもですが、.htaccessファイルの一番上にこれ入れないと正常に動作しませんでした。色々キャッシュとかのコード入れてて不具合出た人は真似してみるとよろし。
テーマのアップロード
デザイン用に何かしらアップ。
僕はAffinger厨なのでそれ、クレジット削除と有料プラグインもついでに上げとく。
プラグインの確保
使うプラグインインストールする。ホントはzipで落としてまとめて上げたほうが楽なんだけど面倒くさくてやってない。
Table of Contents Plus
AmazonJS
Broken Link Checker
Contact Form 7
EWWW Image Optimizer
Imsanity
PS Auto Sitemap
Rich Text Tags, Categories, and Taxonomies
Shortcodes Ultimate
Simple Colorbox
WebSub/PubSubHubbub
WordPress Popular Posts
WP Remove Category Base
Advanced Automatic Updates
updraftplus
TablePress
WP Post Branches
気になるとこだけ軽く解説。
Imsanity
なんとなく横幅1060pxに縮小するように設定してる。
軽くなってたらいいなぁ。
なおヘッダーを作ってアップするときに1060pxでの縮小を有効化してると、サイズが足りなくなって残念な目にあいます。
Advanced Automatic Updates
ズボラなのでテーマとプラグインの自動更新用に入れてる。マイナー及びセキュリティ版で自動更新するよう設定中。
WebSub/PubSubHubbub
入れとくと記事がインデックスされやすくなるらしい、でも効果がなくなったみたいな記事も読んでて謎。記事書いた後すぐにサチコからFetchするならいらないかも。
Shortcodes Ultimate
色々あるけど、2カラムにするやつと隠すようにスポイラーしか使ってない。
機能見た感じYoutubeの挿入機能は色々カスタマイズできて良さげ。
Rich Text Tags, Categories, and Taxonomies
カテゴリページに記事入れたい時に捗る、なおカテゴリを充実させる方法がわかってないので使いこなせていない。
Simple Colorbox
画像をリンク付きで出す時、wordpressのデフォルトだと別ページが開かれてなんとなくウザいので採用。見た目がsimpleで軽そうだし色々類似プラグインあったけどこれにした。
updraftplus
バックアッププラグイン、強い。
ただ最高に僕がアホなんだけど毎日バックアップデータをクラウドに入れてたら容量限界来て保存されていない＼(^o^)／
30日保持原因でクラウドがパンパンになってたみたいなので一週間に変更しました……。
WP Post Branches
修正するときって下書き保存できないけど、これがあると実質可能になる。ただ結局ノリで修正作業しているせいで使えてないんですけどね(^^)
AmazonJS
amazonの商品を簡単にぶち込める。
カエレバとどっち使うべきか…いや間違いなくカエレバのほうが多機能で便利なんだけどこっちのほうが挿入楽なんですよね。
というわけで僕はメインこっちで要所要所はカエレバって感じになりそう。
Table of Contents Plus
検索アクセスほしいなら入れとくべき、見出しのリンクが検索エンジンに表示されたりするので。
雑なコメント
EWWW Image OptimizerとImsanityはどっちかだけでいいっぽいけど機能がよくわかってないのでどっちも使ってる、現状特に不具合ないし。
それから今後ページ分割もしていきたいけど、プラグインじゃなくて直接記述でも行けそう。この辺は実際やるときに詰めると思うの。
CSS（デザイン）
見た目麗しいサイトを作るほどの技術無いけど、デザイン気に食わないとサイト作成のモチベが保てないので適度に頑張る。
基本的にはH2,H3,H4の見出しに色つけて、スマホ・タブレット・PCで文字サイズ調整。Pタグの文字もデバイスごとに調整しておけばいいかな。
あとpタグの文字色は#333333とか#4B4B4Bとかが好み。
イメージ的には大画面になるほど文字色濃くしたほうが見やすいだろうから、その辺配慮して選択すればいいかな。#4b4b4bはスマホ採用で#333333はPC採用かないまのところ。
それからリンク面も、ボタンと関連記事用のboxは作っておきたいかな。文章途中で使いやすいリンク装飾用のアイコンとかもあると尚良し。リンク大事なのでABテストしとくべきかなぁ。
WPの細かい設定
ここが死ぬほど面倒くさい。
とりあえずOGP設定しておく。
アナリティクスとサーチコンソールの設定も済ませとく。
キャッチフレーズとかもとりあえずで良いので適当に書き換えとく。
そしてムーブメントに乗るためAMP対応すべきなんだろうけど、画像面・AmazonJSやTablepress・shortcode、リンクなどで不具合おきそうだし知識面が足りなさ過ぎるのでやってない。せっかっくaffinger使ってるしやってみたいなあ。
キャッシュ
プラグインでいいだろうけど前になんたらfastみたいなの入れたら色々不具合が生じたので、.htaccessに直接コード入れてます。
<IfModule mod_deflate.c>
SetOutputFilter DEFLATE
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico)$ no-gzip dont-vary
SetEnvIfNoCase Request_URI _\.utxt$ no-gzip
#DeflateCompressionLevel 4
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/atom_xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-httpd-php
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
</IfModule>
<ifModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 2 days"
ExpiresByType text/html "access plus 1 seconds"
ExpiresByType text/css "access plus 1 weeks"
ExpiresByType text/javascript "access plus 1 weeks"
ExpiresByType image/gif "access plus 2592000 seconds"
ExpiresByType image/jpg "access plus 2592000 seconds"
ExpiresByType image/jpeg "access plus 2592000 seconds"
ExpiresByType image/png "access plus 2592000 seconds"
ExpiresByType image/svg+xml "access plus 2592000 seconds"
ExpiresByType image/x-icon "access plus 2592000 seconds"
ExpiresByType application/pdf "access plus 1 weeks"
ExpiresByType application/x-font-opentype "access plus 1 weeks"
ExpiresByType application/x-font-ttf "access plus 1 weeks"
ExpiresByType application/x-font-woff "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
ExpiresByType video/ogg "access plus 1 month"
ExpiresByType video/mp4 "access plus 1 month"
ExpiresByType video/webm "access plus 1 month"
</ifModule>
こんな感じなのをつらつらと。どこかのサイト様から拾ってきたんですが忘れて見つけられなくなりました。リンク貼れないスマヌ。
一応書いておきますがこれ入れて不具合生じても責任取れません(^^)
よく使うコードを使いやすくしとく
僕は編集をテキストベースでやるんですが、その時使うコードを投稿ページの上のところに入れたいわけです。
基本的にそういうのはadd quickなんたらっていうプラグイン使うんですが、affingerだとfunctions.phpから増やせるのでそこいじります。
if (!function_exists('st_add_orignal_quicktags'))
から先の関係ありそうなとこ子テーマのfunctions.phpにコピペして、後はノリで消したり増やしたり。
後は企画案に則って記事の作成していけるのではないかと。
記事入れの基盤を作るまでって長いくせに、そんなに数こなさないので備忘録用に書きました。
抜けがあったらまた追記するかも。
