みなさんこんにちは。
タイトルの通り、コードを書いたり、難しい文字の羅列をあまり見る必要のない形でWordPressにてWebサイトを作ろうと思います。
今回はWixさんとかStudioさんだとダメな案件の場合、参考になるかもしれません。
1 作成にあたり参考にしたサイト
Elementorでレスポンシブ対応 Elementor Fan様
https://elefantastic.tokyo/responsive/
Elementor – レスポンシブ機能の使い方 NoCodeWeb様
https://nocodeweb.jp/elementor/how-to-use-responsive/
2 筆者が使ったもの
Windows10のPC 1台
Local by flywheel（ローカル環境に簡単にWordPress環境を構築できるソフト）※要インストール
Starサーバーフリー
WordPressのプラグイン（以下）
Elementor （パーツを組み合わせてページを作れるプラグイン）
Advanced Editor Tools(ページ上で表を作りやすくするプラグイン）
All in One WP Migration(ローカルからサーバー上に移行するプラグイン）
以下お好みにあわせて
Disable Comments（コメント機能の一括停止）
Akismet Anti-Spam（スパムコメントの対策）を追加 ※コメントを受け付ける場合
Hide Page And Post Title(タイトルを隠すプラグイン）
Jet Pack（アクセス解析などを簡単にできるプラグイン）
Contact Form7（よくあるお問い合わせフォームを簡単に作れるプラグイン）
3 流れ
Starサーバーフリーのアカウント作成（使うサーバーは好きなところで大丈夫 もちろん有料サービスのほうが良い）
↓
Local by flywheelのインストール
↓
Local by flywheelのローカルページの作成
↓
必要なプラグインの設定
↓
実際のページの作成
・テンプレートの検討
・掲載内容の検討
↓
スターサーバーへの移行
↓
表示の高速化、SEO対策等実際の環境でしか対応できないものの調整
↓
公開！
4 作成方法
書いている途中ですが、上記のプラグインとかソフトをGoogle先生にきけばできちゃうかもしれません。
あくまで筆者が行った方法なのでエキスパートな皆さまからツッコミどころ満載かもしれません。
基本的に筆者が参考にしたサイトさんのリンクを張り、補足する形です。
Starサーバーフリーのアカウント作成
今回はStarサーバーフリーを利用します。選定理由は筆者が使い慣れているという理由だけ。
記事を読まれているみなさんの好きなサーバー業者さんで構いません。
https://www.star.ne.jp/free/
リンクをクリックして「今すぐ始める」ボタンをクリックして登録してください。
使うのはフリー PHP+MySQLというプランです。
↓
Local by flywheelのインストール
https://localwp.com/
にアクセスして右上の「DOWNLOAD」ボタンを押してください。
PCに慣れている方であれば英語表記ですがそこまで苦もなくインストールが可能なはずです。
念のためインストール手順を紹介しているサイトさんのリンクをはります。
ローカルページの作成まで解説をしてくれているので、不安な方はあわせてご確認を。
超簡単にローカル環境が構築できるLocalbyFlywheelの使い方 バズ部様
https://bazubu.com/local-by-flywheel-33920.html
↓
Local by flywheelのローカルページの作成
これも先ほどのリンクを参考にして作成してください。
Wordpressのユーザー名とパスワードに関しては実際のサーバー上でも使うことになるのでちゃんとしたものをおすすめします。
（筆者はテキトーなユーザー名とパスワードで作ったのでサーバー上にあげてから変えたのでちょっとこわかった）
超簡単にローカル環境が構築できるLocalbyFlywheelの使い方 バズ部様 （記事中段）
https://bazubu.com/local-by-flywheel-33920.html
↓
WordPressプラグインのインストール
WordPressのプラグインをインストールする方法【WordPress初心者向け】 TechAcademy マガジン様
https://techacademy.jp/magazine/1384
今回使うプラグインは
Elementor （パーツを組み合わせてページを作れるプラグイン）
https://ja.wordpress.org/plugins/elementor/
All in One WP Migration(ローカルからサーバー上に移行するプラグイン）
https://ja.wordpress.org/plugins/all-in-one-wp-migration/
この２つは今回のやり方では必須です。
あと忘れてはいけないところで、Wordpress はオープンソース（誰でも開発に関わることができる）のため、クラッキングの（俗にいうハッキング）対策が必須です。
参考
【2021】WordPress制作の「セキュリティが不安」はこれで対策しましょう！基本のセキュリティ対策14選。 スカイゴールド株式会社様
https://skygold.co.jp/web/wordpress/6486
不慣れな方で一番手軽なのはプラグインを導入する方法です。
SiteGuard WP Plugin
https://ja.wordpress.org/plugins/siteguard/
使用方法
WordPress「SiteGuard WP Plugin」の設定方法と使い方 WEBST8様
https://webst8.com/blog/wordpress-siteguard/
以下のプラグインは作りたいサイトに求める機能によって必要かどうかが変わります。
必要になる可能性が高いものをリストアップしましたので参考にしてください。
Disable Comments（コメント機能の一括停止）
Akismet Anti-Spam（スパムコメントの対策）を追加 ※コメントを受け付ける場合
Hide Page And Post Title(タイトルを隠すプラグイン）
Jet Pack（アクセス解析などを簡単にできるプラグイン）
Contact Form7（よくあるお問い合わせフォームを簡単に作れるプラグイン）
実際のページの作成
記事をご覧の皆様が一番やりたかったステップにようやくきました。
今回コードを書いたり難しいことをしなくてすむようにしてくれる魔法のプラグイン、
Elementorを使い、実際にページを作っていきます。
まず、デザインの土台になるテーマですが、Elementorと相性の良いものがあるのでそれを使うのをおすすめします。
筆者はガン無視しましたが
作りたいデザインに近いテーマを探して、それをたたき台にして作るのが手っ取り早いかと思います。
以下の参考にしたサイトさんはスクリーンショットつきで紹介してくれているので好みのものを探しましょう。
参考
WordPressのテーマの選定 K CLUB MARKETING 様
https://kohsukenemoto.com/elementor/free-themes-for-elementor/
実際に使いたいテーマが見つかったらWordpressにインストールしましょう。
念のため、セキュリティ対策の一環としてデフォルトと今回選んだテーマ以外のテーマは消しておくのがおすすめです。
インストール方法
WordPressのテーマをインストールする方法【WordPress初心者向け】 TechAcademyマガジン様
https://techacademy.jp/magazine/1371
続きは後日。