WordPressには投稿タイプが組み込まれているため、カスタムHTMLファイルをアップロードすることなくても、固定ページを作成することできます。 WordPressテーマにも、要件を満たすウェブサイトの構築を考慮した固定ページのテンプレートセットが含まれているのが通例です。
また、検索結果、メールキャンペーン、SNSなどからのアクセス用ランディングページのテンプレートを作成するWordPressランディングページプラグインも多数存在します。
したがって、WordPressサイトを立ち上げるのに必要なものはコアにすべて組み込まれているため、HTMLファイルをWordPressにアップロードする必要はほぼありません。とはいえ、WordPressにHTMLファイルをアップロードしたい状況もいくつか考えられます。
そこで今回は、HTMLファイルをWordPressにアップロードする方法をご紹介します。また、アップロードが必要になる状況も見ていきます。
HTMLファイルとは
HTMLとはHypertext Markup Languageの略で、1990年にTim Berners-Leeによって最初に開発されました。要するに、HTMLはウェブページとして知られているインターネット上の電子文書を作成するためのコードです。インターネット上のすべてのウェブページは、HTMLコードを使用して作成されています。
サイトのウェブページ上のHTMLコードは、コンテンツや画像が正しくフォーマットされていることを担当します。
HTMLがなければ、ブラウザはサイトの構造をユーザーに提供することができません。ウェブページの基盤を構成する適切なHTMLコードとデザイン要素を担うCSSコードがあって初めてウェブサイトが表示されます。
HTMLテンプレートとは
先に触れたとおり、HTMLはインターネット上のすべてのウェブページの構造を作成するコード。
HTMLテンプレートとは、文章や画像、フォントスタイル、Javascriptのサポートファイルなどを含む、事前に設計された一連のHTMLファイルであり、ウェブサイトにアップロードして使用できる完成されたパッケージです。
WordPressサイトでHTMLテンプレートを使用するには、ファイルをアップロードし、サイトのフロントエンドに表示するテキストや画像などをテンプレートに入力します。
なお、HTMLテンプレートとWordPressテーマは混同されがちですが、以下のような大きな違いがあります。
- WordPressテーマ：ウェブサイト全体の外観を指定するもので、テーマ要素の多くはサイト全体に適用される。
- HTMLテンプレート：ウェブサイトに個別にアップロードする個別のzipファイルであり、単一ページの外観に適用される。HTMLテンプレートに加える変更はそのウェブページにのみに適用される。
HTMLファイルをWordPressにアップロードしたい状況
HTMLファイルをWordPressにアップロードする状況には、次のようなものが考えられます。
-
- WordPressサイトで使用したいテンプレートを持っている─以前のウェブサイトでHTMLテンプレートを新規WordPressサイトでも使用したい場合、ゼロから作り直すのではなく、テンプレートをアップロードするほうが効率的です。
- 独自のページレイアウトを使用したい─使用しているWordPressテーマが特定のページレイアウトをサポートしていない場合、HTMLファイルをアップロードしてカスタマイズ可能です。
また、Google Search ConsoleでWordPressサイトを確認するために、サイトにGoogleのHTML検証ファイルをアップロードしたいかもしれまん。
ウェブサイトが検索エンジン、特にGoogleのような主要検索エンジンで上位表示されることは、サイト所有者にとって重要です。
これに役立つのがGoogle Search Consoleのようなソリューションです。Google Search Consoleを使用することで、Googleがサイトをインデックスし、関連する検索結果にサイトが表示されているかを監視できます。
また現在のSERP（検索エンジンの結果ページ）に関する情報も取得できるため、SEOを強化し、サイトのクリックスルー率（CTR）を増やすことができます。
ただし、Google Search Consoleを使用するには、WordPressサイトの所有権を確認する必要があります。そしてこれを行うベストな方法が、HTML確認ファイルのアップロードです。
続いて、HTMLファイルをWordPressサイトにアップロードする方法を見ていきましょう。
方法1. WordPress管理画面からアップロードする
HTMLファイルをWordPressにアップロードする最初の手段は、WordPressダッシュボードを使用することです。
投稿、固定ページ、またはメディアライブラリから直接にHTMLファイルをアップロードするため、この手段には、ウェブサイトのバックエンドとHTMLテンプレート以外に何も要りません。
投稿または固定ページからHTMLファイルをアップロードするには、Gutenbergエディターに「ファイル」ブロックを挿入します。次に、「アップロード」をクリックしてHTMLファイルをアップロードします。
Gutenbergを無効にし、旧エディターを使用している場合は次のようになります。HTMLファイルをアップロードするには「メディアの追加」→「アップロード」の順にクリックします。
アップロードするHTMLファイルを選択して、「投稿に挿入」をクリックします。これを行うと、ファイルのリンクが投稿または固定ページに挿入され、メディアライブラリに自動的に保存されます。
WordPressの投稿または固定ページではなく、メディアライブラリにアップロードすることも可能です。WordPress管理画面から「メディア」＞「ライブラリ」を開き、「新規追加」をクリックして、保存場所（コンピュータ、ハードドライブ、外部ストレージなど）からHTMLファイルを選択します。
なお、Gutenbergの使用中にHTMLファイルをアップロードすると、以下のようなエラーが発生することがあります。
「このファイルタイプはセキュリティ上の理由から、許可されていません」エラーの解決方法はこちらをご覧ください。
方法2. FTPクライアントを使用してアップロードする
HTMLファイルは、WordPress管理画面からアップロードするのが最も手っ取り早い方法です。複数のファイルにまたがる大きなテンプレートの場合は、FileZillaなどのFTPクライアントを使用することをお勧めします。
FTPクライアントは、変更内容を本番サイトに適用する前に、ローカルのテストサイトを作成する際にも有用です。
なた、HTMLファイルをサイトにアップロードする前には、万が一に備えてバックアップを作成してください。
バックアップを作成したら、FTPクライアントを開きます。
FTP認証情報を入力して、ウェブホストアカウントに接続します。認証情報は通常、サーバーサービスのコントロールパネルから参照可能です。見当たらない場合は、サーバー会社に問い合わせてください。
Kinstaの場合は、MyKinstaにログイン後、「WordPressサイト」＞（サイト名）＞「情報」画面に移動すると確認できます。
認証情報は「SFTP / SSH」の下にあります。ユーザー名、パスワード、ポートが必要です。
FileZillaに入力する必要がある情報は次のとおりです。
- Host：「sftp://」が前に付くサイトのドメイン名（例：sftp://www.mysite.com）
- Username：MyKinsta「SFTP/SSH」セクションのユーザー名
- Password：MyKinsta「SFTP/SSH」セクションのパスワード
- Port：MyKinsta「SFTP/SSH」セクションのポート
FileZillaの画面は以下のようになっています。
認証情報を入力したら、「Quickconnect」をクリックします。
次に、コンピュータからWordPressにHTMLファイルをアップロードします。まず、右側にウェブサイトのルートフォルダ（wp-contentフォルダ、wp-config.phpファイルなどを含むフォルダのこと）に移動します。
次に、左側メニューからHTMLファイルの保存場所を探します。ファイルを見つけたら、右クリックで「Upload」を選択します。Filezillaで隠しファイルを表示する方法はこちらをご覧ください。
これでファイルがWordPressにアップロードされました。サイトに表示されていることを確認するには、サイトのHTMLファイル名を追加したURLをブラウザに貼り付けてください（例：www.mywebsite.com/html-file）。
HTMLファイルで作成したウェブページにリダイレクトされればOKです。
方法3. cPanelを使用してアップロードする
cPanelとファイルマネージャーを使用してHTMLファイルをWordPressにアップロードする方法もご紹介します。
まずは、ホスティングアカウントのcPanelにログインし、ファイルマネージャーにアクセスします。
ファイルマネージャーを開いたら、いずれかの方法を選択してください。
-
- 新規フォルダの作成：サイトのルートフォルダにHTMLファイルをアップロードするフォルダを作成します。
- ルートフォルダへのアップロード：フォルダを作成せずにHTMLをWordPressにアップロードします。HTMLファイルを解凍し、index.htmlフォルダのファイル名をに変更し、ファイルを再圧縮してアップロードします。ファイル名を変更することで、HTMLテンプレートがサイトのトップページを上書きするのを防ぐことができます。
今回は、例としてフォルダを作成する手順を見ていきます。
フォルダを作成してHTMLファイルをWordPressにアップロードする
まず、サイトのルートフォルダ（wp-contentフォルダ、wp-config.phpファイルなどを含むフォルダ）に移動し、「新規フォルダ」をクリックします。
新規フォルダに名前を付けて、「新規フォルダの作成」をクリックします。
作成したフォルダをダブルクリックし、「アップロード」をクリックしてHTMLファイルを選択します。
これで、圧縮されたHTMLファイルがフォルダに表示されます。
右クリックして「解凍」を選択し、HTMLファイルを解凍します。
モーダルウィンドウで「ファイルの解凍」をクリックして、解凍プロセスを終了します。HTMLファイルを解凍すると、テンプレートのすべてのファイル（CSS、フォントスタイルファイル、画像、JavaScriptなど）が表示されます。
HTMLテンプレートとそのファイルがアップロードされたかを確認するには、作成したフォルダ名を含めたURLをブラウザに貼り付けます。
404エラーが表示されてもご安心を。これはよくあるWordPressエラーで、簡単に解決可能です。
サーバーがリダイレクトをサポートしておらず、URLが読み込まれる際にindex.phpファイルがリダイレクトされない場合、404エラーが発生します。
これを解決するには、ファイルマネージャーを使用して、.htaccessファイルをダブルクリックで開きます。以下のコードを貼り付けてください。
RewriteRule ^(.*)index\.(php|html?)$ /$1 [R=301,NC,L]これにより、index.phpファイルがリダイレクトされ、ブラウザに読み込みまれるようになります。
まとめ
WordPressはその高い柔軟性から、世界で最も使用されているコンテンツ管理システム（CMS）です。今回は、HTMLファイルをWordPressにアップロードする方法をご紹介しました。WordPressサイト所有者は、特定の状況や要件に応じて、HTMLファイルを使って自由にサイトをカスタマイズすることができます。
また、現在は特に必要なくても、使用するテーマにないページレイアウトを作成したい場合などに備えて、手順を覚えておくと便利です。
