カラーユニバーサルデザインに配慮しています

【WordPress】テーマを「SWALLOW」から「SANGO」に乗り換えました『導入編』

読了時間: 約4

乗り換えた理由

私はOPENCAGEの「SWALLOW」を約半年間使用していましたが、今回「SANGO」に乗り換えることにしました。「SWALLOW」は軽快で使いやすく大きな不満もなかったのですが、「SANGO」の魅力に惹かれました。

マテリアルデザイン

いろんなサイトを見て「SANGO」を使っているブログをかっこ良いと感じました。Googleが推奨する「マテリアルデザイン」は見ていて本当に素晴らしいです。

「サルワカ」さんのテーマに対する思いを以前から拝見していて、とても素晴らしいテーマだと感じていました。

カスタマイズが豊富

カスタマイズ沼の私にとってこれはやりがいのあるテーマ。「カスタマイズガイド」を読むだけでも結構な情報量。これは他のテーマを圧倒していますね。逆に理解するのが大変ですが、かみ砕いて説明しているので助かります。

サポート

サイトは以前から見ていましたが、精力的で親切な感じがしていました。説明の下の方にユーザーの質問が書かれていますが、どれに対しても親切丁寧に返答しています。「サルワカ」さんの人柄がうかがえます。

失敗談

人気記事をトップ欄に置けない

参考サイト
12436288584_94d6bc46d2_b.jpg
「サルワカのトップページのように上部に人気記事一覧を設置したい」という要望を多く頂きましたので、カスタマイズの方法を紹介したいと思います…

この記事を参考に試してみたけれど、ホームページ画面に人気記事どころか新着記事も現れないようになってしまいました。かなり慎重にやったのですが、どこかでやり方をミスっているのでしょうね。

MEMO
子テーマを使ってのカスタマイズ方法で試してみました

結局子テーマを使ってのカスタマイズはあきらめて、ウィジェットを使って設置しました。私は「トップページ記事一覧上」ではなく、サイドバーに人気記事を設置しました。こうすることでスマホでは記事の終わりに「人気記事」が現れるからです。

コードの置換

私は「SWALLOW」を使っているので「ストーク」と同じコードの筈。こちらの記事を参考にしました。

参考サイト
12436288584_94d6bc46d2_b.jpg
ストークからSANGOへの乗り換えを検討している方のお役に立てればと思い、記事にしてみました。 私が時間をかけた分、どなたかの時短になりますように!…

「Search Regex」でコードの置換に失敗、全て手作業で行うはめに(泣)原因不明ですが、おそらくキャッシュの削除がうまく出来なかったからだと分析しています。

うまく説明出来ませんが、編集画面上ではコードの変換が出来ていないのにプレビューではSANGOのデザインに変わっていたのです。で、編集画面で更新ボタンを押すとデザインが崩れてしまう。おそらく置換自体は出来ていたはず。

私の不手際で恐ろしく手直しに時間がかかってしまったけど、自業自得ですかね?

手直し時ついでに入れていたプラグイン「Pz-LinkCard」(外部リンクを手軽に作成してくれる)をテーマのものと入れ替え。「タイムライン」「アコーディオン」「評価ボックス」「ソースコードボックス」など「SANGO」独自の機能も記事のリライトで試せたのでまぁ良かったのかなと笑

後述しますが、新たに導入したプラグイン「All ShortCode of SANGO」がかなり役立ちました。結局記事のリライトも含めて丸5日かかりましたが苦笑

無効・削除した プラグイン

「TinyMCE Advanced」

参考サイト
12436288584_94d6bc46d2_b.jpg
WordPressのビジュアルエディタって便利ですよね。テーマによってはスタイルというドロップダウンメニュー(プルダウンメニュー)がついており、そこからオリジナルの装飾設定を行うことができます…

わたしの環境では有効化していると、「メニュー」➡️「スタイル」で「オリジナルメニュー」が何故か出なくなってしまいます。これでは流石に困るので、今の所「無効」にしています。無効にすると「オリジナルメニュー」が現れます。

MEMO
結局特に困ることもないので、削除しました

「Pz-LinkCard」

長らく使用していましたが「SANGO」に「他サイトへのリンク」が付属しているので、手作業で打ち替えました。方針として、少しでもプラグインは減らしておきたいので。

「Yoast SEO」

私は「All in One SEO Pack」は使っていませんが、「Yoast SEO」も似たような機能のため削除することにしました。

SANGOではあらかじめ「メタデスクリプション(入力された場合)」や「OGPタグ」が出力されるようになっています。All in One SEO Packを使うとメタタグが重複してしまう可能性があるのでご注意ください。

「WordPress Popular Posts」

先ほど書いていますが、「人気記事」をサイドバーに設置したので不必要になり削除しました。

新たに導入した プラグイン

「Google XML Sitemaps」

「SANGO」のサイト記事を元に導入してみました。

参考サイト
12436288584_94d6bc46d2_b.jpg
このページでは、確認済みの「相性の悪いプラグイン」と「問題なく使用できるであろうおすすめのプラグイン」を一覧でまとめていきます…

「Yoast SEO」を削除したので、新たにサイトマップをGoogleに伝える必要があります。

「All ShortCode of SANGO」

こちらの記事を参考にしました

参考サイト
12436288584_94d6bc46d2_b.jpg
当プラグインはWordpressのテーマ「SANGO」を有効化している場合のみ機能致します…

「Pz-LinkCard」から「SANGO」付属の「他サイトへのリンク」へのやり変えや「ボタン」の装飾はボタンを一覧出来るので助かります。特に重宝するのは「ソースコードボックス」

ソースコードのエスケープ処理はプラグイン側で自動的に行うため、別途にエスケープ処理を行う必要はありません。

そのまま、ソースコードを貼り付けて利用してください!

これは素晴らしい機能です。これを使うだけでも値打ちがありますね。今まではこのサイトでエスケープ処理をしていました。

参考サイト

エスケープ処理を自動的に行ってくれるのは助かります。以前は「エスケープ処理」のことが分からず、どうしてコードが変形するのか不思議に思っていましたから笑

ただ少し設定画面でおかしな表示が出る時もありますが、今後のバージョンアップに期待します。

「エスケープ処理」とは?

マークアップ言語やプログラミング言語で文字列を扱う際に、その言語の文法や処理系にとって特別な意味や機能を持つ文字や記号(およびその並び)を、一定の規則に従って別の文字列に置き換えること
引用元:IT用語辞典より

まとめ

「SANGO」を導入してはや1週間が経とうとしています。まだまだ「SANGO」の魅力を十分に引き出せてはいませんが、これから少しずつ勉強していこうと考えています。

以上、お読みいただきありがとうございました。

あわせて読みたい
SANGOカスタマイズ編アイキャッチ画像【WordPress】テーマ「SANGO」をカスタマイズしてみました(11箇所)アイキャッチ画像【WordPress】でテーマに関係なく最低限必要なプラグインは7個です