サーバー更新のタイミングでこのブログのサーバーをスターサーバーからConoHa WINGに移転しました。目次

スポンサーリンク

きっかけは管理画面が重くなったこと

ブログを表示している分にはそんなに重く感じないんですが、管理画面が重くストレスが溜まるようになりました。

エックスサーバーに戻すという選択肢もあったのですが、簡単にサーバー移転ができると聞いてConoHa WINGに決めました。

スターサーバーとConoHa WINGの比較

	スターサーバー(スタンダードプラン)	ConoHa WING(ベーシックプラン)
最低利用期間	3ヶ月	なし
容量	100GB(SSD)	200GB(SSD)
月額	400円～(36ヶ月契約・税抜)	2円/時(1ヶ月最大1200円)
マルチドメイン	無制限	無制限
PHP5/7	○	○
MySQL	20個	80個
メールアカウント	1000個	無制限
独自SSL	無料	無料
WordPress高速動作	○	○
プラン変更	上位プランのみ可能	すべてのプランに変更可能
自動バックアップ	なし	無料
初期費用	1500円(税抜・2019.9.30まで無料)	なし
無料おためし	2週間	なし(2019.7.31までは20日間)

優位な項目の文字を変えていますが、料金以外はConoHa WINGに軍配があがります。

スピード比較

スターサーバーとConoHa WINGのスピードを比較してみました。

画像をクリックで拡大します。

スターサーバー(スタンダードプラン)使用時

ConoHa WING(ベーシックプラン)使用時

GTmetrix(YSlow)ではあまり変化がない気がしますが、PageSpeed Insightsではかなり数値が上がっているのがわかるかと思います。

特に管理画面の表示が早くなり、ストレスがたまらなくなりました。

ConoHa WINGは移転もかんたん

ConoHa WINGにはWordPressかんたん移行という機能があり、簡単にサーバーの移転ができます。

サーバー移転を機にテーマをCocoonに変更しました。CocoonSEO・高速化・モバイルファースト最適化済みのシンプルな無料Wordpressテーマ。100％GPLテーマです。wp-cocoon.com

以前、わいひらさんという方のSimplicityというテーマを使っていましたが、Cocoonも同じわいひらさん作のテーマです。目次

Cocoon+Seasonでプラグインやカスタマイズが最小限で済むよ

SANGO+PORIPUはとてもいいテーマなのですが、便利に使おうと思うとプラグインが増えていってしまうのが悩みでした。

また、内部リンクのデザインは好きなのですが、外部リンクを同じように表示しようとすると更にプラグインが増えてしまうというジレンマがあり、今回テーマを変える決心をしました。

Cocoonはスキンで簡単にデザインが変更できます

Cocoonに変えたきっかけはぽんひろさんのこのツイートがタイムラインに流れてきたから。

アイコン吹き出し付きボックスのカスタマイズ記事アップしました🐣

アイコン画像や吹き出し内容は自由に変更可能です！

WordPressテーマ問わずコピペで使えるようになっています。

「もし表示が崩れてる、うまくできない」などあれば連絡いただけると助かります🐥https://t.co/PUIaIYXbaY— ぽんひろ@ブログデザイナー (@ponhiroo) July 5, 2019

このツイートからぽんひろさんのサイトを見にいったときに、デザインがすごく好みで。

Cocoonでもこんなに可愛くできるんだと思ってすぐにCocoonに変更しました。

スキンはぽんひろさん作のSeason(シーズン)。

Spring、Summer、Autumn、Winterの4つのスキンが用意されているので、季節ごとにスキンを変えて行こうと思っています。

現在はサーバーをConoHa WINGに移転し、テーマをCocoon+Season(シーズン)に変更しています。
詳細は下記のエントリーをご覧ください。テーマをCocoonに変更したのでカスタマイズやプラグインをまとめてみるよサーバー移転を機にテーマをCocoonに変更しました。以前、わいひらさんという方のSimplici…love-2nd.netスターサーバーからConoHa WINGに移転しましたサーバー更新のタイミングでこのブログのサーバーをスターサーバーからConoHa WINGに移転しました。きっか…love-2nd.net

前編ではカスタマイズを中心にまとめました。SANGO＋PORIPU＋スターサーバーまとめ【前編】現在このブログはSANGO＋PORIPU＋スターサーバーで運営しています。この組み合わせで運営しているブログを…love-2nd.net

後編ではこのブログで使っているプラグインをまとめています。

さっちん

このブログでは現在23個のプラグインが動いています。目次

スポンサーリンク

最初からインストールされているプラグイン

WP Multibyte Patch

WP Multibyte Patch本家版、日本語版 WordPress のマルチバイト文字の取り扱いに関する不具合の累積的修正と強化を行うプラグ…eastcoder.com

本家版、日本語版 WordPress のマルチバイト文字の取り扱いに関する不具合の累積的修正と強化を行うプラグイン。

さっちん

最初からインストールされていますので必ず有効化しましょう。

入力を支援してくれるプラグイン

Classic Editor

WordPress5.0から標準のエディタがGutenbergに変わってしまい、テキストモードが使えなくなってしまいました。
テキストモードを使いたい方はこのプラグインが必須です。

エディタについては下記エントリーが参考になります。SANGOで使用するエディタを選ぶWordPressでブログやWebメディアを作るときには「Gutenberg（新エディター）を使うか、クラシックエディター（旧エディター）」を使うか選ぶことになります。 目次Gutenberg（新エディター）SANGOで …saruwakakun.com

AddQuicktag

AddQuicktagAddQuicktag は HTML エディター・ビジュアルエディターへのクイックタグの追加を容易にします。ja.wordpress.org

HTML エディターやビジュアルリッチエディターで定型入力に使用できるクイックタグを簡単に追加・管理できます。

All ShortCode of SANGO

SANGOのすべてのショートコードを視覚的にビジュアルエディタに挿入できるプラグイン。https://fwww.me/2018/06/23/all-shortcode-of-sango-release/fwww.me

こはるさんの記事がとてもわかりやすいです。SANGOがもっと便利に！「All ShortCode of SANGO」でショートコードを簡単に貼ろうこんにちは、こはるです！   弊ブログで愛用しているブログテーマ、SANGO。 ブログ界隈でもその美…blog.koharunote.com

SANGOサポーター

WordPressテーマ「SANGO」と「PORIPU」をさらに便利にしてくれるプラグイン。

こちらもこはるさんがわかりやすく説明してくださいました。プラグイン「SANGOサポーター」でSANGO&PORIPU;ユーザーのブログ効率がさらにアップするよ！こんにちは、こはるです！ SANGO礁の皆さま、ブログを楽しんでいらっしゃいますか？ さまざまなカスタマイズが…blog.koharunote.com

さっちん

SANGO特有のショートコードはAll ShortCode of SANGO、PORIPUの追加コードと参考リンクはSANGOサポーター、どちらにもないものはAddQuicktagを使っています。
AddQuicktagのタグが少なくなってエディタの見た目がスッキリしました。

ふきだしクリエーター

会話風の吹き出しを簡単に作成・呼び出しができます。
このブログでは親子の会話でLINE風アイコンをつかっています。ふきだしクリエーター動作条件 PHP 5.6.x 以上 WordPress 4.9.x 以上  store.kojikalog.com

もしものために備えるプラグイン

All-in-One WP Migration

All-in-One WP Migration1クリックでサイトを移動、転送、コピー、移行、バックアップします。すばやくて簡単、高い信頼性。ja.wordpress.org

すべてのブログデータを移行するツール。

1クリックでブログコンテンツをインポートまたはエクスポートします。

私はバックアップに使っています。

Edit Author Slug

Edit Author SlugAllows an admin (or capable user) to edit the author slug of a user, and change the author base.ja.wordpress.org

管理者(または資格のあるユーザー)がユーザーのauthor slugの編集やAuthor Baseの変更ができるプラグイン。

訪問者にユーザーIDが表示されるのを防いでくれるので、セキュリティ強化にもつながります。

ゆうこりんさんの記事がわかりやすいです。Edit Author SlugでワードプレスのユーザーIDを隠すyucorin.com

Invisible reCaptcha

Invisible reCaptcha for WordPressInvisible reCaptcha for WordPress plugin helps you to protect your sites against bad spam bots using the new Invisible reCaptcha by Google.ja.wordpress.org

Googleの新しいInvisible reCaptchaとWordPressサイトを統合する非常に強力なプラグイン。

ゆうこりんさんの記事を参考に設定していたのですが、該当の記事がなくなってしまいました。

SEO対策のためのプラグイン

Broken Link Checker

Broken Link Checker投稿や固定ページなどすべてのコンテンツについて、SEO 改善のためにリンク切れや消えた画像をチェックします。問題のあるリンクを発見すると通知します。ja.wordpress.org

壊れたリンクや存在しない画像がないかブログをチェックし、見つかった場合はダッシュボードで通知してくれます。

Google XML Sitemaps

Google XML SitemapsThis plugin will improve SEO by helping search enginess better index your site using sitemaps.ja.wordpress.org

Google、Bing、Yahooなどの検索エンジンがサイトのインデックスを作成するためのXMLサイトマップを作成し、送信してくれるプラグイン。

サルワカさんの記事がわかりやすいです。【WordPress】サイトマップ作成からSearch Console登録までの全手順WordPressでプラグイン「Google XML Sitemaps」を使ってサイトマップを作り、Search Consoleに登録する手順を1つずつ解説しました。saruwakakun.com

Redirection

RedirectionManage 301 redirections, keep track of 404 errors, and improve your site, with no knowledge of Apache or Nginx needed.ja.wordpress.org

301のリダイレクトを簡単に設定し、管理してくれるプラグイン。

正規表現が使えるので、パーマリンクを変更したときにも使えます。

私ははてなからの引き継ぎがうまく行かなかったものと、パーマリンク変更後のリダイレクトのために使用しています。

パーマリンク変更の際はもぐさんの記事がとても参考になりました。ドメイン移転やパーマリンク変更にはWordPressプラグイン『Redirection』がオススメ！ブログやWebサイトのドメイン移転やURL変更の際には、301リダイレクトの設定が必要になります。WordPressで運用している場合には、『Redirection』という便利なプラグインがありますので、このプラグインを使った際の設定項目の解説や設定サンプルをご紹介しています。jikitourai.net

高速化のためのプラグイン

EWWW Image Optimizer

EWWW Image OptimizerSmaller Images, Faster Sites, Happier Visitors. Comprehensive image optimization that doesn’t require a degree in rocket science.ja.wordpress.org

WordPress内の画像のファイルサイズを縮小してくれます。

いつもはTinyPNGでファイルサイズを縮小してからアップロードしていますが、忘れたときでもこのプラグインが自動で縮小してくれるので保険で入れています。EWWW Image Optimizerの設定方法と使い方を完全マスター【2017年版】「EWWW Image Optimizerの設定方法と使い方を知りたい…」という方のために今回は「EWWW Image Optimizerの設定方法と使い方を完全マスター」というテーマでお話していきます。nakaeshogo.com

Optimize Database after Deleting Revisions

Optimize Database after Deleting Revisions本プラグインは1クリック WordPress データベース最適化ツールです。ja.wordpress.org

たまったリビジョンを削除したりデータベースを最適化してくれるプラグイン。

いわしさんの記事を参考に1週間に1度自動で最適化する設定にしています。WordPressのリビジョンとデータベースを最適化 Optimize Database after Deleting Revisionsの設定と使い方WordPressのリビジョン削除や保存数などの管理はもちろん、データベースまで最適化してくれるという三拍子揃ったWordPressリビジョン管理プラグイン、Optimize Database after Deleting Revisionsを紹介します。wind-mill.co.jp

WP Fastest Cache + WP Fastest Cache Premium

WP Fastest Cache最もシンプルで速いWP キャッシュシステムja.wordpress.org

最もシンプルで速いWPキャッシュプラグイン。

このサイトの設定はこんな感じです。

下から3つ目にチェックを入れていないのはカスタマイザーに同じ設定があるからです。

わいひらさんのエントリーが参考になりました。初心者にも扱いやすいWordPressキャシュプラグイン「WP Fastest Cache」の使い方Wordpressのページキャッシュプラグインの導入としては、最も入りやすいかと思われる「WP Fastest Cache」プラグインのインストール方法や、設定方法の紹介です。nelog.jpモバイルキャッシュ生成が可能なWPプラグイン「WP Fastest Cache 有料版」の登録と使い方「WP Fastest Cache Premium」に登録して、ファイルをダウンロードし、インストールする方法の紹介です。主に、Wordpressのモバイル向けページキャッシュを生成したい場合に、購入すると良いかと思います。nelog.jp

商品リンクを簡単に作成できるプラグイン

Rinker+Rinker Fanbox用プラグイン

商品リンクの管理を楽にしてくれるプラグイン。
Fanbox会員限定で機能を拡張できます。商品リンク管理プラグインRinker（リンカー）の公式サイトRinkerはProduct Advertising API を利用しています。2019年1月16日2019年1月23日よりAPIの規約が変更され、30日以上売上がない場合APIの利用ができなくなる可能性があります。詳しoyakosodate.com

ゆうこりんさんの記事を参考に設定しました。Rinker（リンカー）が便利！導入と使い方を解説するよyucorin.com

その他のプラグイン

Code Snippets

functions.phpのコードを管理できるプラグイン。

このプラグインを導入すると、テーマのアップデートのたびにfunctions.phpを書き換える必要がなくなります。

また、コードを項目ごとに追加できるので、機能のONOFFが簡単にできて便利です。

使い方は下記のエントリーが参考になります。Code Snippets – functions.phpのコードを管理できるWordPressプラグイン | ネタワンCode Snippetsは、WordPressテーマの関数を定義する「functions.php」のPHPコードを管理できるプラグインです。 通常の場合は、「functions.php」にPHPコードを直接記述しますが …netaone.com

Contact Form 7

Contact Form 7お問い合わせフォームプラグイン。シンプル、でも柔軟。ja.wordpress.org

シンプルなお問い合わせフォームを作成できるプラグイン。

フォームとメールの内容を簡単なマークアップで柔軟にカスタマイズでき、複数管理も可能です。

Easy Table of Contents

自動的に目次を生成してくれるプラグイン。

TOC+が3年以上アップデートしておらず使い続けるのが不安なのと、Easy Table of ContentsでもいままでのSANGOと同じデザインにすることが可能になったため、乗り換えました。

カスタマイズガイドを参考に設定しましょう。SANGOでEasy Table of Contentsの目次を表示するSANGOではこれまで目次プラグインとして「Table of Contents Plus（TOC+）」に対応していました。しかし、TOC+は3年以上アップデートされておらず、WordPressとの互換性やセキュリティの問 …saruwakakun.com

WordPress Popular Posts

WordPress Popular Posts高度にカスタマイズ可能で、使いやすい投稿ウィジェットです。ja.wordpress.org

人気の記事ををサイト上に表示してくれるプラグイン。

PORIPUには同じカテゴリーの人気記事を簡単に表示できるウィジェットも用意されています。

Widget Logic

Widget LogicWidget Logic lets you control on which pages widgets appear using WP’s conditional tags.ja.wordpress.org

条件分岐タグでウィジェットをコントロールするプラグイン。

主に広告の表示をコントロールするのに使っています。便利なWordPressの条件分岐16パターン：カスタマイズで活躍するものを厳選！WordPressのカスタマイズで便利な「条件分岐タグ」とその書き方をまとめて紹介します。ホーム、カテゴリー、タグ、モバイル…などの条件により、表示を切り替えることができます。saruwakakun.com

最後にSANGO・PORIPUユーザー向けのおまけ

PORIPUの隠し要素

PORIPUにはいくつか隠し要素があります。

サイドバーのスポンサーリンク

実はマサオカブログで紹介されていたらしいのですが、PORIPUの公式サイトでアナウンスされていなかったので見つけたときには嬉しかったです。

PORIPU公式サイトで紹介してない隠れ要素を
さっちんさん（@musukosuhaha ）に見つけてもらいました！
嬉しかったので紹介します！
コレで画像のようになります！

pic.twitter.com/hfKPBza4fT— PORIPU（ポリプ）公式アカウント (@Poripu_wp) June 21, 2018

PORIPUのテーマのサムネイル

ぽりぷちゃんのテーマをアップロードしたら影が出る仕様…本当にかわいい(*ฅˊᵕˋฅ*)♡
早速、記事にも追記したよ(◍•ᴗ•◍)https://t.co/N5sc48lnFD pic.twitter.com/JrQ4urXqrU— りんご (@ringox365) June 26, 2018

サムネイルを見るとぽりぷちゃんの影がうっすらと見えます。

これは気づきませんでした。

SANGO・PORIPUユーザーリンク集

りんごさんとくまさんがSANGO・PORIPUユーザーのリンク集を作ってくださいました。

同じテーマを使っていてもぜんぜん違うので巡回するのが楽しいです。

現在はサーバーをConoHa WINGに移転し、テーマをCocoon+Season(シーズン)に変更しています。
詳細は下記のエントリーをご覧ください。テーマをCocoonに変更したのでカスタマイズやプラグインをまとめてみるよサーバー移転を機にテーマをCocoonに変更しました。以前、わいひらさんという方のSimplici…love-2nd.netスターサーバーからConoHa WINGに移転しましたサーバー更新のタイミングでこのブログのサーバーをスターサーバーからConoHa WINGに移転しました。きっか…love-2nd.net

先日このブログをスターサーバーに移転しました。

結論からいうと費用をあまりかけないでWordPressを運用したい人にはオススメできるサーバーです。

スターサーバーでも頑張ればこれくらいの数値が出ます。 プラグインはこの時点で20個です。←結局増えてしまったｗ

スターサーバーでも頑張ればやれるよシリーズ。 この数値、実はKUSANAGI for ConoHaを使ってたときよりよかったりします。 続きはブログで。

A post shared by さっちん (@musukosuhaha) on Jun 25, 2018 at 11:45pm PDT目次

スポンサーリンク

スターサーバーの特徴

私が契約したのはスターサーバーのスタンダードプランです。
6ヶ月以上の契約で月500円(税抜)で利用できます。スターサーバー(スタンダードプラン)

• 初期費用：1500円
• 月額料金：500円～(6ヶ月以上・税抜)
• 無料お試し：14日間
• 容量：SSD100GB
• 仮想CPU:3コア
• Webサーバー：Nginx
• PHP5/7(7.1.x / 7.0.x)：○
• MySQL：20個
• マルチドメイン：無制限
• メールアドレス：1000個
• データ転送量目安：300GB/月(10GB/日?)
• 独自SSL：無料(Let’s Encrypt)
• プラン変更：即時(上位プランのみ)
• WordPress簡単インストール：あり

さっちん

文字の色が違う箇所がエックスサーバーより優位な点です。

サーバー移転の前にバックアップを取ろう

今回の移転のきっかけはサーバートラブルでしたので(詳細は後述)、バックアップファイルがなかったらこのブログは消えていた可能性があります。

できればアックアップの方法は1つだけではなく2つ以上用意しておいた方がいいです。
私は2つの方法でバックアップを取っています。

All-in-One WP Migrationを使う方法

移転元と移転先の両方でAll-in-One WP Migrationが使えるならこの方法が一番楽です。
すべてのブログデータを簡単にインポート・エクスポートができます。

• STEP.1プラグインのインストール設定→プラグイン→新規追加→「All-in-One WP Migration」と入力して検索→今すぐインストール→有効化
• STEP.2移転元のデータをエクスポートサイドバーのAll-in-One WP Migrationを選択→エクスポート→エクスポート先をクリック→ファイルを選択→DOWNLOAD→CLOSE

バックアップはこれだけです。

プラグインを使わない方法

WordPressでバックアップを取る4つの方法（初心者向け）WordPressでバックアップを取る方法をパターン別にまとめました。「テーマのカスタマイズ時」「プラグイン更新時」「定期的な自動バックアップ」「今すぐデータを保存する方法」など。saruwakakun.com

ほぼ上記のやり方と同じなのですが、データベースはプラグインを使わずにphpMyAdminを使ってエクスポートしています。

• STEP.1phpMyAdminにログイン
• STEP.2WordPressに使用しているデータベースを選択
• STEP.3データのエクスポートエクスポートを選択→何も変更せずそのまま実行→保存

スターサーバーに申し込もう

さっちん

2019.9.30 18:00までにスターサーバーに新規申し込みをすると、初期設定費用が無料でお申込みできます。
申し込むなら今がチャンス！

スターサーバーでやること

スターサーバーにはわかりやすいマニュアルが用意されているので、基本的にはマニュアルを見ながら作業すれば問題ないです。スタンダードプランのマニュアル | レンタルサーバー【スターサーバー】レンタルサーバー「スターサーバー」のご利用マニュアル | スタンダードプランのマニュアル一覧です。各種手続きの方法や管理ツールの使い方、メールソフト・FTPソフトの設定方法などについて説明しています。www.star.ne.jp

• STEP.1ネットオウルに会員登録するネットオウル /新規会員登録
• STEP.2無料お試しに申し込むお申し込み方法 | レンタルサーバー【スターサーバー】
• STEP.3独自ドメインを設定する
  このサイトのドメインはエックスドメインで契約しているため、他社管理ドメインの設定手順を参考に設定しました。移転元のサイトが見れずWeb認証が使えなかったため、今回はWhois認証で手続きしました。Whois認証による独自ドメイン設定手順 | レンタルサーバー【スターサーバー】マニュアルには実際に独自ドメインが使えるようになるまで数時間から2日程度時間がかかるとの記載がありましたが、実際には1時間かからずにドメインが使えるようになりました。
• STEP.4無料独自SSLを設定するWebサイトの常時SSL化も同時に行います。無料独自SSL設定ガイド | レンタルサーバー【スターサーバー】Webサイトの常時SSL化 | レンタルサーバー【スターサーバー】SSL設定をしてから実際にサイトがSSL化されるまで時間がかかるのでSSL化されるまで待ちます。
  今回は2～3時間かかった気がします。
• STEP.5データベース設定SSL化が完了したらいよいよWordPressがインストールできるようにデータベースの設定をします。
  移転元と移転先でユーザー設定をできる限り合わせておくと何かと楽ですよ。データベースの設定 | レンタルサーバー【スターサーバー】
• STEP.6WordPressのインストールスターサーバーは簡単インストールの機能が使えるので新規にインストールします。WordPressのインストール方法(簡単インストール) | レンタルサーバー【スターサーバー】インストールが無事に終わったらサイトのURLをhttps://に変更→All-in-One WP Migrationをインストール→エクスポートしたファイルをインポート→無事にブログが表示されたら移転完了です。お疲れ様でした！

…と通常ならここで移転作業は終わりなのですが、今回はここで終わりではありませんでした。

ConoHaでのトラブルが今回の移転の理由でした

エックスサーバーに不満はまったくなかったんですが、ふとConoHa+KUSANAGIでWordPressを使ってみたくなり、1ヶ月ほどConoHaで運営していました。

最初から問題がいくつかありましてConoHaに移転してからのトラブル

• Let’s Encryptの週上限にひっかかりSSL化に失敗。サイトが表示されなくなった(一旦エックスサーバーに戻す)。
• リライト中に突然サイトが表示されなくなる。
• バックアップから元に戻したが、以前設定していた追加cssが消しても消してもゾンビのようによみがえる。

今まで15年近くブログを運営してきましたが、追加cssのゾンビ現象は経験がなく対処方法もわかりません。
ConoHaは基本的に黒い画面にコマンドを入力しないといけないので、復旧できたとしても時間がかかってしまいます。

ConoHa+KUSANAGIは表示スピードが早いといわれていますが、体感スピードはエックスサーバーで運営したときとあまり変わらずConoHaで運営するメリットがあまり感じられませんでした。

メンテナンスに時間を取られるデメリットの方が大きくなってしまい、今回サーバー移転を決意しました。

追加cssのゾンビ状態を解消するためにやったこと

このブログはエントリーが少ないので、とても地道な作業で元に戻しました。

標準の機能でエントリーと個別ページのみエクスポート

手元にはブログを丸ごとバックアップしたものしかないため、そのまま戻してもゾンビは解消されません。
標準の機能ですべてエクスポート→インポートでも同じ状況でした。

エントリーと個別ページだけインポートして、画像はバックアップファイルから必要なものだけアップロードして貼り直し、
テーマとプラグインも必要なものだけインストールしました。

テーマやプラグインはすべて設定し直したのでいろいろ見直しができましたし、画像を貼り直すついでに商品リンクをカエレバから別のプラグインのショートコードに貼り替えたので見た目もスッキリしました。

戻すのに2日ほど時間がかかってしまいましたが、ゾンビ現象はすっかりなくなりました。
PORIPUのアップデートを楽にするために追加cssを使っていましたが、またゾンビ現象が起きても嫌なので子テーマのcssに戻しています。

最後に

サイト復旧までに時間がかかりましたが、移転後は今のところトラブルもなくてホッとしています。

エックスサーバーではなく今回スターサーバーにしたのにはいくつか理由があります。スターサーバーに決めた理由

• はてなブログに移る前はミニサーバーユーザーだった
• エックスサーバーから移転するときにドメインをエックスサーバーからエックスドメインに移管した
• 維持費がエックスサーバーの約半額
• あまのじゃくな性格なので情報が溢れてるエックスサーバーやmixhostではなく、情報が少ないスターサーバーで人柱になろうと思った

要約するとあまのじゃくなので人があまり使っていなさそうなサーバーにしたかったってことです。

最初はちょっと引っかかりがあったり、エックスサーバーでできていたことがうまく行かずにちょっと苦戦したんですが、プラグインでどうにかなるので今のところは不満はありません。

現在このブログで導入しているものや設定については別エントリーを上げていますので、参考にしていただければ幸いです。

現在このブログはSANGO＋PORIPU＋スターサーバーで運営しています。

この組み合わせで運営しているブログをなかなか見かけないため、現在私がこのブログでどんなことをしているかまとめてみました。

これから同じようにSANGO＋PORIPU＋スターサーバーでの運営を検討している方の参考になれば幸いです。現在はサーバーをConoHa WINGに移転し、テーマをCocoon+Season(シーズン)に変更しています。
詳細は下記のエントリーをご覧ください。テーマをCocoonに変更したのでカスタマイズやプラグインをまとめてみるよサーバー移転を機にテーマをCocoonに変更しました。以前、わいひらさんという方のSimplici…love-2nd.netスターサーバーからConoHa WINGに移転しましたサーバー更新のタイミングでこのブログのサーバーをスターサーバーからConoHa WINGに移転しました。きっか…love-2nd.net目次

スポンサーリンク

このブログの環境

• サーバー：スターサーバー(スタンダードプラン)
• ドメイン：エックスドメイン
• テーマ：SANGO | 心地良さを追求したWordPressテーマ
• 子テーマ：PORIPUtears
• PHPバージョン：7.1.4

SANGO・PORIPU・スターサーバーについては下記エントリーでそれぞれ紹介しています。テーマをSTORKからSANGOに変えたのでカスタマイズやプラグインをまとめてみたよブログのテーマをSTORKからSANGOに変えました。STORKはとってもいいテーマだと思いますし、今まで特に…love-2nd.netPORIPUはかゆいところに手が届くSANGO公認の子テーマですPORIPUというSANGO公認の子テーマがリリースされました。子テーマをリリースしたのはSANGOのカスタマ…love-2nd.netエックスサーバーからスターサーバーに移転しました先日このブログをスターサーバーに移転しました。結論からいうと費用をあまりかけないでWordPr…love-2nd.net

functions.phpに追記しているもの

私がfunctions.phpに追記したものは下記の5つです。

コンテンツ内の非SSLのURLを表示前にSSL化する

WordPressサイトの内部リンクSSL対応（HTTPS化）をコードコピペでちょっと楽にする方法WordpressサイトをHTTPS化した時に必要となる内部リンクURLや、画像・iframeの手軽なSSL対応方法の紹介です。Wordpressで、the_contentをフックしてコンテンツ表示前に置換して表示させる方法です。nelog.jp

上記エントリーで紹介されているコードで、コンテンツ表示前に下記の処理をを行っています。

• 内部リンクURLのSSL化
• Amazonアソシエイト画像のSSL化
• バリューコマース画像（インプレッション画像）のSSL化
• もしもアフィリエイト画像（インプレッション画像）のSSL化
• A8.net画像（インプレッション画像）のSSL化
• アクセストレード画像（インプレッション画像）のSSL化
• 古いはてなブログカードの iframe URLのSSL化

とりあえず、これだけはデータベースの置換作業を行わなくてもSSL化表示されるようにしてみました。

引用WordPressサイトの内部リンクSSL対応（HTTPS化）をコードコピペでちょっと楽にする方法

さらに

• アプリーチのSSL化
• 楽天アフィリエイトのSSL化
• 価格.comのSSL化
• カエレバのSSL化

を追記しています。

追記した4つはコードの貼り替えによっておそらく不要になっていると思うのですが、保険でそのままにしています。

アフィリエイトリンクを改変せずにボタンを使う

アフィリエイトのリンクをボタンにするために、下記エントリーを参考にコードを追記しています。【SANGO】アフィリエイトリンクを改変せずにボタンを使う方法SANGOにはたくさんの種類のボタンが用意されています。これらのボタンは、リンクタグに対して、クラス名を追加することで装飾が施されています。 しかし、一部のアフィリエイトサービスではリンクタグの改変が禁止されている場合が …saruwakakun.com

Contact Form 7のCSSとJavaScriptの出力を制御する

Contact Form 7はすべてのページでCSSとJavaScriptを読み込もうとします。

サイトが重くなる原因にもなりますので、コンタクトフォームのページのみCSSとJavaScriptを読み込むよう制御しています。Contact Form 7のCSSデザインとカスタマイズ方法WordPress人気プラグイン「Contact Form 7」の基本的な設定方法と、スパム対策・プレースホルダー設定などのカスタマイズ、CSSデザインを解説。ブログのスタイルに合わせて、かっこいい問い合わせフォームを作ってみましょう。naifix.com

この記事を書いた人にAmazon欲しいものリストのアイコンを追加する

下記エントリーを参考に、Amazon欲しいものリストのアイコンを表示させるためのコードを追記しています。
楽天ROOMのアイコンの追加も可能です。https://cubkitson.net/blog/sango-wishlist-room2/cubkitson.net

Googleのスマホ版で検索したときにアイキャッチの画像を表示させる

下記エントリーのコードを追記すると、検索結果にアイキャッチの画像が表示されたりされなかったりするそうです。【WordPress】Googleスマホ検索結果にサムネイル（アイキャッチ）画像を出す方法（コピペでOK）Googleのスマホの検索結果に記事のサムネイル（アイキャッチ）画像を出す方法を紹介しています。コピペで簡単に導入できるので、このカスタマイズで集客効果を高めましょう。shikamori-p.com

style.cssに追記したもの

私がstyle.cssに追記したものを紹介します。

見出しのカスタマイズ

h2・h3・h4の見た目を変える

SANGOでデフォルトの見出しを変える方法SANGOではデフォルトの見出しは以下のようになっています。 目次見出し2（h2）見出し3（h3）デフォルトの見出しのデザインを変えてみよう見出しデザインを探そうセレクタを修正保存してキャッシュを削除無事反映された！色を …saruwakakun.com

現在はサルワカさんのサイトで紹介されている見出しを参考に変更しています。

h3のタテ線はもともと指定されているものを活かしています。CSSのコピペだけ！おしゃれな見出しのデザイン例まとめ68選h1〜h6タグの美しくおしゃれなデザインサンプルをたくさん紹介します。どれもコピペで使うことができます。saruwakakun.com

上部に見出しを追従させる

SANGOサポーター標準の機能ですが、アイコンを肉球にしたり、PCとスマホで表示を変えたりしています。SANGOサポーターの使い方【こじかWPプラグイン】インストール方法 プラグインを入手したら、まずはWordPressにインストールして有効化しましょう。 インストール手順はこちらの記事で紹介しています。 設定ページ インストールが完了すると、WordPressの管理メニ …kojikalog.com【SANGOを自分でカスタマイズ】上に表示される目次をスマホとPCで切り替えるWordPressテーマSANGOのちょっとしたカスタマイズを紹介します。今回は追尾型の目次をカスタマイズした方法について解説します。for-men.jp

おすすめ記事のPICKUPラベルを非表示にする

PORIPU公式サイトのよくある質問に記載されているものです。よくある質問PORIPUは正常な状態のSANGOをベースに作成された子テーマです。 親テーマにて自作されたカスタマイズを一…oldno07.com

記事ページの更新マークに丸い背景をつける

同様に投稿日・読了時間にも丸い背景を付けています。記事ページの更新マークに丸い背景をつけるWordPressテーマSANGOのちょっとしたカスタマイズを紹介します。今回は更新マークに丸い背景を追加した方法について解説します。for-men.jp

目次のデザインを変える

目次のプラグインをTOC+からEasy Table of Contentsに変更しました。
目次の開閉ができませんが、きちんと設定すればTOC+と同じようなデザインにできますよ。
右下にちょこんと猫がいるのがお気に入りです。SANGOでEasy Table of Contentsの目次を表示するSANGOではこれまで目次プラグインとして「Table of Contents Plus（TOC+）」に対応していました。しかし、TOC+は3年以上アップデートされておらず、WordPressとの互換性やセキュリティの問 …saruwakakun.com目次部分にオリジナル画像を挿入してみたWordPressテーマSANGOのちょっとしたカスタマイズを紹介します。今回は目次にさり気なく画像をプラスした方法について解説します。for-men.jp

追尾型目次にスクロールバーをつける

追尾型目次をスクロールできるようにします。【SANGOを自分でカスタマイズ】PCの追尾型目次をカスタマイズしてみたWordPressテーマSANGOのちょっとしたカスタマイズを紹介します。今回はPCで閲覧したときにサイドバーにある目次をスクロールに変更した方法について解説します。for-men.jp

ふきだしBOXや注釈用ふきだしの色を変更する

デフォルトカラーが微妙に合わないため、カスタムの色をメインカラーに合わせています。追加タグのコード一覧ふきだし 追加CSSデザインをまとめます。PORIPUならコードを貼るだけでOKです。 投稿画面のテキストエデ…oldno07.com

PORIPUtearsの下に出る吹き出しの名前の位置を変更する

名前の位置をアイコンの下ではなく横に変更しました。下に出る吹き出しの名前の位置とかを変更する（PORIPUtearsユーザー限定）WordPressテーマSANGOのちょっとしたカスタマイズを紹介します。この記事ではPORIPUtearsの下に出る吹き出しをカスタマイズした方法について解説します。for-men.jp

吹き出しクリエイターと他のふきだしのアイコンの大きさを合わせる

吹き出しクリエイターのアイコンのほうが小さいため、もともと使っているふきだしのアイコンに大きさを合わせました。
このブログでは親子の会話でLINE風のふきだしをよく使っています。ふきだしクリエーター動作条件 PHP 5.6.x 以上 WordPress 4.9.x 以上  store.kojikalog.comプラグインの吹き出しクリエイターを使ってみたら最高だったWordPressテーマSANGOのちょっとしたカスタマイズを紹介します。今回はSANGOの吹き出しを作るプラグイン「吹き出しクリエイター」をちょこっとだけカスタマイズした方法について解説します。for-men.jp

引用時の見た目を変える

引用時のイタリック体をノーマルに

イタリック体が好きではないのでノーマルに変えています。

/* citeの字体をノーマルに */
cite {
    font-style: normal;
}

ラベルの色を変える

Simplicityのときから使っている引用と書かれたラベルの色をサイトカラーに合わせて変更しました。

/* ラベル */
.sankou {
    position: relative;
    margin: 0 10px 0 3px;
    padding: 3px 5px;
    color: #ffffff;
    background: #6f6f6f;
    font-weight: bold;
    font-size: 0.7em;
}
.sankou:before{
    margin: 0 3px 0 0;
    content: \f00c;
    font-family: FontAwesome;
    color: #ffffff;
}

内部リンクのブログカードに続きを読むを追加する

続きを読むがあるだけでデザインが引き締まる気がします。【SANGO】ブログカードに「続きを読む」を追加するカスタマイズSANGOのショートカードで生成できる「ブログカード」はおしゃれですが、リンクであることがユーザーに伝わりにくいという問題があります。そこで、ブログカードに「続きを読む」という言葉をたして、視認性をアップさせました。ついでに、影をつけて浮いsetsuyaku-rich.com

アフィリエイトリンクをボタンにする

ボタンを表示するためにcssを追記します。【SANGO】アフィリエイトリンクを改変せずにボタンを使う方法SANGOにはたくさんの種類のボタンが用意されています。これらのボタンは、リンクタグに対して、クラス名を追加することで装飾が施されています。 しかし、一部のアフィリエイトサービスではリンクタグの改変が禁止されている場合が …saruwakakun.com

コメント欄の見た目を変更

コメント欄のイタリック体をノーマルに

引用でもそうなんですが、イタリック体が好きではないのでその都度ノーマルに変えています(引用の字体もノーマルに変更しています)。

/* コメント欄の字体をnormalに */
.logged-in-as {
    margin: 0;
    font-style: normal;
}

コメントの送信ボタンを左寄せにする

スパム対策に入れたInvisible reCAPTCHAのアイコン表示位置と合わせるために、左寄せに変更しました。

/* コメントフォームの送信ボタンを左寄せに */
.form-submit {
    text-align: left;
}

コメント欄やウィジェットタイトルのアイコンを変える

ほかのアイコンも同じ方法で応用すれば簡単に変更できますよ。

この記事を書いた人に欲しいものリストのアイコンを追加する

ウィジェットタイトル前のアイコンを変更or消す方法SANGOでは「一部のウィジェットのタイトル前」にアイコンが表示されるようになっています。このアイコンにはFontAwesomeというWebフォントを使っています。 今回は、このアイコンを「変更したり」「消したり」「（も …saruwakakun.com

アイコンを表示するためにcssを追記します。https://cubkitson.net/blog/sango-wishlist-room2/cubkitson.net

サイドバーのプロフィール画像の調整

現在のプロフィールアイコンを透過.pngで作っていただいたので、以前からやってみたかったゆうこりんさんのカスタマイズをそのまま取り入れました。プロフィール画像サイズを変更、枠線を消す方法【SANGO】yucorin.com

サイドバーのSNSボタンを横長2列にする

プロフィールの下にあるボタンをカスタマイズしています。【SANGOを自分でカスタマイズ】SNSボタンを横長２列にしてみたWordPressテーマSANGOのちょっとしたカスタマイズを紹介します。今回はプロフィール部分のSNSボタンをちょっとオシャレにカスタマイズした方法について解説します。for-men.jp

スマホにフッター固定の丸いシェアボタンを設置する

メニューボタンの横にシェアボタンを設置してみました。
色や透明度を少し変えています。【SANGO】スマホフッター固定の丸いシェアボタンを設置するこのページでは、SANGOのフッター固定メニューをシンプルに丸い「メニュー」と「シェアボタン」だけにするカスタマイズを紹介しています。 最近はSNSなどでシェアするため、ユーザーがシェアボタンを利用することが多くなってい …shikamori-p.com

スマホにフッター固定の目次へ飛ぶボタンを設置する

ずっといる目次へGOボタン目次へ戻ることができるボタンをつくりました。今回はスマホ表示の時に固定で出てくるようにしています。for-men.jp

メニューボタンを消して目次へ飛ぶボタンを設置したかったんですが、なぜかメニューを消すとトップへ戻るボタンが復活してしまうため、
諦めてメニューの上に設置しました。
謎のL字になってるのはそのためです。
少しアレンジしています。

スマホのフッター固定メニューをシンプルに

上2つの固定メニューを追加したためシンプルではなくなってしまいましたが、丸いのは可愛くてよきです。【SANGOを自分でカスタマイズ】モバイル用フッター固定メニューをシンプルにするWordPressテーマSANGOのちょっとしたカスタマイズを紹介します。今回はスマホの固定フッターをシンプルにカスタマイズした方法について解説します。for-men.jp

コンタクトフォームの送信ボタンを左寄せにする

コメント欄と同じ理由でコンタクトフォームの送信ボタンも左寄せにしています。
なぜかtext-align: left;でうまく行かなかったのでゴリゴリに調整しました。

/* コンタクトフォームの送信ボタンを左寄せに */
.wpcf7 input[type="submit"]{
  margin: 0em 0em 0em 0em;
  padding:.5em 8em;
}

Rinkerのデザインをマクリンさんverにする

スマホでみたときの見た目が好みだったので変更しました。【ブログ月100万円の稼ぎ方】凡人でもそれなりの結果を出すための物販記事戦略ブログ開始2年にして月100万円以上の確定収益に到達しました。しかもその収益のほとんどは、Amazon・楽天などの物販アフィリエイトによるものです。当ブログ【マクリン】では、ブログで収益をあげたい人のご参考になればと思い、僕が行った具体的な手法・戦略・稼ぎ方を書き残していきます。makuring.com

アプリーチ新コードの見た目を他の商品リンクの見た目に合わせる

サーバーを移転するまで気づかなかったのですが、アプリーチでリンクを作る際、新コードと旧コードの2つのコードが表示されるようになりました。

PORIPUには旧コードのcssは記載されているのですが、新コードのcssはありません。

新コードの方がコードがスッキリしていて好きなので、新コードの見た目も他の商品リンクの見た目に合わせてみました。

ひつじさんが配布しているデザインパターン3のcssを参考に、ボーダーの部分のみborder: double 4px #dbdbdb;に変更しています。【コピペで完成】アプリーチのデザインCSS配布！全7種類用意したのでお好みをどうぞ｜ひつじアフィリエイトここでは「アプリーチ」のデザインCSSを無料配布しています！ アプリーチってめちゃくちゃ便利なんですが、デフォルトデザイhituji-affiliate.com

くまさんのFANBOXで支援している人限定公開のカスタマイズ

くまさんのFANBOXでは支援者限定でいろんなカスタマイズを公開してくれています。
このブログでは下記のカスタマイズを導入しています。

• SANGO-見出しにジャンプしたときに上部固定見出しとh2を被らないようにする
• SANGO – 手順ボックス
• SANGO – 引用のデザイン
• SANGO – 外部リンク　色違いなど
• SANGO-ページャーを四角に（元は丸）
• SANGO – Instagramボタン
• SANGO – シェア時の背景を変更

さっちん

くまさんを応援したい方は下の応援ページをチェックしてねSupport for-menありがとうのページ。for-men.jp

.htaccessに追記したもの

2つ追記しています。

常時SSL化に必要なコード

スターサーバーのマニュアルに記載されている下記コードを一番上に貼り付けています。

<ifModule mod_expires.c>
RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

ブラウザキャッシュの設定

下記エントリーのコードをそのまま.htaccessの一番最後に追記しています。