【テーマ変更】251記事で「Cocoon」から「SWELL」に変えたら死ぬほど大変だった話

さぼにゃん

ブログのテーマを変更するか悩んでるにゃ

フィちゃん

やるなら早めのほうがいいにゃ。
僕がテーマ変更して大変だった話を聞かせてあげるにゃ...

今回は251記事目にして「無料テーマCocoon」から「有料テーマSWELL」に変更をして死ぬほど大変だったポイントをまとめました。

「WordPressテーマは初期投資」が理想ですが
私のように「いつか変更したいなぁ(鼻ほじ)」と思いつつ記事を溜め込んだ状態でやってしまうと痛い目を見ることになってしまいます。

そんな犠牲者をこれ以上出さないための記事です(笑)

目次

なぜ変更しようと思ったの?

ブログ開設時から当サイトでは無料テーマ界のサラブレッド「Cocoon」を愛用しておりました。

もちろん、これはこれでマジで無料!?と仰天するほどに素晴らしいテーマではあったのですが
無料が故に他のブログとデザインが被りまくるのがずっと気になっていました...

フィちゃん

もっとニャン要素たっぷりの僕だけのサイトを作りたいにゃ

と一丁前のことを思いつつも、思うだけ。

フィちゃん

ブログ収入が貯まったら変更するにゃ

軽い気持ちでそう決めてから早1年5ヶ月(記事数251)
やっと有料テーマを購入できるくらいのブログ収入を稼ぐことができたので変更することを決めたわけです。

さぼにゃん

ブログ稼げてなさすぎじゃにゃい?

というツッコミは涙がちょちょぎれますのでやめてね。笑



新しいテーマ選びで重視したのは4つのポイント。

  • デザインの好み
  • カスタマイズしやすい
  • 他テーマから乗り換えしやすい
  • SEOに強い

となると選択肢は一択...
「新しいテーマは君に決めた!」

SWELLの何がいいかって、他テーマからの乗り換えサポートがあるところです!(興奮)
私のような一年温めてからの変更する人にとって激アツな機能でしょう。


現段階(※2020/11)で以下5種類のテーマからの乗り換えサポートがあるようです。

  1. JIN
  2. SANGO
  3. STORK
  4. Cocoon
  5. THE THOR
フィちゃん

デザインもシンプルで気に入ってるにゃ!

一体何が大変だったの?

さぼにゃん

ご丁寧に乗り換えサポートまでついて何が大変だったにゃ?

サポート機能がついているとは言え、反映できないものがいくつかあったので紹介していきます。
修正の優先度の高いものは以下3つです!

  • ボタン
  • 楽天商品リンク
  • キャプションボックス

ボタンが消失したので修正

まず最もイタタタ〜となったのがこの「ボタン消失」です。
当サイトではボタンにASPリンクを貼っていたのですが画像のようにすっかり消えておりました(T T)

ビジュアルエディタで確認してみるとこのようなエラーが表示されていました。

「HTMLとして保持」を押して修復をはかると・・・?

ただのリンク( ´ ▽ `)笑
なのでボタンは一つ一つ修正していく必要があります。

前のリンク(HTMLとして保持)は残した状態で「SWELLボタン」を挿入します。

前のリンクをそのままボタン設定(右メニュー)の「広告タグ設定」にコピー。

このままだとボタンの右側に変なバツボタンが表示されているので<div>のところを消去してあげましょう。
ついでに文言も「今すぐU-NEXTでレンタルする」→「今すぐU-NEXTの無料体験に登録する」に変更。

<div class="wp-block-cocoon-blocks-button-wrap-1 btn-wrap btn-wrap-block button-block btn-wrap-l btn-wrap-circle btn-wrap-shine has-background has-blue-background-color">
-- ここから上を消す --

<a href="//ck.jp.ap.valuecommerce.com/servlet/referral?sid=XXXXX&pid=XXXXX" rel="nofollow"><img src="//ad.jp.ap.valuecommerce.com/servlet/gifbanner?sid=XXXXX&pid=XXXXX" height="1" width="1" border="0">今すぐ「U-NEXT」の無料体験に登録する</a>

-- ここから下を消す --
</div>

これで修正完了です♪
実際に修正したボタンはこんな感じ↓

\\\ リンク先ダミーです ///

ボタンの種類も豊富で使い勝手が良いのもお気に入り( ´ ▽ ` )

楽天商品リンクが消失したので修正

当サイトではCocoonの「楽天商品リンクショートコード」機能を使用していたのですが、ご覧のようにコードがそのまま表示になっていました(T T)

こちらも一つ一つ修正が必要です。

SWELLの広告タグを利用する方法もあるのですが、当サイトでは「kattene」というプラグインを導入して修正しました。

フィちゃん

katteneはボタン数を自由に増やせるのがオススメにゃ!

SWELLの広告タグを利用するとこのような表示になります!

\\ katteneの導入方法はこちら //

キャプションボックスが消失したので修正

キャプションボックスも消えて中に入れていたリストがそのまま表示になっていました(T T)

前のリンク(HTMLとして保持)は残した状態で「キャプション付きブロック」を挿入します。

あとは少し体裁を整えたら修正完了です♪
実際のキャプションボックスはこんな感じ↓

鮨國(築地4丁目)
  • 食べたもの:ウニ・イクラ丼
  • お値段:3,800円
  • 訪問時間:2020/9/18(金)18:00 >待ち時間なし
  • 食べログ評価:3.68
  • 客層:男女半々

キャプションボックスも種類が豊富!(もちろん色変更もできます)

キャプション
キャプション
キャプション
キャプション
キャプション
キャプション

ここからは乗り換えサポートで問題なく表示されますが、
SWELL専用のものに総替えしたい場合に、優先度は低いですが修正が必要なものを紹介していきます。

当サイトでもゆくゆくはサポートプラグインを削除したいと思っているのでゆっくり修正中です!

ふきだしをSWELL用の「ふきだし」に修正

ふきだしはこのように問題なく表示されています!

ただし、ビジュアルエディタを見てみるとこのようにエラー表示されていますので優先度は低いですがゆっくり修正していきます。

ふきだしは左メニュー「ふきだし」で細かく設定してから使用すると便利です!

実際のふきだしはこんな感じ↓
ふきだし部分のツヤ?が何だか違う気がしますね(気のせい?)

フィちゃん

無料で見るには見放題お試し期間に契約して
期間内に解約する方法があるにゃ♪

タブボックスを「キャプション付きブロック」に修正

タブボックスもこのように問題なく表示されます!

こちらはCocoonのデザインをそのまま引き継いでいるので
デザインの統一性が気になる場合は先ほど紹介した「キャプション付きブロック」に変更するといいと思います♪

ブログカードを「関連記事」に修正

ブログカードも問題なく表示されています!

こちらを修正する場合は「関連記事」を挿入します。
内部リンクの場合、タイトルで記事を検索してくれるので便利です♪

キャプション部分も自由に変更可能です( ^ω^ )
↓実際はこんな感じ

マイクロバルーンを「マイクロコピー」に修正

マイクロバルーンも問題なく表示されていますがちょっと位置がおかしいですね。
SWELLではマイクロコピー機能がなかったので全てマイクロコピーに修正します。



このように「段落」で文言を作ってあげて、

「ブロック下の余白量」で調節してあげるといい感じになります!

まとめ

以上が実際に修正が必要になった箇所です。

  • ボタン
  • 楽天商品リンク
  • キャプションボックス

は解説の通り、型崩れ・・・というよりも消失してしまっていますので早急対処が必要になってきます!

当サイトも251記事のほとんどで3つのどれかを使用しており、
まだ全ての修正作業が済んでいないです(T T)
楽天商品リンクがしんどい(白目)

フィちゃん

乗り換えサポートなかったらやばかったにゃ

なんとな〜くテーマ同士で多少の互換性があるのではないか、と勝手な妄想でここまでずるずると来てしまいましたが思ってたほど互換性ないです。

もし、いつか変更しようとあまく考えている人はお早めに!

  • 251記事のブログのテーマ変更は「SWELL」じゃなきゃ無理!
  • 乗り換えサポートがあっても多少修正箇所がある(それでもしんどい)
  • テーマ変更するなら遅くても半年以内に!
よかったらシェアしてね!

関連記事

目次
閉じる