【初心者OK スキル不要】
0から作るパーソナルトレーニングジムのホームページ制作

ワードプレスで動画を見ながら一緒に作ろう

↓↓このホームページを一緒に作ろう↓↓
(1日完成)

難易度
2/5

POINT

ホームページ作成準備編

0かのスタートの場合:
NO1よりスタート
ワードプレスの準備が整っている場合:
制作編からスタート

( )は動画時間

1.ワードプレステーマ設定

テーマとはホームページを構成するスキンのような物です。車で例えるならボディー(外枠)のようなイメージです。ワードプレスにテーマ(ボディー)を入れ、ボディー(テーマ)の中に配置を考えながらハンドル(写真)やシートなど(文章、ボタンなど)のパーツをはめ込んでいきます。このパーツを簡単にはめ込みやすくする「テンプレのようなツール」をプラグインといいます。また車はボディーによって注目度が上がったり、パーツによって操作性が変わったりしますが、ワードプレスでもテーマやプラグインによって大枠が変わったりSEOが向上したりします。それらを踏まえお勧めなテーマが「emanon」です。特に有料版の「emanon Pro」は抜群に操作性、SEOに優れてますが、無料版でも十分に効果を得ることが可能です。(後からいつでも無料版から有料版への変更も可能です。)

動画を見ながら簡単設定(動画2分40秒)

この動画は無料テーマの「emanon」をダウンロードしワードプレスに設定するまでの動画です。

2.プラグインの設定

テーマの項目でプラグインの説明を致しましたが、ワードプレスで無料で利用できるプラグインは数多く存在します。必要に応じ利用することによって簡単にホームページの制作が可能になります。この動画はワードプレスに最低限必要な無料で利用できるプラグインをダウンロードし設定する動画となっています。

文章の1文字1文字にそれぞれ装飾(色、下線、太さなど)ができたり、文章にリンクをつけることができたり、表(エクセル)を挿入することができるプラグインです。
https://ja.wordpress.org/plugins/tinymce-advanced/

お問合せフォームを作成するのに非常に便利なプラグイン。
https://ja.wordpress.org/plugins/contact-form-7/

HTMLやPHPなどの知識がなくても直観的にホームページが作成できるプラグインで、非常に汎用性の高い枠組みのテンプレートが配置でき、その枠組みに組み込む様々なコンテンツを利用できるスーパープラグインです。(有料版にすると多くのコンテンツがプラスされている)
https://ja.wordpress.org/plugins/elementor/

複数のページを作成するときに便利なプラグインで作成したページを複製することができます。その為1ページ作成してしまえば、それを複製し内容を変更するだけで済むため制作効率が格段に向上致します。
https://wordpress.org/plugins/duplicate-page/

動画を見ながら簡単設定(動画3分30秒)

3.ワードプレスに素材(写真)挿入

ワードプレスに事前に写真や動画などのメディアを入れておくことでホームページ作成中に必要に応じて簡単に画像をはめ込むことが可能となります。作成しながら都度画像を選びはめ込んでいく事も可能ですが、作成の事前準備の段階でフリー素材や自身でストックしている写真から作成予定のホームページに合いそうな画像をある程度事前に決め、ワードプレスに入れておくことでホームページの作成効率が断然上がります。

動画を見ながら簡単設定(動画1分)

ワードプレスに事前に画像を設定します。

4.elementor/ヘッター/フッター設定

プラグインのelementorでは最初にテンプレートの設定が必要です。ヘッターはホームページの最上部、フッターは最下部を指します。この2か所は通常のページとは違う作り方をします。SEOに直結する箇所でもあるため非常に重要になります。

動画を見ながら簡単設定(動画3分30秒)

5.TOPページ作成その1

↓↓この部分を作成します。↓↓

【動画でまねるだけ】0から作るパーソナルトレーニングジムのホームページ制作(top-1)

動画を見ながら簡単作成(動画8分)

6.TOPページ作成その2

↓↓この部分を作成します。↓↓

【動画でまねるだけ】0から作るパーソナルトレーニングジムのホームページ制作(top-diet)

動画を見ながら簡単作成(動画11分30秒)

7.TOPページ作成その3

↓↓この部分を作成します。↓↓

【動画でまねるだけ】0から作るパーソナルトレーニングジムのホームページ制作(top-monthly)

動画を見ながら簡単作成(動画3分30秒)

8.TOPページ作成その4

↓↓この部分を作成します。↓↓

【動画でまねるだけ】0から作るパーソナルトレーニングジムのホームページ制作(無料体験)

動画を見ながら簡単作成(動画7分30秒)

9.TOPページ作成その5

↓↓この部分を作成します。↓↓

【動画でまねるだけ】0から作るパーソナルトレーニングジムのホームページ制作(trainer)

動画を見ながら簡単作成(動画3分30秒)

10.TOPページ作成その6

↓↓この部分を作成します。↓↓

【動画でまねるだけ】0から作るパーソナルトレーニングジムのホームページ制作(access)

動画を見ながら簡単作成(動画12分)

11.ダイエットコースページ

↓↓この部分を作成します。↓↓

【動画でまねるだけ】0から作るパーソナルトレーニングジムのホームページ制作(diet)

動画を見ながら簡単作成(動画10分)

12.マンスリーコースページ

↓↓この部分を作成します。↓↓

【動画でまねるだけ】0から作るパーソナルトレーニングジムのホームページ制作(monthly)

動画を見ながら簡単作成(動画3分)

13.お問合せページ

↓↓この部分を作成します。↓↓

【動画でまねるだけ】0から作るパーソナルトレーニングジムのホームページ制作(contact)

動画を見ながら簡単作成(動画5分)

14.メニューバーと最終調整

↓↓この部分を作成します。↓↓

【動画でまねるだけ】0から作るパーソナルトレーニングジムのホームページ制作(TOP)

動画を見ながら簡単作成(動画6分)

BETA

BETA

ホームページ制作スタジオ「madeinSUL」でクリエイターをしているBETA(ベタ)です。「気軽に簡単!スキル0からのホームページ制作」をテーマにしたブログ「With Me」をスタートしました。今後いろいろなパターンのホームページ作成記事を掲載していく予定です。

ホームページのご用命はこちら