【簡単5ステップ】CocoonからSWELLにテーマの移行する方法 |12個の画像で説明

【簡単5ステップ】CocoonからSWELLにテーマの移行する方法 |12個の画像で説明

(スポンサーリンク)

こんにちはOzパパです。

無料テーマCocoonを使っている人で、こんなこと考えている人いませんか?

  • Cocoon使っているけど、デザインに満足していない
  • 有料テーマのSWELLが気になる
  • SWELLテーマの移行が簡単と聞いたけど、本当?
  • テーマの移行方法を詳しく知りたい

私も、以前Cocoonを使っていて、SWELLにする前は、いつも同じことを考えていました。

今回は、私がSWELLに移行した理由と、現在Cocoonユーザーの人で、SWELLへテーマの移行を考えている人に、実際に行った移行の方法を5ステップにまとめました。

12の画像もついているので、分かりやすいと思います。

この記事でわかること
  • Swellのこと
  • CocoonからSWELLへの移行方法
  • 移行の最中に気をつけるポイント
  • Macユーザーがつまずくポイント

(スポンサーリンク)

Contents

CocoonからSWELLに移行しようとした理由

私がCocoonからSWELLに移行した理由は3つあります。

  • 何にせよ、いつか有料テーマを使うつもりでいた。
  • 自分の知識では、Cocoonに限界を感じた。
  • SWELLのデザインと使いやすさに惹かれた。

私はブログを始めてたての頃、続けられるのか自信が持てなかったので、有料ではなくて無料テーマのCocoonを選びました。



Cocoonは無料とは思えないくらい、本当に素晴らしくて、しっかりと作られたテーマです。

しかし、理想的なデザインにカスタマイズするには、専門的な知識が必要です。

こばとら

HTML / CSS がわからない人には、難しい。



初心者や知識不足の人には、記事を書くよりもカスタマイズに時間を取られてしまいますし、何より、不具合が起こったときに、1人では対処できなくなってしまいます。


そうなってしまっては、元も子もありません。

いじり過ぎて、治せなくなりました。



自分好みのデザインやブログのコンセプトを最初から決めれる人は、良いのですが、私の場合は違いました。

こばとら

やっぱりお金を払うとなると、躊躇しちゃうな

ただ有料テーマについては、ブログを始めたての時から色々と調べていて、結果、SWELLを使っているサイトが自分好みのデザインでした。

また、記事を書く時に、便利な機能が付いていて惹かれてしまったのです。

SWELLってどんな感じ

SWELLはHTMLやCSSの知識がない人でも、簡単にサイトのカスタマイズが可能できて、初心者でも、お洒落なサイトが作れるテーマです。



豊富な種類の文字装飾やブロックがあり、プレビューを見ながら、マウス操作のみで出来てしまうのが最大の魅力でしょう。

SWELLエディタの動画

この動画を見てみれば、SWELLがどれだけ簡単に操作出来るか分かると思います。

SWELLのデザインは、シンプルかわいい、そしてかっこいいデザイン全てをカバーしている点も、私が気に入った理由の一つです。

SWELLのブロックについて知りたい人はこちらから

SWELLに移行する方法5ステップ

それでは、CocoonからSWELLへのテーマの移行方法を5つのステップに分けて説明して行きたいと思います。

5ステップの内容は以下です。

途中に注意するポイントもあるので、注意しながら進めてください。

  1. SWELL公式サイトでダウンロード
  2. 支払い方法
  3. テーマのダウンロード
  4. テーマのアップロードと有効化
  5. 移行完了と移行後の設定

念のために、始める前にCocoonのバックアップをとっておきましょう。

STEP
SWELL公式サイトでダウンロード

初めにSWELLの公式サイトに行ってください。
サイトのページの右上の購入するボタンか真ん中のDOWNLOADボタンをクリック。

SWELL公式サイト画面
SWELL公式サイトより

利用規約に同意をチェックし、購入を押します。

STEP
支払いをする

次に支払いのページにて必要事項を記入して支払いを済ませます。

支払い方法は、クレジットカードカードのみで、銀行支払いはできません!

クレジットカード ( VISA / Master / AMEX / JCB )に対応。

海外発行のカードでも支払うことができました。
海外在住の人には助かります。

クレジットカード情報記入ページ
クレジットカード情報記入ページ
SWELL購入確認のページ
SWELL購入確認のページ
STEP
テーマのダウンロード

支払いが済んだら、購入完了ページを下にスクロールして、SWELLをダウンロードするボタンを押します。

このファイルは親テーマになります。

私はここでZIPファイルが自動的に、解凍されてしまって何度もやり直しました。

正直ちょっと焦りました!

Macユーザーはファイルをクリックすると解凍されてしまうので、ブラウザからデスクトップにドラッグしてみてください。

Chromeのダウンロードボックス
Chromeのダウンロードボックス
SWELL親テーマのzipファイル
SWELL親テーマのzipファイル

ダウンロード画面に戻り、子テーマも同じようにダウンロードしてください。

SWELL子テーマのZipファイル
SWELL子テーマのZipファイル

次に乗り換えサポートプラグインのダウンロードをするため、公式サイトの右上のフォーラムに行き会員登録を済ませていきます。

メールに添えられている、購入者限定パスワードを送信して、ユーザー名とメールアドレスを記入して、登録を押します。



次にパスワード設定用のメールが届くので、URLをクリックして、新しいパスワード設定をすれば、会員登録の終了です。

あともう少しです。

送られてくるメールのURLからフォーラムのマイページに進んでください。

SWELLユーザー登録完了画面
SWELLユーザー登録完了画面

マイページの画面に、乗り換えサポートプラグインの一覧があるのでCocoon用を選んでダウンロードします。

SWELL乗り換えサポート選択画面
SWELL乗り換えサポート選択画面
こばとら

他のテーマのサポートもあるんだ!

Cocoon以外からのテーマでも安心だね

Cocoon用乗り換えサポートプラグイン
Cocoon用乗り換えサポートプラグイン

テーマを有効化する前に必ず、乗り換えサポートプラグインをWordpressで有効化してください。そうしないと全く意味がありません。

STEP
テーマのアップロードと有効化

Cocoon用の乗り換えサポートプラグインの有効化が終わったら、Wordpressの外観テーマに進み、テーマの新規追加から、先程のSWELLテーマのZIPファイルをアップロードしてください。


アップロードをするときにはZIPファイルのままする必要があります。

Wordpressのテーマ選択画面
WordPressのテーマ画面

すると画面にSWELLのテーマが現れるので、子テーマを有効化してください。

STEP
移行完成と移行後の設定

これで全部のテーマ移行が完了です。
SWELLなら誰でも簡単に移行ができてしまいます。

お疲れ様でした!

実際にホームページに行き見てみましょう。

すでにかっこいい見た目になっていると思います。

変な箇所が無ければ、移行後に行うことをチェックして、記事を書き始めて下さい。

SWELL移行後に行うこと

移行が完了したら、新しく記事を書くまえにこちらで環境を整えて行きましょう。

  • プラグインを整理する。
  • Googleアナリティクスの紐付け
  • 崩れた記事をチェックして、リライトしていく。
  • サイト全体をカスタマイズして自分好みにしていく。
  • SWELL乗り換えサポートのプラグインを削除する。

移行後のプラグインの見直し

元々 Cocoon で使っていたプラグインの中には、SWELL との相性が悪いプラグインや必要のないプラグインがあるので削除をしておきましょう。

SWELLに必要ないプラグイン

  • Table of Contents Plus : 目次の系
  • Lazy Load : 画像遅延読み込み系
  • Speech bubble : 吹き出し系
  • WordPress Popular Posts : 人気記事作成

これらのプラグインは、SWELL に標準で装備されているので、不要です。
削除して、WordPressを軽くしましょう。

SWELLと相性が良くないプラグイン

  • Autoptimize : 不具合が出る可能性があります。
  • Classic Editor : SWELLは、ブロックエディタに対抗しているので、どうしても必要でないなら、削除しましょう。
  • EWWW Image Optimaizer : 画像がアップロードできなくなる不具合が報告されているみたいです。

詳しくは、公式のサイトで参照してください。https://swell-theme.com/basic-setting/4688/

アナリティクスの設定

続いて、Googleアナリティクスの設定ですが、SWELLでは、同じ開発者の了さん@ddryo_loos)が作った、SEO SIMPLE PACKを進めています。
SWELLとも相性も良いですし。

すでに他のSEO PACKのプラグインですでに、設定している人はそのままで大丈夫です。

やり方はすごく簡単です。

プラグインを有効化したらSEO PACKを開き、Googleアナリティクスのタブをクリック。

SEO SIMPLE PACKアナリティクス設定画面
SEO SIMPLE PACK

トラッキングIDをGoogleアナリティクスからコピペして、設定を保存するだけです。

記事のリライト

乗換サポートプラグインを使っても記事の崩れは防ぎますが、吹き出しなどの装飾品は崩れてしまっている可能性があるので、しっかりとチェックして、必要があればリライトをしていきます。

私の場合は記事数が少なかったので、そこまで大変な作業ではありませんでした。

乗り換えサポートが無かったら、どうなっててんだろうか。

SWELLを使ってサイトのカスタマイズ

ここから実際にSWELLを使ってカスタマイズをしていきます。

SWELLの特徴は、実際の作業をプレビューしながら行えるので、わかりやすくて初心者でも、感覚的に作っていけます。

Cocoonに慣れていた私も、特に問題なく進めることができました。

こちらの設定は、個人の好みで行って下さい。

SWELL乗り換えサポートのプラグイン削除

SWELLに移行後、すでに乗り換えサポートのプラグインは必要ないので削除しても問題ありません。
必要のないプラグインはWordPressを重くするので、消してしまいましょう。

実際SWELLに移行して良かったか?

実際SWELLに移行して良かったか?

はい。自分的には移行して良かったと思います。実際に上で述べたストレスから解放されて、理想的な環境で記事を書き始めることができました。

マイナスなポイントは?

強いて言えば、17600円は有料テーマの中では高いと思いますが、使い切りのテーマなので、一度買ってしまえばずっと使い続けられます。
1日計算で50円(1年計算で)我慢すれば、お釣りつきで使えます。

これからSWELLで何をしたいか?

すでに、SWELLを使っている先輩ユーザのように、お洒落なサイト型のトップページを作ってみたいです。

まとめ

いかがでしたでしょうか?

今回は、CocoonからSWELLにテーマの移行をする方法を紹介しました。

SWELLは移行したその日からすぐに、オシャレな装飾の記事を書くことが出来ます。

実際にこの記事内にもブロックをたくさん使ってみたり、Q&Aやステップスタンプなどの機能を使ってみました。

ブログを始めて間もない私でも、クリック一つで簡単に出来ました。

楽しくブログの更新をしていくのであれば、やっぱり、自分が好きになれるデザインじゃないと。

SWELLなら、充実したブログライフを送れること間違いなしです。

最後までご覧いただき有り難うございました。

この記事が気に入ったら
フォローしてね!

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

コメント

コメントする

Contents