スマホアプリ(App)開発を行なっていますが、公開にあたり、ストアでの申請手続きに、自身のHPでプライバシーポリシーの公開が必須項目となっています。当時、必要最低限のものを作成して公開しましたが、予想以上に労力と期間を要してしまいました。
同様のことで苦労される方も多いのではないかと考え、今回自身のHP(以降、ランディングページまたはLP)を一新するにあたり作成手順を自身の備忘録も兼ねて公開することとしました。
前回もWordPressを利用しましたが、海外の定評のある某テーマを購入し、テンプレートをベースに作成しました。今回もWordPressですが、デザイン性や作成の自由度から、Elementorを使って、テンプレートは参考程度に、一から作成しました。
もちろんノーコードでHTMLやCSSなどの知識不要で、初心者の方でも無理なく読み進めるようになっております。
アプリ公開に必要なランディングページ作成までは、Elementorは無料版のみで作成しています。ブログ(本ページ)部分はElementor Pro (有料版)も使用して作成しています。
ここでは競合ツールなどを網羅的にカバーして比較評価を行うようなことはしていませんが、比較検討の結果、デザイン、カスタマイズや導入のし易さなどから個人的にベストと考えられる環境やツールを使って、最短で作成できるよう手順を説明していますので、皆様の参考になれば幸いです。
・独自ドメイン:ムームードメイン
・レンタルサーバー:ロリポップ!
・ブログ作成サービス:WordPress
・WordPress Theme:Hello Elementor
・WordPressプラグイン
- Elementor(ページビルダー)
- Essential Adonis for Elementor (ヘッダー)
- MetForm(お問合せフォーム)
- Polylang(多言語)
※プラグインは全て無料版のみを使用
①ムームードメインにアクセスして、アカウントの新規登録を行います。
②「ドメインを検索する」をクリックします。
③希望のドメインを入力し検索 例:hogehoge3 など
④取得可能なドメインが金額とともに表示されるので、希望のものをカートに入れます。新規取得費用だけでなく、更新費用もチェックしてから選びましょう。hogehoge3.com の例ですと、年間で新規999円、更新1728円となります。
⑤希望のドメインを「カートに追加」します。
⑥「お申し込みへ」をクリックして進みます。
※サーバー契約で0円という選択肢がありますが、今回サーバーはロリポップで契約しますので、選択しません。
⑥「お支払い価格」を確認、「お支払い方法」を入力して、「次のステップへ」をクリックします。
⑦利用規約を確認して、「下記の規約に同意する」にチェックを入れて、ドメインを取得します。
ドメイン取得後も アカウント > コントロールパネル から確認や一部変更ができます。
⑧ドメイン情報認証には24〜72時間程度かかるとのことです。ドメイン操作 > ドメイン一覧 に対象ドメインがあり、未認証ドメイン一覧に「現在未認証ドメインはありません」と表示されていれば手続きは完了です。
①ロリポップ!レンタルサーバー(https://user.lolipop.jp) にアクセスします。
②サーバープランを選択し、アカウントの新規登録を行います。プランはWordPressが必要なため、ライト以上を選択します。特別なニーズがなければ、ライトをおすすめします。
③ロリポップ!のドメインを設定します。
④枠内に文字列を入力し、「URLの末尾を変更する」をクリックして末尾も変更します。
※独自ドメインを設定する場合は、このアカウント名はサーバーへのアクセスの際に利用するだけのものです。独自ドメインを設定する場合は、独自ドメインでもアクセスできるようになりますので、適当なもので構いません。独自ドメインを設定しない場合は、ランディングページのURLとして公開されます。
⑤その他、必要項目を記載し、アカウント作成を完了させます。
①ロリポップ!(https://user.lolipop.jp)にアクセスします。
②「ロリポップ!のドメイン」を選択し、契約時に設定したドメイン(例:hogehoge3.ciao.jp)とパスワードでログインします。
③サーバーの管理・設定 > 独自ドメイン設定にアクセスします。
④ムームードメインで取得した独自ドメインを設定します。
①サイト作成ツール > WordPress簡単インストール にアクセスします。
②WordPressのインストール先・設定の各項目を入力
入力内容は以下の通りです。
インストール先
WordPress設定
③「入力内容を確認」をクリックして、インストールを完了させます。
① ダッシュボード > セキュリティ > 独自SSL証明書導入 にアクセスします。
②「無料独自SSLを設定する」をクリックします。
③「SSL保護されていないドメイン」にドメインが表示されます。
④対象ドメインにチェックを入れ、「独自SSL(無料)を設定する」をクリックする。
⑤設定が完了すると「SSL保護有効」となり、「SSLで保護されているドメイン」に移動します。
⑥独自SSL設定後は、URLが変わりアクセスできなくなります。WordPressのサイトや管理画面のURLは、以下から確認できます。
サイト作成ツール > WordPress簡単インストール > WordPressインストール履歴
URLの冒頭が https:// になっていれば、独自SSLの設定は完了です。
⑦設定 > 一般設定 にアクセスする
※以降はWordPressでの設定です。
WordPressの管理者ページにアクセスします。
⑧「WordPress アドレス (URL)」と「サイトアドレス (URL)」を「https://」から始まるURLに修正し、保存する。
①セキュリティ > WAF設定 にアクセスします。
⚠️ 設定変更を「無効にする」をクリックし、設定状態を「無効」にします。WAFが有効だと、この後のElementorでの編集ができませんので注意してください。