本サイトにはプロモーションが含まれています

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと

このたび、このブログのテーマを「Simplicity2」から「THE THOR(ザ・トール)」へ変更いたしました。

(という書き出しの記事ですが、このサイトは2022年現在 SWELL に変更しておりますことはお知らせいたします。記事の内容は「THE THOR(ザ・トール)」へ変更した……というものです。「Simplicity2」から SWELL への移行でしたら、ある程度装飾を乗り換えることが出来ると思います。SWELL は最強)

 

一番の理由としては個人的な仕事の都合でそろそろ有料テーマに手を出さなければならなくなったということと、自分が趣味で運営しているブログの中で、ここが一番記事数が少なくて実験しやすいということ。

有料テーマを「THE THOR(ザ・トール)」に決めたのはネット上の評判がすこぶる良かったからということと、複数サイト使用が許されているからということ。(これについては色々と調査不足だったと後から気づいたので(笑)後述します。)

「Simplicity2」をそろそろ止めようかなと思ったのは、例のパンくずリスト構造化データエラーが切っ掛けです。(注)(エラー自体はSimplicity2.8.5ですでに解決されていますし、「Simplicity」自体は常に製作者様が更新し続けている素晴らしいテーマです。念のため。この件についても後記します。)

Simplicity
Simplicity 内部SEO施策済みのシンプルな無料Wordpressテーマを公開しています。初心者でも出来る限り分かりやすく使えるように作成しました。

 

目次

WordPressのテーマ変更はブログの引っ越しと同じくらい覚悟が必要

まず、Wordpressのテーマ変更というのはブログを引っ越すのと同じくらいの手間と慎重さが必要だということは覚えておいた方が良いと思います。「テンプレートに飽きちゃったからテーマ替えよう~~」くらいの軽い気持ちで行うならば、cssを書き足し書き足しして現在のテーマのままでデザインをいじった方が早いし安全です。

テーマを変更するとGoogle評価が下がる(可能性も大きい)

よく「テーマを替えてアクセスアップ」のような記事を見ますが、テーマを替えたらGoogleボットから見るサイトの中身がガラっと変わるので反対に今まで上位に居た記事が下がる可能性は大きいです。

テーマを変更するとメタディスクリプションが消えます

特に「Simplicity」や「Cocoon」そして今回変更する「THE THOR」のような「SEO対策バッチリ」みたいなテーマで記事を作っていた人は「meta description」もプラグインではなくてテーマの機能で作っていたでしょうから、テーマを変更すれば全て消えます。Google評価が下がる大きな要因となります。

結局、装飾関連に大きく時間を取られる

「初心者OK、すぐに記事が書ける」という謳い文句は「本当~~っに、こだわらなければ」としか言えません。

どんなテーマだって初めはそのテーマのデフォルトデザインで出来ています。どこの誰だか分からないモデルのアップがトップページを飾っていても、見出しやサイドバーの装飾が真っ赤でも、新しいテーマの画像設定がデカすぎるせいで今まで使っていた画像がボケボケに表示されていても……我慢できるならそのまま書き続ければいいと思います……(きっと、そんな人、めったに居ない……)

 

この項目は後ほど一記事作るので、また後日。

「Simplicity2」から「THE THOR(ザ・トール)」へ。変更前にやったこと一覧

このページには目次的につらつらと「やったこと」を書いていきます。場合によっては詳細ページへリンクします。思い出したら後から追記していく予定です。

まずはテストページで実験する

テストページに「ザ・トール」をインストールし、プラグインも今まで使っていたものを全て入れて、上手くブログが表示されるか実験しました。

引っ越しのお仕事では常にこれをやってきましたが、自分のブログでやったのは初めて(笑)(「ザ・トール」が初めてなので慎重にならざるを得ない…)

今回はレイアウトや装飾関連もテストサイトで全て実験してからテーマ変更しました。この方法を使えば本サイトを一気に片付けられるので楽です。デザインが崩れている部分もあらかじめ対処しておけるので、記事数が多いブログほどお薦めする方法です。

あわせて読みたい
[WordPress]テストサイトや更新中、公開前のページをWEB上から見えなくする方法 無料ブログからワードプレスへの引っ越し、ワードプレス間のドメインの引っ越し、テーマの改変、まだ出来上がっていないページなど、サイトを非公開にして編集したいこ...

 

これをやれば記事のバックアップも取ることにもなりますし。
あわせて読みたい
[WordPress]『All-in-One WP Migration』プラグインの容量制限対策と使い方と注意点 Wordpressの移転(引っ越し)プラグインとして最高峰に楽ちん簡単な"All-in-One WP Migration" 。 最近まで"All-in-One WP Migration File Extension" という拡張プラグイ...

「meta description」を全て書き写しました!

私はこの段階でテストサイトの方に元サイトで書いていたメタディスクリプションを全て書き写しました(あ、コピペのことです(笑))

だって、テーマを替えたら消えちゃいますから。これも、ここは記事数が100程度だったから出来たことです。うちの趣味サイトの中でメインのブログはもう6000記事を超えているので不可能です(爆)

で、テーマ変更後はこちらにまた書き写すわけですが、検索上位20位までの記事しかやっていません……こんなもんですよね。まぁ、Googleで上位に上がっている記事に関してはやった方が良いと思います。

しかし、「THE THOR(ザ・トール)」は、度々meta descriptionが消えるエラーが起こるとか、着せ替え機能を使うと消えるとか、そういう噂を目にしました。(マジですか、嘘だと言って。それはもう解決したのでしょうか、教えて偉い人!)

「THE THOR(ザ・トール)」をインストール

 

基本は、

  1. バックアップをとる
  2. PHPのバージョンが7.0以上になっているか確認
  3. プラグインを停止
  4. 「THE THOR」を公式サイトから手続きしてダウンロード

トールバナ

 

インストール&有効化の手順は「Simplicity」→「Cocoon」と変わりませんね。

大切なことは、必ず「親テーマ」→「子テーマ」の順に有効化すること。(最終的に有効化するのは「子テーマ」)
あわせて読みたい
[Simplicity2からCocoonへ]ワードプレスのテーマを変更する[WordPress] 以前、当方の趣味のブログは全てテーマ「Simplicity2」で作っていると書かせていただいた気がしますが、映画のブログは「はてな」からWordpressに移転した時点で「Cocoo...

「Simplicity2」から「THE THOR(ザ・トール)」へ。テーマ変更後やったこと一覧

 

このページには目次的につらつらと「やったこと」を書いていきます。場合によっては詳細ページへリンクします。思い出したら後から追記していく予定です。

 「やったこと」は、あくまでも「自分的に大事なこと」の順です。みんな、こうしようよ、って話ではありません。

THETHOR(ザ・トール)の設定はすべて外観→「カスタマイズ」から行います

 

ということで、まずは「カスタマイズ」を開く。

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと

 

「Google Analytics」と「Google Search Console」の設定

これをやらないと、テーマを変更した後、サイトマップが正しく送信されているか分からないので。Google先生がいつ巡回なさるか知れず、たまたまこのタイミングでやって来てサイトマップが認識されなかったら辛いので、真っ赤なサイドバー見出しを変更するよりもこれが急務でした(爆)

「基本設定[THE]」→「アクセス解析設定」

Google AnalyticsのトラッキングID と、Google Search Consoleの認証ID は、ここで入力。

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと

「ユーザーID設定」

「基本設定[THE]」の一番下の項目「ユーザーID設定」

ここには、「THE THOR」をダウンロードした時に一緒についている「説明」に記載されている「THE THORのユーザーID」を入力します。

(これを入力しないと更新情報が来ないということですが、「ザ・トール」さん側でもこれを埋め込むことでユーザー管理したいのだと思います。規則なので埋め込みましょう。これは「ザ・トール」をインストールした全てのブログに入力する必要があるということです。)

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと

 

サイドバーの見出しの色を変更

「基本設定[THE]」→「基本スタイル設定」

ごめんなさい。一番最初に他にやることあるだろう、って話ですが、私はどうしてもサイドバーのドス赤い見出したちを何とかしたかったのです。うちの基調カラーのオリーブと一切合わなくて辛すぎたので……。

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと

 

これは、「基本設定[THE]」→「基本スタイル設定」→「テーマカラーを指定」で変更できます。あっという間にグリーン化。

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと 見出しがグリーンに

 

最初にとりあえず手を付けた「基本設定[THE]」の項はここまでです。後は、見出しの色、トップページやアーカイブページのレイアウトなど、そのままだと見た目辛すぎる所を慌てて修正。

ヘッダーエリアを設定

このブログの場合はトップページから来る方は恐らくほとんどいらっしゃいません。ので、まぁ、最悪トップページはグズグズ少しずつ修正すればいいのですが、ヘッダーやフッターやサイドバーの共通エリアはアクセスされた記事に直接関係するので、とりあえずの見た目は何とかしておきたい。

 

ヘッダーエリアは「共通エリア設定[THE]」→「ヘッダーエリア設定」から設定します。

とりあえず、画像関係は後回しにしても、色だけはここで調整しておきましょう。

ヘッダーのメニューを設定

ヘッダー帯に表示するメニューも同じところから設定します。

「共通エリア設定[THE]」→「ヘッダーエリア設定」→「グローバルメニュー設定」

グローバルメニューとは、タイトルの横(あるいは下)に表示するメニューのことです。

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと メニュー

自分自身が他所のブログを見た時に、今現在読んでいる記事からどう移動するか考えると、ヘッダーエリアにメニューは必須な気がします。(「パソコンの場合は」です。このブログはブログを作る人が読みに来てくださる率が高いので、パソコンからのアクセスが多いのです。)

どうも「ザ・トール」ではメニューをスマホに表示すると二段になってくれず、スクロールバーで閲覧者が横にずらすような画面になってしまうみたいなので、私はスマホでは「表示しない」設定にしました。好みです。

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと すまほヘッダ

 

その代わり、スマホ画面ではメニューパネルに「人気記事」「新記事」「カテゴリー」などを表示させています。

固定フッターエリア設定(スマホ専用)

「固定フッターエリア」というのは、スマホサイトの一番下によく表示されているあのナビゲーションのことです。好みです。私は入れました。

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと フッターメニュー

 

「TOPページ設定[THE]」

「TOPページ設定[THE]」についてまとめて書きます。

「メインビジュアル設定」

「THETHOR」ではヘッダーの下に大きな画像やYouTube動画、スライドショーなどを入れることができます。

 

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと

 

これは確かにとても見栄えが良くて素敵ですし、これこそ「THETHOR」の特徴だと思うのです。写真やイラストを自作しておられるビジュアル系のブログでは必須でしょう。

しかし、うちの場合はこのブログでは自作のイラストはほとんどやらないです。ので、とりあえずは高さ180に設定して控えめに入れています。ここに関しては、いずれ自分で作る時間が出来たら入れ替えます。

「カルーセルスライダー設定」

これも「THETHOR」の映えパーツの一つだと思います。ここは記事への流動目的で入れておきます。やることは「表示」か「非表示」か選ぶだけです。

「ピックアップ3記事設定」

ピックアップしたい(見てもらいたい)記事を3つ表示することができます。

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと

 

「記事IDを入力」しない場合は、「最新記事」が3つ表示されます。

「記事ランキング」「カテゴリ最新記事」は、とりあえず飛ばして次へ行きます。

「アーカイブページ設定[THE]」

テーマを「THETHOR」に替えて、一番初めにみっともないから早く何とかしなくては……と思ったのがカテゴリー一覧のページでした。うちは「Simplicity」の時、680×400で画像を作っていたので、こんなに大きなサイズの画像をズラズラ並べられたらボケて仕方ないわけです。泣きたいほど焦った。

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと

 

これを何とかしてくれるのが、「アーカイブページ設定」→「コントローラー設定」→「レイアウト切替ボタンの設定」です。

 

大きな画像をズラズラ並べるのはここが「ワイドレイアウト」の時で、「カードレイアウト」にすれば2カラムの表示に。

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと

 

「ノーマルレイアウト」にすれば普通の一覧表示になります。

[Simplicity2からTHE THOR(ザ・トール)へ]ブログテーマ変更時、はじめにやったこと

 

この、カードに入る文字数が多すぎて嫌だったのですが、これは次の「記事一覧リスト設定」で解決できました。

「本文の抜粋文字数を指定」を50文字にして解決。

見出しの色やデザインを変更する

 

見出しは「パーツスタイル設定[THE]」→「見出し設定(個別ページ用)」から変更します。

見出しデザインはジックリ検討したいので、とりあえず「インストールして初めにやったこと」では、色合わせ程度のことをやっておきました。同様に「ボックスデザイン」も「パーツスタイル設定[THE]」から行います。

あわせて読みたい
[THE THOR(ザ・トール)]「ボックス」一覧と装飾の使い方、カスタマイズ 「THE THOR(ザ・トール)」は、記事装飾のためのパーツが大変充実しています。記事を分かりやすく見せるための「ボックス」もその一つ。デフォルトでも10種類、ボック...
あわせて読みたい
[Simplicity2からTHE THOR(ザ・トール)へ]テーマ変更時ボックス装飾の書き換え方法 ワードプレスのテーマを「Simplicity2」から「THE THOR(ザ・トール)」へ変更した際に、ボックスやボタンなどの記事装飾を一括で置き換えする方法です。(コードは「Cocoon...

プライバシーポリシーとお問い合わせページをUPする。

「Simplicity2」で「プライバシーポリシー」ページを作っていなかった方は、ここで最初に作ってしまいましょう。cookieや個人情報の扱いを記す「プライバシーポリシー」はブログ運営者は付けなくてはならないことになっています。

プライバシーポリシーには何を書けばいいのか(テンプレート)

一体、どんな文面を書けばいいのかというと、実はWordpress自体にテンプレートが付いています。

ダッシュボードの「設定」→「プライバシー」→文章の下の方「含むべき内容を提案しているガイドを確認しましょう。」をクリック。

ここにテンプレートがあるので、丸々っとコピペして固定ページにUPすればいいと思います。(WordPressさんも「コピーしましょう」と言っているので大丈夫)

 

当方は、もっと簡単な文面にして「お問い合わせ」ページと一緒にしています。

あわせて読みたい
お問い合わせとプライバシーポリシー、免責事項など お問い合わせとプライバシーポリシー ご訪問、ご高覧いただきありがとうございます。 当サイト『見取り八段/ブログのblog』( https://muryoblog.cinemarev.net )は2022...

とりあえず、ここまで

とりあえず、「はじめに一気にやったこと」でした。

後は、ボチボチ手入れします。(このボチボチが楽しいけれど、ちっとも終わらない……カスタマイズは無限です)

よかったらシェアしてね!
  • 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
よろしくお願いいたします。

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

コメント

コメントする

目次