インターネット
 Computer >> コンピューター >  >> ネットワーキング >> インターネット

WordPressで美しい「近日公開(Coming Soon)」ページを作成する方法

多くのWebサイトでは、正式な公開前に「Coming Soon(近日公開)」ページを活用して、訪問者の期待感を高めています。サイトの立ち上げが近づいているものの準備がまだ整っていないなら、WordPressで美しい「近日公開」ページを作成する方法をご紹介します。

まず知っておきたいのは、「Coming Soon」や「メンテナンスモード」系のプラグインは数多く存在し、それぞれ機能や設定項目が異なるという点です。このチュートリアルでは、シンプルで扱いやすい「Easy Coming Soon」プラグインを採用しました。

SeedProdの「Coming Soon Page & Maintenance Mode」など、より多機能(かつインストール数も多い)なプラグインもありますが、今回は手軽さを重視しました。とはいえ、どのプラグインを選んでも、基本的な作成手順はほぼ同じですので安心してください。

Easy Coming Soonプラグインをダウンロード・インストール

管理画面にログインし、「プラグイン」→「新規追加」へ移動します。すでにダウンロード済みのプラグインファイルをアップロードしてもよいですし、検索ボックスで「Easy Coming Soon」と入力して探すこともできます。プラグインをインストールして有効化すると、一般設定ページが表示されます。

基本情報を入力する

最初の設定項目はステータス(Status)です。他の設定がすべて完了してから最後に有効化しても構いませんし、今すぐ有効化して変更内容を即座に確認することも可能です(Live Previewオプションでプレビューを確認することもできます)。

続いて、見出し(Headline)、説明文(Description)、Google Analyticsコード、Facebook・Twitter・Google+のURLを入力します。これらの項目はすべて任意なので、入力したくないものはスキップして問題ありません。入力が完了したら「Save」をクリックしましょう。

実は、一般設定だけでも十分に機能する「近日公開」ページが完成します。しかし、もう少し凝ったデザインにしたい場合は、「Design」「Templates」「Pro Features」(Pro版を購入している場合)の各ページからカスタマイズできます。

ページのデザインを調整する

デザイン設定ページでは、背景色、見出し・説明文のフォントカラー、サイズ、スタイル、さらに背景ノイズ効果などを細かく設定できます。

ここではデフォルト設定のまま進めましたが、それでも十分おしゃれな仕上がりになっています。もちろん、必要に応じて自由に変更できます。完了したら「Save」をクリックし、Live Previewページを開くか、ブラウザでサイトのトップページにアクセスして、現時点での見栄えを確認してみましょう。

通知機能を有効化する

必須ではありませんが、通知機能を有効にしておくと大変便利です。通知機能を使うと、訪問者がサイトを購読できるようになります。これは非常に有用で、いざサイトを公開する際には、関心を持ってくれたユーザーのメールリストがすでにできあがっているからです。「Notification Form Settings」ページから通知を有効化しましょう。

自分のメールアドレスやその他必要な情報を入力し、「Save Options」をクリックすれば、近日公開ページの作成はほぼ完了です。

近日公開ページをテストする

テストを行うまで、作業は正式には完了しません。別のブラウザ、つまり管理者としてログインしていないブラウザで確認する必要があるかもしれません(筆者の環境では、Linux上のFirefoxで管理者ログイン状態だと正しく表示されませんでした)。以下は実際の表示例です。

適切なプラグインを選べば、5分以内にミニマルな「近日公開」ページを簡単に作成できます。筆者は本当にミニマルにこだわり、装飾的な要素は省き、「Coming Soon」の情報と、購読候補者のメールアドレスを収集するためのメールフォームだけにしました。ただし、収集したいデータが他にある場合は自由に追加できます。ただし、盛り込みすぎるとページがごちゃごちゃしてしまい、重要な情報が埋もれてしまうので注意しましょう!

  1. WordPressで外部JavaScriptを結合する方法|HTTP/2時代のサイト高速化ガイド

    JavaScriptは、Webページに動的なコンテンツを表示させるためのプログラミング言語です。WordPressサイトでは、音声や動画の埋め込み、画像ギャラリー、インタラクティブなメニュー、カウントダウンタイマーなど、さまざまな場面でJavaScriptが活用されています。 JavaScriptファイルは拡張子「.js」で保存され、一般的なWordPressサイトでは、有効化されているテーマやプラグインによってページ内に読み込まれます。たとえば、テーマのトップページスライダーには「slider.js」が必要で、お問い合わせフォームのページには「form.js」が必要といった具合です。 現

  2. LinkedIn企業ページの作成方法を徹底解説|初心者向け簡単ステップガイド

    LinkedIn(リンクトイン)は、企業・団体・ビジネスパーソンのためのビジネス特化型SNSとして、リリース直後から急速に成長してきました。豊富な機能と直感的で使いやすいインターフェースにより、多くのユーザーから支持されています。個人プロフィールの作成は比較的簡単ですが、企業ページとなると「どう進めればいいの?」と悩む方も多いのではないでしょうか。 この記事では、自社のビジネス成長につながるLinkedIn企業ページの作成手順を、初心者にもわかりやすく解説します。 LinkedIn企業ページの作成手順 ステップ1:企業情報の入力 まず、ホームページ上部の「興味/関心」メニューにある「企業」タ