サイト構築に関するメモ

前提として

いにしえの同人サイトの形を保ちつつ、スマホ対応とかの部分は現代的にバージョンアップしたい
wordpressは正常に設置済み
前サイトの記事とか他テーマからの（ほぼ）移行なし
html/cssならまだわかるけどphpになると意味不明レベルのweb知識（無料テーマはカスタマイズで挫折）
使用ソフトはTeraPad、FFFTP

有料テーマ？無料テーマ？

　有料テーマは確定ガチャだ買え。

私も最初は「使いこなせるか分からないし」とか無料テーマをインストールしてたんですが、改行が反映されないとか変な隙間があるとか、まーちょっとしたカスタマイズにつっかかるつっかかる。（そしてやる気をなくす）

海外製の無料テーマ、もちろんいいテーマもありますし、沢山使われているものなら解説ブログも色々あります。でもですね、検索対策なのか「○○（テーマ）を初心者にオススメする○（３とか５とか）個の理由」「インストールすべきプラグイン○個」って同じような記事が沢山出てきて、上記の「ちょっとした部分」を説明してる記事にたどり着くのに一苦労。そしてそういったブログだと、当然ながら設置方法・修正方法、説明が上手い人と下手な人がいます。

カスタマイズすべき記事に当たり、かつ初心者向けに説明の上手い人に当たらないとえらい時間をとるわけです。（ほらめんどくさい）直に製作元の英語にあたれる人は別にして、初心者は完成されたテーマを買っちゃって良いと思います。

使用テーマは「SANGO」

気にした点
設置・カスタマイズサポートが手厚い（もちろん日本語（笑））
レスポンシブ対応（基本）
更新が楽そう（重要）
デザインがかわいい（重要）
複数のwordpressに使用可（この際オリジナル用サイトも作りたかったので。10,800円[2017.11現在]は高く感じますが、複数サイト可の他のテーマはもっと高いです。）
気にしなかった点
SEOに強い（二次サイトの方はむしろ広がらなくていい）
早い（？画像メインだしどのみち重くなる）

リンク
SANGO心地良さを追求したWordPressテーマ

SANGOの子テーマ「PORIPU」

手を抜けるところは抜くのだということで買いました。私は追加デザインが可愛くて買ったけど、広告入れてる人はめちゃくちゃ楽なんじゃないかなコレ。詳しい機能はリンクから。

リンク
PORIPU-SANGO公認の子テーマ | Just another SANGO ThemePORIPU-SANGO公認の子テーマ

注意

両方とも中の人が今後値上げの可能性を明言していますので、購入の決断はお早めに。

プラグイン

Table Of Contents Plus（目次）

公式推奨プラグイン

AddQuicktag(クイックタグ管理)

これも公式推奨

FooGallery/FooBox Image Lightbox（ギャラリー）

イラストをずらずら並べるのに、これが更新が手軽でいいかなーと設置しましたが、これ漫画はどうなるのかという部分があって、まだ変更があるかもしれません。＞漫画に良いプラグインがなさそうなので、結局漫画はただずらずら並べるのがスマホにもいいかなーとかそんな感じ。

Contact Form 7（問い合わせフォーム）

デフォルトで使っていたらスパムメールが来たので、追加でチェックボックスを付けました。

ダッシュボードメニュー＞お問い合わせ＞フォーム欄で「承認確認」ボタンを押してタグを任意の場所に挿入。基本的に何もチェックを入れずに「タグを挿入」ボタンを押して大丈夫です。

タグの後ろにお好みの文面を。このサイトだと「上記の内容で送信する」になっています。

Instagram Feed（インスタグラム表示）

Jetpack（記事投稿時にtwitterと連携）

通常「SANGO」を使っている分には、記事下等にシェアボタンがありますので、それを利用すればこのプラグインは必要ないと思います。あくまで「シェア」ではなく「自分の投稿時に自分のツイッターとだけ」お知らせ等連携したかったので。

What’s New Generator（更新履歴）

WP Fastest Cache/Scripts-To-Footer（SANGO高速化）

詳しくはこちらの「マサオカブログ」様。

参考
【爆速サンゴ計画】SANGOを高速化するカスタマイズマサオカブログ

こちらのブログではプラグイン３つ紹介されているんですが、このサイトではAutoptimizeはダメでした。ギャラリーに使っているFooGalleryとバッティングしてしまうようで、ギャラリーが見れなくなってしまったので外しています。このサイトは高速化より絵の表示の方が大事ですからねぇ。

画像圧縮については、プラグインを色々増やしたくなかったので（何用のプラグインか忘れる（笑））、いつも使ってるオンラインサービスで圧縮してからアップロードしています。

CSS

拡散系ボタンは絶対潰すマン。ということで以下のコードをペタッとcssに張り付けると色々非表示にできます。

拡散したいブロガーさんなんかは当然この辺りの設定は不要です。

css

/*固定ページ下のシェアボタンを表示しない*/
.page .sns-btn { display: none; }
/*投稿ページ下のシェアボタンを表示しない*/
.single .sns-btn { display: none; }
/*記事下シェアボタンの非表示*/
.article-footer .footer-contents .sns-btn { display: none;}
/*タイトル下の空白を狭める。円形シェアボタンはオフにすること*/
#main .entry-content { padding-top: 10px;}
#main .article-header { margin-bottom: 10px;}

また、「SANGO」の場合はデフォルトのカスタマイズ項目で以下の設定ができます。