【ワードプレス】オリジナルデザインの固定ページを作る方法

ワードプレス

ワードプレスでブログを運営していて自分だけのオリジナルページが欲しいと思うことはありませんか?

実は意外と自分だけのオリジナルページは簡単に作れてしまうんです。

PHPの知識は不要です。

勿論、既存のテーマは変更せずに全く別のデザインのページが作れます。

今回はその方法をお伝えしようと思います。

このブログ「なぎちゃんねる」ではテーマ「Cocoon」を使用しているのでテーマ「Cocoon」を例に説明していきます。基本的にどのテーマでもやり方は同じだと思いますがご了承ください。

スポンサーリンク

事前に準備するもの

以下のものが必要になります。

WebFTP(ファイルマネージャ)またはFTPソフト(filezilla等)

HTML / CSS等の知識

テーマファイルの中に「フォルダ」及び「ファイル」を設置しますのでサーバーの中(ワードプレスがある場所)が見れなければなりません。

エックスサーバーであればファイルマネージャから見ることが出来ます。

エックスサーバーでファイルマネージャを利用する方法

設置するファイルとフォルダを用意する

用意するファイルとフォルダは以下の通りです。

  • example.php
  • style.css
  • my-template(フォルダ)

ワードプレスはPHPを使って作られていますのでPHPファイルを用意します。

「example.php」の「example」は好きな文字列に変えて貰って構いません。

メモ帳などでファイルを保存して、末尾にに拡張子「.php」とつけてください。

装飾等のデザインをしないのであればPHPのファイルのみで大丈夫です。

画像を入れるのであれば画像もご用意ください。

作ったファイルは「my-template」フォルダに入れてください。

因みにCSSや画像を読み込む場合は絶対パスで指定してあげてくださいね。

example.phpに下記の通り記述をする

<?php
/*
 * Template Name: オリジナルデザインの固定ページ
 */
?>

最後の「*/」の次の行から好きなコード(HTML)を記述することが出来ます。

htmlの宣言からでも可能です。

とりあえず今回は上記のままアップロードします。

ファイルとフォルダをアップする。

ここでFTPを使います。

WebFTPもしくはFTPソフトをご用意ください。

現在、ワードプレスで「有効」にしているテーマのフォルダ内に、先ほど作ったファイルとフォルダをアップします。

フォルダをそのまま入れてください。

このサイトではテーマ「Cocoon」の子テーマを使っているので子テーマの中にアップします。

テーマcocoonの子テーマの中身の画像

テーマフォルダは、ワードプレスが入っているフォルダの中の「wp-content」の中の「themes」の中にインストールされているテーマが入っています。

固定ページの「属性」を変更する。

固定ページの「属性」を変更することで「example.php」の内容が表示されます。

ワードプレスの管理画面へ行き、固定ページを作る場所を表示します。

固定ページの右側に「ページ属性」というタブがあります。

そこの「テンプレート」を変更します。

最初に「example.php」の中に記述した「 Template Name: オリジナルデザインの固定ページ」の「オリジナルデザインの固定ページ」が表示されます。

自分が付けた「Template Name」が表示されるの、作るデザインによって変えましょう。

ページ属性の中のオリジナルデザインの固定ページを選択している画像

これでオリジナルデザインの固定ページが表示出来るようになります。

「example.php」に好きなようにHTMLを記述してみてください。

おわり

これにて完了です。

いかがでしょうか?意外と簡単に作れてしまいます。

bootstrapやホームページビルダーなどでHTML、CSSを書き出して入れることも可能です。

Webサーバーにアップする時は既存のファイルを更新しないように気を付けましょう。

おわり

タイトルとURLをコピーしました