SWELLに興味がある…
テーマを切り替えって他にどんな作業が必要なの?
レイアウトはどのくらい崩れる?
そんな疑問に答えます。
先日Snow MonkeyからSWELLにテーマを切り替え作業を経験しました。テーマ切り替え時の作業メモを共有します。
Snow MonkeyからSWELL移行手順
Snow MonkeyからSWELLへの移行方法をステップごとに解説します。
ちなみにSWELLは国産のSWELL(スウェル)です。
海外のエンジニアが開発した似た名前のテーマがあるので注意してください。
切り替え前のサイト
- Snow Monkey(バージョン:19.1.6)
- Snow Monkey Editor(バージョン:9.1.2)
- Snow Monkey Blocks(バージョン:18.1.7)
【移行手順.1】SWELLをダウンロード
SWELLを購入しテーマをダウンロードするステップです。SWELLはユーザー認証システムのあるテーマです。格安で販売している転売ヤーなどSWELL公式サイト以外で購入すると、痛い目をみます。
公式サイト以外で購入するリスクとデメリット
- テーマのアップデートができない
- サポートフォーラムを利用できない
- 着せ替えデザインデータが使えない
特にテーマのアップデートができないのは本当にヤバいです。SWELLはWordPressのバージョンに対応すべく、テーマのバージョンアップをしてくれます。もしアップデートができなくなるとWordPressのバージョンアップで「画面が真っ白」「まったく使えなくなる」というリスクが待ち構えています。
公式サイトでしっかり購入しましょう。
【移行手順.2】SEO SIMPLE PACKのインストール
SEO SIMPLE PACKはSWELL開発者さんが提供している無料プラグインです。有効化することで、Meta DescriptionなどSEO関連の設定ができるようになります。
SEO SIMPLE PACKはWordPress公式プラグインディレクトリに登録されています。ダッシュボードから検索しインストールしましょう。
「プラグイン」をクリック↓
「新規追加」をクリック↓
「SEO SIMPLE PACK」でキーワード検索↓
SEO SIMPLE PACK表示されたら、「今すぐインストール」をクリック↓
インストールが完了したらプラグインを有効化してください。
【移行手順.3】テーマ切り替え
テーマをSWELLに切り替えるステップです。ダッシュボードのテーマからSWELLを選択し、有効化しましょう。
【移行手順.4】アナリティクスコードの設置
Googleアナリティクスの設定です。テーマ切り替え後はうっかり忘れがちなので、最初にやっておきましょう。
<head>~</head>
内に出力するコードは、カスタマイズザーの「高度な設定」から追加できます↓
【移行手順.5】Metaディスクリプションの移行
Snow MonkeyでMetaディスクリプションを設定した場合の移行作業です。SEO SIMPLE PACKプラグインをインストールしている場合は、フィルターフックで出力を書き換えることができます。
次のコードをSWELL子テーマのfunction.phpに貼り付けます↓
add_filter('ssp_output_description', function($ssp_description) {
$sm_meta_atnak = get_post_meta(get_the_ID(), 'wp-seo-meta-description', true);
$ssp_meta = get_post_meta(get_the_ID(), 'ssp_meta_description', true);
if ( empty( $ssp_meta ) && $sm_meta_atnak ) {
return $sm_meta_atnak;
}
return $ssp_description;
});
ブロックエディター下部に表示される編集画面には反映されませんが、出力HTMLのMetaディスクリプションは置き換わる仕組みです。
【移行手順.6】ページのリライト作業
ページのリライトでは、2つの要素に注意が必要です。
「Snow Monkey Blocksプラグインのカスタムブロック」と「その他の装飾」です。
それぞれを解説します。
Snow Monkey Blocksのカスタムブロックの置き換え作業
試した限りSnow Monkey Blocksプラグインのカスタムブロックは、SWELLに移行しても普通に使えます。
SWELLにテーマを切り替えた後も、Snow Monkey Blocksプラグインを使い続けるなら、さらっとページを確認し異常がないかチェックしましょう。
ボクが使っていたブロックに関しては切り替え後も問題なく表示されていました。
デザインに統一性を持たせたい場合やプラグインを一つでも減らしたい場合は、各ページで利用しているSnow Monkey BlocksのカスタムブロックをひとつずつSWELLのカスタムブロックに移行します。ブロックの移行が完了したタイミングで、Snow Monkey Blocksプラグインを停止しましょう。
その他の装飾
エディター上でお猿さんアイコンから設定した装飾はSWELLに移行すると引き継がれません。エラーが出るわけでもなく装飾が表示されなくなります。
出力されているHTMLコードを見る限り、スタイルは適用されているのですが装飾用のCSSがないのが原因です。
SWELL切り替え後にリライトするか、Snow Monkeyの装飾用CSSコードをSWELLに移設しましょう。
【移行手順.7】レイアウト系の設定
SWELLの設定はカスタマイザーから行います。基本的な使い方はSnow Monkeyと同じです。ヘッダー、サイドバー、フッターなど好みのデザインに仕上げましょう。
テーマ切り替えに関するFAQ
SWELL公式サイトで紹介している「乗り換えサポートプラグイン」って何?
Snow Monkeyでも使えるの?
乗り換えサポートプラグインは他テーマからSWELLへのテーマ切り替え時に利用できるプラグインです。プラグインを有効化すると、切り替え前の装飾が表示されます。本記事執筆時にはSnow Mokney用の乗り換えサポートプラグインは配布されていません。
もしかしたら追加されるかも?
最新情報は公式ページをご確認ください。
SWELLを安く購入する方法は?
SWELLを安く購入する方法は次の記事で解説しています。
SWELLを使ってコーポレートサイトを作りたい。
参考になるデザインを紹介しているサイトは?
次の記事でSWELLを使ったコーポレートデザインを紹介しています。
SWELLの子テーマはどこからダウンロードできますか?
SWELL公式サイトで配布しています。子テーマをダウンロードするには会員サイトにログインする必要があります。
まとめ
WordPressテーマをSnow MonkeyからSWELLに移行する手順を紹介しました。
Snow Monkeyはカスタムブロックをプラグイン化しているので、そのままプラグインを有効化している限り大きなダメージなくテーマを切り替えることができます。
ぜひSWELLへの移行にチャレンジしてみてください。