THE THORからSWELLへ乗り換えする全手順と経過

Wordpressテーマ "SWELL" カスタマイズ

この度、このブログをWordpressテーマ“THE THOR” から “SWELL” へ変更いたしました。

“THE THOR” に関するいろいろと思うことにつきましてはまた別記事(書きました→)で書かせていただきますが、割と長年、結構 頑張って我慢して使った(ひどい)と思っております。

今、 “SWELL” でブロックエディターでノーストレスで記事が書けて本当に幸せです。(ふっ)

では、 “SWELL” インストールから、テーマ変更前の事前準備、テーマ変更後の後始末と注意点まで順に書かせていただきます。

目次

WordPressテーマを“THE THOR” から “SWELL” へ変更 する方法

“SWELL” は有料テーマです。

この記事では “SWELL” に関する素晴らしさは特にご説明いたしません。……と思いましたが、なぜ “THE THOR” から “SWELL” へ変更し、こんなにお薦めしているのか納得できなければ購入する気にもならないでしょうから、ほんとーーに簡単にQ&Aの形で書かせていただきます。(後ほど別記事でシッカリ書かせていただきます)

変更の方法のみ知りたいという方は先へ進んでください。⇒

“SWELL” の「素晴らしさ」はデザインが綺麗なだけですか?

よく検索で “SWELL” をお薦めするブログなどに突き当たると「かっこいいデザイン」ばかり挙げられていますが、本当の魅力はそういうことではないです。

テーマを“SWELL” に変更するのはデザインがカッコいいからですか?私は公式のような大きなビジュアルトップ動画のブログは作らないので必要ないのですが。

…というご意見を当方が仕事を請け負う際にお客様からよく頂くのですが、普通の、別にカッコ良くない、ヘッダービジュアルが無い、記事一覧!のトップページも簡単に作れます!ので安心してください。

だったら “SWELL” ではなく他のテーマでもいいのでは。

他のテーマよりも遥かに簡単に思い通りの記事を作ることができます。今、当方が作っているこのQ&Aも上の「 変更の方法のみ知りたいという方は先へ進んでください。 」のボックスも、CSSを書くことなく、何のプラグインも入れることなく、迷うこともなくパズルゲームのように簡単に感覚的に設置できます。

“SWELL” は、無料ブログしか使ったことがない人間でも簡単に使いこなせますか?

むしろWordpressの昔のエディター(クラッシックエディター)など使ったことがないという方にこそお薦めいたします。簡単に使いこなせます。

“SWELL” は初心者にも使いこなせますか?

むしろ初心者の方にこそお薦めしたいと思います。

テーマを“SWELL” にしたら、業者にカスタマイズを依頼しなくてもいいと思いますか。

私の仕事は無くなるので困りますが、 “SWELL” ならば「初心者の方でも1人でWordpressを運用できる」と自信を持ってお薦めいたします。

“SWELL” を使うとTHE THOR よりもSEOに有利になりますか?

WordPressは何でも、どのテーマでも、テーマの力だけでSEOに有利になったりはしないです。(SEOについてはご依頼ください!)しかし、後述しますが “SWELL” に変更したらページが軽くなりました。そういう意味では好条件になると思います。

つまり “SWELL” を薦める一番の理由は……

本当に、心から

記事を書くことだけに集中できるから!!

です。

ざざっと書いた程度ですが、とにかく。THE THOR の使いづらいクラシックエディターからの変更は心よりお薦めいたします。

まずは “SWELL” を購入しましょう

“SWELL” は有料テーマです。まずは公式からダウンロードしましょう。

この記事に辿り着いた方は、もう “SWELL” を購入済みで、これから作業に入る方が大半だと思っております。

しかし、これから購入される方もいらっしゃると思うので、まずはテーマのダウンロードから説明させていただきます。

テーマのダウンロード方法は要らないという方は先へ進んでください⇒

“SWELL” と子テーマをダウンロード

先ほども申し上げましたが、この記事に検索から辿り着いた方はもう “SWELL” をダウンロード済みだと思うのです。

なので、ここはザッと!だけ、ご説明いたします。


1. SWELL公式にアクセス← して、右上 購入する ボタンから購入します。

2. 購入すると、ダウンロードリンクが入ったメールが送られてきます。(件名は「SWELLをご購入いただき、ありがとうございます」)

【 SWELLダウンロードリンク 】 を踏めばダウンロードされます。

3. そのままだと親テーマしかダウンロードされないので公式の「マイページ」へ行きましょう。

4. 会員登録をします。(これをしないとサポートも受けられないので必ずしましょう。)

SWELLに登録したメールアドレスと、先ほどのダウンロードメールに書かれていたパスワードを入力して登録します。

5. 新たにパスワード設定用のメールが届くので、設定してログインしましょう。

6. 「SWELL製品ダウンロード」の項目下に「子テーマ」があるのでダウンロードしてください。そして、このページで「乗り換えサポートプラグイン」もダウンロードします。

では、テーマの引っ越しを始めます。

「マイページ」に他テーマからの「乗り換えサポートプラグイン」があります。ので「THE THOR用」をダウンロードしてください。

THE THORからSWELLへ乗り換えする全手順と経過1

このプラグインで、どれほどのものが移行できるのかは後ほどお見せいたします。

“SWELL” をインストールして有効化する前にやっておくべきこと

ここで自分の体験から、インストール前にやっておいた方がいいこと(テーマがまだTHE THOR の内にやっておいた方が良いこと)を書いていきます。

SEOプラグインをインストールしてディスクリプションを移す

“SWELL”のテーマ自体にはSEOプラグインに相当する機能は付いておらず、プラグインの導入が必要になります。

“ALL IN ONE SEO”や”Yoast SEO”など、元々何か使っていたならばそのままで良いです。

公式は“SIMPLE SEO PACK”をお薦めしていますが、元々使っていたものがあるならば、わざわざ変える必要はありません。何も使っていなかった方は “SIMPLE SEO PACK” で、よろしいと思います。

SEOプラグインをインストールしたら、“THE THOR”の機能で記入していたdescriptionをSEOプラグインのディスクリプション記入欄にコピペする。あるいは見直して書き直しましょう

なぜなら、

THE THOR の機能に書き入れたディスクリプションは全て消えます。

記事数が少ない人は頑張って移しましょう。

100記事以上もある方はどうしたいかお任せします。

1000単位の記事を保有しているサイトは全て移すのはあきらめて、アクセス上位の記事と気に入っている記事だけでも移しておきましょう。

アドセンス・アナリティクスなどGoogleタグ関係を控える

ディスクリプションと同様に、アドセンスコードやGoogleアナリティクス、サーチコンソールなどのGoogleタグ関係もテーマを変更すれば消えますので、コピーして控えておいてください。

これらは “SWELL” の方に設置する場所がありますので、テーマ替えしてから入力し直します。

THE THOR の機能以外で独自で入れた装飾CSSを控える

見出しやBOX など、 “THE THOR” の機能以外の独自装飾をCSSで付けていた方は、そのCSSをそのまま移せばまた反映されるので(ただし要素も独自に設定していれば、です)控えておいてください。

また、フッターCTA“THE THOR” 独自のウィジェットやパーツも消えますので、同じようなテンプレートにしたい方はどこにどういう物を入れていたか覚えておきましょう。(そのパーツに入れていたテキストや画像URLも控えてください)

“THE THOR” から “SWELL” テーマ変更・本番

本番に移ります。作業自体は簡単です。

プラグインをインストールして有効化する

先ほどご自分のパソコンにダウンロードしたTHE THORからの引っ越しプラグイン をWordpressにインストールします。

ダッシュボードの「プラグイン」を開いて、左上の「新規追加」ボタンを押します。

THE THORからSWELLへ乗り換えする全手順と経過2・プラグイン新規追加

プラグイン一覧の上部にインストール画面が開くので、「ファイルを選択」を押して、パソコンの中から“thor-to-swell”を選び、アップロードします。

THE THORからSWELLへ乗り換えする全手順と経過2・プラグイン

“thor-to-swell” は特に設定はなく、インストールしたら「有効化」それだけです。

“SWELL” をインストールして有効化

まずは親テーマを。続けて “SWELL” の子テーマをインストールして有効化。

THE THORからSWELLへ乗り換えする全手順と経過2

最終的には子テーマが有効になっていればそれでOKです。

“THE THOR” から “SWELL” の外観比較

なるべく文が短くて “THE THOR” の見出しなど装飾が分かるページを抜粋しました。左が “THE THOR” 、右が “SWELL” (変更直後) です。

乗り換えサポートプラグインがどの程度移してくれているのかは分かりませんが、

  • 内部リンクカードは移っている
  • アイコンboxはアイコンが表示されていないがbox装飾自体は存在する
  • チェックボックスはそのまま移っている
  • 見出し装飾はそのまま移らない(SWELL初期設定の装飾)
  • ヘッダーとフッターの画像やバックカラーは移らない
  • 当然だけれどフッター上CTAも消えている

しかし、想像していたよりも遥かにきちんと装飾されていました。拘らなければ、このまま表示し続けていてもOKなレベル。

THE THORからSWELLへ乗り換え前 THE THOR
THE THORからSWELLへ乗り換え直後

“THE THOR” から “SWELL” へテーマ変更後の作業

どなたでもやらなければならない事と、当方が体験した結果やった事を書かせていただきます。

メールフォームを作る(Contactページ)

THE THOR” の売りのひとつだといわれているメールフォームですね(スパムだらけの)、テーマを変えたら当然なくなりますので、プラグインで作りましょう。

“Contact Form 7” でよろしいかと思います。ダッシュボードから普通にインストールできます。

アドセンス、アナリティクスなどGoogleタグ関係の挿入

当方は元々、タグは全て “THE THOR” の時からカスタマイザーの「高度な設定」「headタグ」に記入していたので、同じことをしている方はカスタマイザーの 「高度な設定」 からhead に設置するタグは全て入れられます。

THE THORからSWELLへ乗り換えする全手順と事後処理1

その他の方はインストールした SEO SIMPLE PACK プラグインに設置ツールが付いています。

Googleアドセンスコードは、カスタマイザーの 「高度な設定」 head欄に。

あるいは、ダッシュボードの「SWELL設定」下「ads.txt編集」 へ書き込むことが出来ます。

THE THORからSWELLへ乗り換えする全手順と事後処理2

グローバルメニューやウィジェットを確認

当サイトの場合はテーマを “SWELL” へ変更後、グローバルメニューの各メニュー下にとんでもなく長い文字列が入って横スクロールしている状態でした。

THE THORからSWELLへ乗り換え後・修正前メニュー

何なの……これは……。

ということで、よく確認したら、この長い文字列はメニューに設定している各カテゴリーのディスクリプションだったのです。

“SWELL” にはメニュー下にメニューの説明の文言を入れることが出来るのですが、引っ越し班にとっては、その機能が仇をなした感じです。

これは「外観」→「メニュー」の上部にある「表示オプション」を開き「説明」にチェックを入れることで解決します。

THE THORからSWELLへ乗り換え後・メニュー修正

[THE]で作ったウィジェットは消える

“THE THOR” の時に[THE]新着記事 [THE]おすすめ記事 など” [THE]”で設定したサイドバーウィジェットは消えます。

“SWELL” の方には“[SWELL]”というウィジェットが用意されているので、 ” [THE]” と同じ感覚でただ付け直せばいいだけです。

“THE THOR” の フッターCTA のようなものを作る

boxなどで消えてしまったものに関する置き換えカスタマイズや、フッターCTAについては、また別記事で書かせていただきます。(書きました)

“THE THOR” から “SWELL” へテーマ変更した後の注意

ここ、ものすごく大事なのでよろしくお願いします。

“THE THOR” の時にクラシックエディターで書いた記事(またはブロックエディターでクラシックブロックを使って書いたコードがある記事)は、ブロックエディターでリライトしない方が良いです!!

当方のサイトの場合はそれをやったせいで壊れてしまった記事もあるので(クラシックブロックを使って書いたボックス装飾の部分から下が消えてしまいました)、ご報告させていただきます。

壊れた記事はリビジョンを使って復活させましたが、旧記事のリライトはクラッシックエディターで行いましょう。

他にもおかしくなった部分が無いか確認しようと思います。

何か見つかりましたら、またご報告させていただきます。

“SWELL” 変更後、アドセンスの反映には時間が掛かる

“THE THOR”から “SWELL” へ変更後、アドセンスのコードはすぐに移しましたが、反映には時間が掛かりました。

(他のテーマの変更の時はこんなに掛かったか覚えていないので比較はできませんが……)

まずスマホの方は1時間以上経ってから反映に気づき、パソコンに関しては翌日でした。(翌日に気づいた、というだけで、そこまで時間はかかっていないかもしれません)

原因は不明です。

ご報告まで。

PageSpeed Insights で比較してみた

“THE THOR”から “SWELL” へ変更した後、トップページがほぼ同じ形になっていたのに驚きました。

(テーマによっては変更後はトップページは記事一覧に変わっていたりするので……)

左が旧 “THE THOR” 右が変更直後の “SWELL” です。 ピックアップ3記事は無くなっていますが、スライダーはちゃんと付いています。引っ越しプラグインの力でしょうか。

THE THORからSWELLへ前TOP
THE THORからSWELLへ乗り換え直後TOP

せっかくなので PageSpeed Insights で比較してみようかと思ったのですが……(THOR のCLS数値の悪さに悩んでいたので(笑))

トップページを比較したかったのですが、問題のピックアップ3記事がありますし、消えたものも多くて比較しづらいので、先ほどの記事の1ページで比較しています。

左が旧 “THE THOR” 右がフッターCTAに替わるものも設置したカスタマイズ後の “SWELL” です。 無くなったものもあるかも知れないので一概に軽くなったとは言い切れませんが、CLS値が0.082から0.001へ落ちました。

とても有難いです!

THE THORからSWELLへ乗り換え前 THE THOR CLSひどい
THE THORからSWELLへ乗り換え後CLS

とにかく記事が書きやすい

この記事がこのブログでは“SWELL”のブロックエディターで書く第一弾の記事になったわけですが、ここまでの長文、装飾し、画像を入れ、ボックスを入れ……

全く苦も無くスラスラ書けました。

迷っている方には、とにかくお薦めしておきます。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

profile

主にWordpress中心のサイト・ブログ制作&コーダー、カスタマイザー。

2000年からHP制作を始めました。

ハウツーサイトやキュレーションサイトのライター、ブログ作成・運営のお手伝いなどをしております。

お仕事で関わった無料ブログ&Wordpressカスタマイズ案件実績500件以上。

携わったワードプレステーマ30以上。

アナリティクスを観察するのは生活の一部。

Google Analytics個人認定資格取得(GA4)。 SEOマーケティングアドバイザー資格取得。

SEOに特化したページ作りをめざしています。

 

カスタマイズのご依頼は「一木堂」へ

follow us in feedly 映画@見取り八段 | 映画感想ブログ coconara ss

サポートよろしくお願いします

いつもありがとうございます。

この記事を気に入って下さった方、「寄付してあげてもいいよ」という方がいらっしゃったらサポートしていただけると嬉しいです。

Amazonギフト券- Eメールタイプ - Amazonベーシック
金額は空白欄に適当に(15円から)書きこんで下さい。(あらかじめ入っている金額はAmazonの設定なので気になさらないでください)。

メールのあて先は 「ageru15@gmail.com」です。
※上記のアドレスは投げ銭受け取り専用です。他のメールは受け取れない設定にしてあるのでご注意ください。

a
よろしくお願いいたします。

なお、この投げ銭システムに関する記事はこちら→『ブログに「投げ銭」システムをつける方法を考えてみたまとめ』

コメント

コメントする

目次