ウェブサイトのコンテンツを失うことなく WordPress のテーマを変更する方法

公開: 2022-10-07

あなたのウェブサイトが現在のテーマを超えて成長し、いくつかの新しい機能を備えた新しい外観の恩恵を受けると信じているので、あなたは私たちに来ました. 良いニュースは、WordPress テーマでの作業がとても楽しいことです。これらはカスタマイズ可能で、Web サイトのルックアンドフィールをすばやく変更できます。

ただし、テーマはますます複雑になり、e コマースストアなどの特定の Web サイトに合わせて調整されているため、互いにシームレスに交換することはできません。ある WordPress テーマから別のテーマに安全に切り替えたい場合は、掘り下げる必要があります。結局のところ、アクティブなテーマはサイトの機能に深く根付いているため、変更を加えると機能が損なわれる可能性があります。

エラーのドアを開けたり、Web サイトのコンテンツを失うことなくテーマを変更するには、単に [アクティブ化] ボタンをクリックするよりも時間がかかる場合があります。ただし、いくつかの簡単な手順に従うことで、切り替え後もサイトが引き続き正常に機能することを確認できます。これについては、これから説明します.

それでは、さっそく見ていきましょう。

WordPressテーマを変更する前に必要なこと

マウスを数回クリックするだけでテーマを変更できますが、続行する前にいくつかの予防策を講じる必要があります。

WordPress テーマの変更がスムーズに進み、重要なデータが失われないように、次のチェックリストを確認することをお勧めします。

ステップ 1: サイトの完全なバックアップを作成します。

WordPress テーマに変更を加える前に、すべてのファイルをバックアップする必要があります。テーマを変更しても自動的に Web サイト全体が失われるわけではないため、これは予防措置にすぎませんが、後悔するよりも安全を確保することをお勧めします。

ファイルは 2 つの方法でバックアップできます。プラグインを使用するか、ファイルを手動でバックアップできます。

Updraft PlusやBackupBuddyなどのプラグインは、Web サイトのプラグイン、データベース、テーマ、コンテンツ、その他のファイルを自動的にバックアップします。さらに、バックアッププラグインは通常、バックアップファイルをオフサイトの安全な場所に保存するため、誰かがデータをハッキングする心配はありません。

大規模な Web サイトがある場合は、手動バックアップを検討することもできます。手動でバックアップする方法は次のとおりです。

ウェブサイトの管理パネルにログインします。コントロールパネルは、Web サイトホスティングプロバイダーを介してアクセスします。
「FTP アクセス」、「FTP 設定」、「FTP アカウント」、「FTP ユーザー」のいずれかのオプションを選択します。
ログインして、バックアップするファイルを正しいディレクトリからコピーします。これは、別のブラウザに「ftp:/yourwebsite.com」と入力することで実行できます。「あなたのウェブサイト」と書かれている場所にあなたのウェブサイトの名前を入れます。
コントロールパネルに戻り、「phpMyAdmin」を起動します。
データベースを選択します。ウェブサイトが 1 つしかない場合は、それが唯一のウェブサイトである必要があります。
データベースをエクスポートします。この時点で、データベースのエクスポートオプションが利用可能になります。

エクスポートすると、エクスポート時のサイトの手動バックアップが作成されます。

ステップ 2: 現在のテーマからスニペットをコピーします。

一部の WordPress ユーザーは、テーマの functions.php ファイルにコードスニペットを追加して Web サイトをカスタマイズすることを好みます。残念ながら、これらの変更は 1 回しか行われていないため、通常、人々はこれらの変更を忘れています。

あなたまたはあなたの Web 開発者がこれらの変更を行った場合は、現在のテーマファイルを調べて、以前に追加した余分なコードをすべて書き留めてください。これにより、後で新しいテーマの functions.php ファイルまたはサイト固有の WordPress プラグインに含めることができます。

ステップ 3: ウェブサイトのデータ追跡をコピーします。

一部のユーザーは、アナリティクストラッキングコードをテーマファイルに直接追加します。 WordPress テーマでは、設定パネルに Adsense または Analytics コードを入力することもできます。ただし、テーマを切り替えると、その情報は失われ、ウェブサイトは Google アナリティクスで追跡されなくなります。

これが Google アナリティクスコードの場所である場合は、どこかに書き留めておいてください。新しい Web サイトのテーマの footer.php ファイルに貼り付けることができるように覚えておいてください。

ステップ 4: Web サイトをメンテナンスモードのままにします。

新しいテーマへの移行中にユーザーが Web サイトにアクセスした場合に、壊れたサイトが表示されるのは望ましくありません。そのため、切り替えを行う間はメンテナンスモードを有効にすることをお勧めします。多数のメンテナンスモードプラグインから選択できます。

この目的のために、 SeedProdプラグインを使用することをお勧めします。これは有名な WordPress プラグインで、Web サイトの美しい近日公開ページやメンテナンスモードページを簡単に作成できます。

メンテナンスモードを有効にするには、SeedProd の無料版を使用します。事前に作成されたテンプレート、高度なカスタマイズ機能、メールマーケティングツールの統合を含むプレミアムバージョンも利用できます。 SeedProd プラグインをインストールしてアクティブ化し、サイトをメンテナンスモードに保ちます。 Plugins → Add New に移動し、Install and Activate をクリックします。

ステップ 5: 読み込み時間と主要なブラウザーとの互換性をテストします。

テーマを変更する前に、Web サイトの読み込み時間を確認して、Web サイトに変更を加えた後のページ読み込み時間の違いをすばやく比較する必要があります。これは、無料の速度テストツールであるIsItWPなどの WordPress 速度テストツールを使用して行うことができます。

WordPress の速度はユーザーエクスペリエンスと SEO にとって不可欠であるため、新しいテーマが古いテーマよりも高速であることを確認してください。また、Internet Explorer、Firefox、Safari、Google Chrome、Opera Browser など、すべての主要なブラウザーで新しい Web サイトのテーマをテストする必要があります。

ここまで説明したことをすべて完了したと仮定して、次に何をする必要があるかを見てみましょう。

WordPressテーマのインストール方法

前述の注意事項に従って、次のステップは Web サイトのテーマをインストールすることです。何千もの無料および有料の WordPress テーマから選択できます。しかし、あなたはこの記事を読んでいるということは、おそらくあなたのウェブサイトのニーズに合った良いテーマを見つけたことを意味します.

ただし、まだテーマを選択していない場合は、次のテーマを強くお勧めします。

1.コリブリ

コリブリ

Colibri は無料の多目的テーマであり、ほとんどの無料の WordPress テーマとは異なり、多くのデザインコントロールが可能です。その結果、Colibri は最も人気のある WordPress テーマのトップ 20 に入っています。

テーマのインストールおよび有効化プロセス中に Colibri ページビルダーをインストールすることをお勧めします。このビルダーは、多くの強力な機能を追加し、ドラッグアンドドロップで Colibri サイトを作成できるようにすることで、テーマのカスタマイザーを強化します。

Colibri の気に入っている点は次のとおりです。

幅広いニッチ向けの 90 以上の無料およびプレミアムテンプレートサイト。ゼロから作成する場合でも、事前にデザインされたテンプレートを使用する場合でも、ピクセルパーフェクトになるまで簡単にカスタマイズできます。
必要に応じて変更できる 150 以上の定義済みブロック。いくつかの例は、ブロック、機能、サービス、チーム、証言、ポートフォリオ、連絡先ブロックなどです。
最終的にカスタムブロックを作成したり、既存のブロックをカスタマイズしたりするための 40 以上のドラッグアンドドロップコンポーネント。
単一のインターフェイスでヘッダーからフッターまで Web サイトを編集します。
モバイル応答性;
シンプルで直感的なユーザーインターフェイス。

2.魅了する

Mesmerize は、Web サイトをすばやく作成できる無料の多目的テーマです。これは最高のカスタマイズオプションの 1 つです (ビデオの背景、スライドショーの背景、グラデーションオーバーレイなど)。

Mesmerize の気に入っている点は次のとおりです。

ページに配置して組み合わせて完璧なプレゼンテーションを作成できるコンテンツブロックがたくさんあります。
Mesmerize は、多数のヘッダーカスタマイズオプションを提供します (ユーザーの注意を引くために重要です)。
テーマを使用すると、フロントページナビゲーション、ページ内ナビゲーション、およびモバイルナビゲーションを区別できます。
Mesmerize はモバイル対応で、モバイルデバイスやタブレットデバイスで見栄えがします。

3.昇格

Elevate は、2021 年後半にリリースされた無料の WordPress テーマです。この記事で紹介するほとんどのテーマとは異なり、ブロックベースであるため、デフォルトの WordPress エディター内でカスタマイズできます。他のテーマは WordPress カスタマイザーと互換性があります。

WordPress で Web サイトをカスタマイズするには、主に 2 つの方法があります。

カスタマイザーの使用 – Colibri、Mesmerize、Astra、およびその他の古くて人気のあるテーマのように;
デフォルトエディター、別名ブロックエディター、別名グーテンベルグエディターを使用します。 2018年、この新しい体験が当たり前になりました。ただし、知識は依然として基本的なものであるため、Kubio のような製品は、それをレベルアップし、WordPress ユーザーがデザインをより細かく制御できるようにするために作成されました.

それの素晴らしいところは、アクティベート中にKubioをインストールすることを提案することです. Kubioは、Elevate テーマに独自の機能を追加する素晴らしい Web サイトビルダーです。

Elevate と Kubio の組み合わせの気に入っている点は次のとおりです。

デザイナーが作成したスターターサイト。
チーム、クライアント、ポートフォリオ、機能など、170 以上の既成のセクションがさまざまなカテゴリに分類されています。
50 以上の完全にカスタマイズ可能なブロックヘッダー、タブ、アコーディオン、スライダー、カルーセルなどのブロックをドラッグアンドドロップし、アップグレードされたブロックエディターでカスタマイズします。
フォントサイズは、PX、REM、または EM で指定できます。
覚えやすい Web サイトを作成するには、図形の仕切り、オーバーレイ、セクションの重なり、視差を使用します。
カラーパレットを作成して、サイト全体で使用できます。
モバイルデバイスでの応答性。デスクトップ、タブレット、およびモバイルデバイス全体で、色、背景、テキスト、および間隔をカスタマイズできます。
ライブプレビュー;
フルサイト編集とは、WordPress ダッシュボードに戻ってヘッダー、フッター、サイドバー、およびその他の変更を行うのではなく、1 つのインターフェイスで Web サイト全体を編集する機能を指します。

テーマを決定したら、それを WordPress サイトにインストールする必要があります。以下に示す 3 つの方法のいずれかを使用して、WordPress テーマをインストールできます。

WordPress テーマ検索オプションの使用;
WordPress ダッシュボードからテーマをアップロードする。
FTP を使用してテーマをインストールします。

ライブに行かずにWordPressテーマを切り替える方法

新しいテーマをインストールしたら、すぐに切り替えることができます!

ただし、実際の Web サイトに実装する前にテーマをテストすることをお勧めします。これにより、新しいテーマと既存のプラグインとの互換性をテストし、すべてが期待どおりに機能することを確認できます。

ライブに移行せずに WordPress テーマを変更するには、次の 2 つの方法があります。

1.ライブプレビューオプションを使用して WordPress テーマを変更します。

WordPress では、デフォルトで、Web サイトのテーマを変更せずにプレビューできます。これを行うには、管理パネルの左側のサイドバーで [外観] » [テーマ] に移動します。

WordPressテーマのライブプレビュー

このページには、サイトにインストールされているすべてのテーマが表示されます。テーマをプレビューするには、マウスをその上に移動し、[ライブプレビュー] ボタンをクリックします。ライブプレビューでは、新しいテーマをアクティブ化する前に Web サイトでどのように表示されるかを確認できますが、制限があります。さらに、ライブプレビューはコードの競合を防止しません。

2. Theme Switcha プラグインを使用して WordPress テーマを変更します。

そして、WordPress にはすべてのプラグインがあるため、WordPress のテーマを変更するためのプラグインがあるのも当然です。 Theme Switchaを使用して、アクティブなテーマが訪問者に表示されている間に、サイトのフロントエンドでテーマをテストできます。このプラグインにはさらにいくつかの機能がありますが、この記事ではテーマ切り替え機能に集中します.

最初にこの無料のプラグインをインストールして有効にする必要があります。 Plugins → Add New に移動し、Install and Activate をクリックします。次に、管理パネルの左側のサイドバーから [設定] → [テーマスイッチ] に移動します。

テーマスイッチプラグイン

[設定] ページで、[テーマの切り替えを有効にする] ボックスをオンにし、ページの一番下までスクロールして [変更を保存] をクリックします。

切り替えを有効にする

このページの下部に、このプラグインはインストールされているすべてのテーマを表示します。新しいテーマをクリックして、Web ブラウザーの新しいタブに表示します。

ライブサイトのテーマを変更する方法

新しいテーマをテストしたら、WordPress サイトでテーマの変更を開始できます。これを行うには、WordPress 管理パネルの左側のサイドバーで [外観] → [テーマ] に移動します。

テーマを有効にする

WordPress テーマを変更するには、使用するテーマの上にマウスカーソルを置き、このページの [アクティブ化] ボタンをクリックします。それだけです。 Web サイトのホームページにアクセスして、新しいテーマを表示できるようになりました。

テーマを変更した後に必要なこと

Web サイトのテーマを変更した後、メンテナンスモードを終了する前に、次のタスクを完了する必要があります。

ウェブサイトをテストします。

まず、すべての機能、プラグイン、およびウィジェットが動作していることを確認します。また、Web サイトをテストし、投稿、コメント、画像、連絡先フォームなどのさまざまな要素を検査する必要があります。

クロスブラウザーの互換性も確認することを忘れないでください。特定のものは、ブラウザによって表示が異なります。

Web サイトがすべての主要なブラウザーで適切に表示されるようにするには、Google Chrome、Firefox、Safari、Internet Explorer などの複数のブラウザーでテストしてください。

追跡コードを追加します。

機能とブラウザー間の互換性をテストした後、分析と Adsense 追跡コードをサイトに追加する必要があります。

Google アナリティクストラッキングコードを追加するには、MonsterInsights プラグインを使用します。これにより、分析を適切に構成し、WordPress ダッシュボードから直接詳細な Web サイト統計を表示できます.

メンテナンスモードをオフにします。

メンテナンスモードをオフにすることで、サイトをライブにすることができます。たとえば、SeedProd プラグインを使用している場合は、WordPress ダッシュボードの SeedProd → ページに移動し、メンテナンスモードを「非アクティブ」に切り替えます。

読み込み時間と直帰率をテストします。

一部のツールでは、ページの読み込みにかかる時間を観察することで、Web サイトの読み込み時間を測定できます。 Pingdom Toolsは、シンプルで複数のテストサーバーの場所を提供するため、私たちのお気に入りの 1 つです。テストするページの URL を入力し、Pingdom ツールを使用するサーバーを選択します。米国の2つを含む4つのサーバーから選択できます.

最も一般的なホスティングプロバイダーは米国にデータセンターを持っているため、これらのサーバーを使用すると、より良い結果が得られる場合があります。ただし、オーストラリアとスウェーデンのテストサーバーでもテストを実行して、これらの国のユーザーに対してサイトがどれだけ速く読み込まれるかをよりよく理解すると役立ちます。

また、テーマを切り替えた後は、サイトの直帰率に注意する必要があることに注意することも重要です. 新しいテーマが不親切で使いにくい場合、サイトの直帰率が高くなる可能性があります。

関連する投稿、人気の投稿ウィジェット、ブレッドクラムを含めることで、直帰率を下げてページビューを増やすことができます。

フィードバックを求めます。

そして、おそらく最も重要なのは、ユーザーからのフィードバックです。 Web サイトのデザインを改善する方法について、ユーザーからのフィードバックを求めます。調査フォームまたはオンライン投票を使用して、ユーザーフィードバックを収集できます。

メールマーケティングサービスを使用して、新しいデザインを購読者と共有し、フィードバックを求めることができます。これは、彼らが何を改善したいかについてのアイデアを得るのに役立ちます。

テーマを切り替えたら、Web サイトで確認すること。

ウェブサイトをテストしてトラッキングコードを追加する以外にも、次のような注意事項が数多くあります。

デザイン要素

特定の Web サイトデザイン要素は重要であり、訪問者のエンゲージメントとユーザーエクスペリエンスに直接影響します。テーマの変更が完了したらすぐに確認する必要がある上位のいくつかを次に示します。

ホームページ：正しいページがホームページとして表示されていますか？ 一部のテーマには、WordPress ページ階層外に専用のホームページがあるため、どのホームページが正しいかを指定する必要があります。たとえば、古いテーマにカスタムホームページがあった場合、それはページの下書きに保存され、代わりに新しいテーマのデフォルトホームページが表示されます。

メニュー:メニューが消失した場合、メニューを再作成する必要がある場合があります。 まず、各リンクを調べて、それらが正しく機能していることを確認します。また、以前のテーマからのすべてのリンクがまだ表示されていることを再確認してください。たとえば、設計上の制約により一部が消失した可能性があります。

カスタム CSS:カスタム CSS は、基になるテーマに加えて Web サイトの外観を変更するために、サイトのテーマに挿入されるコードスニペットです。 これは、テンプレートを一括変更するための簡単な方法です。カスタム CSS はテーマ固有であるため、これは新しいテーマに自動的に引き継がれないものの 1 つです。いずれにせよ、古い音楽を削除して新しい音楽に置き換えたので、新しいテーマでカスタム CSS が必要かどうかを検討する必要があります。

ユーザーエクスペリエンス:テーマ間の最も顕著な違いの 1 つは、ユーザーエクスペリエンスです。 ほとんどの部分がブラウザ間で正しく表示されるようになりましたが、常にそうであるとは限りません。サイトがさまざまな画面サイズで正しくレンダリングされる機能は、最新の Web デザインの基礎です。サイトの読み込み時間も確認してください。新しいテーマのインストールは読み込み時間に影響を与えましたか? SEO では速度が不可欠です。原則として、新しいテーマは以前のテーマよりも速くロードする必要があります。さらに、ユーザーエクスペリエンスを向上させます。

その他の要素:投稿、コメントセクション、画像、ページ、フォームなどはすべて一貫性をチェックする必要があります。

WordPressのテーマ切り替え時に発生する可能性のあるエラー

私たちの経験では、新しくインストールされた WordPress テーマでいくつかの問題が発生する可能性があります。潜在的なエラーのリストを次に示します。

新しいテーマは独自のレイアウトを強制するため、既存のレイアウトが壊れます。
テーマは、インストールされているプラグインと互換性がありません。
テーマが現在の PHP バージョンと矛盾しています。
カスタムウィジェットは削除されます。
ナビゲーションメニューは、警告なしにリンクを失う場合があります。
お問い合わせフォームが機能しなくなりました。
ページ内のセクションが壊れる場合があります。
以前のテーマで追加されたショートコードはすべて削除されます。
スキーマデータのエラー。

このリストは完全に網羅されているわけではありませんが、避けるべき間違いを知ることができます。そのため、ライブサイトに変更を加える前に、最初にステージングサイトにテーマをインストールし、問題を解決することが重要です。

要約

そして、あなたはそれを持っています！ Web サイトを準備して保護するための措置を講じた後は、テーマの変更はもはや威圧的でも恐ろしいものでもありません。人々は頻繁にサイトのテーマを使い果たし、それらを置き換えたいと考えています。WordPress のテーマは、ゼロから始めることなくウェブサイトを一新するための優れた方法です.

このステップバイステップガイドが、WordPress テーマをすばやく変更するのに役立つことを願っています. さあ、あなたはそれを成し遂げるために行きます！