무료 WordPress ページビルダーElementorを使用してランディングページを作成する

Elementorページビルダーとは

Elementorは無料で使用が可能なオープンソースのライブページビルダープラグインであり、コーディングの知識がなくても簡単に目的のWebサイトを作成することができます。 このビルダーを使用して、ユーザーは、既存の WordPress テーマや外部のテーマをカスタマイズ（ユーザー定義）することができます。

ちなみに数年前までしか Visual Composer多くの人気を集めましたが、ビーコンはそれほど良いプラグインではありません（WordPress ページビルダーの長所と短所 注）。 最近、Elementorが人気を集めている Jupiterのように Visual Composerを捨ててエレメンタを基本ビルダーを採用するテーマが増えて BeTheme, Bridgeのようなテーマはエレメント用のデモを追加しました。

エレメンプロでは、プロウィジェットとプロテンプレートに加えて、ヘッダーからフッターまで、サイトのすべての要素をカスタマイズできるテーマビルダーを提供しています。

• エレメンキットライブラリ（Elementor Kits Library）を使用する
• WordPress Elementor Proライセンスを有効にする

Elementorページビルダーでランディングページを作成する

このページビルダープラグインは非常に簡単に使用が可能です。 この記事では、Elementorでランディングページを作成する方法について説明します。 Elementorを使用してランディングページを最初に作成する場合は、この文が助けになります。

ステップ1：Elementor Page Builderのインストール

まず、 WordPress 管理者パネルにログインして、サイドメニューから プラグイン>プラグインを追加する オプションをクリックします。

プラグイン・ライブラリからElementorを検索します。 Elementor Page Builderアイテムを見つけ、「今すぐインストールする"をクリックします。

または、Elementorウェブサイト https://elementor.comでElementorを直接ダウンロードした後に プラグインのアップロード 機能を使用してアップロードすることができます。

Elementorプラグインがインストールされると、活性化を押してElementorを有効にします。

ステップ2：Elementorエディタ

サイドバーのメニューに移動し、 ページ>新しいページを追加をクリックして、新しいページを作成します。 ページのタイトルを入力して保存し、「Elementorと編集」を選択してください。

Elementorエディタが初期化される下図のように多くの機能が含まれているElementorエディタが表示されて、必要に応じページをカスタマイズすることができます。

ステップ3：あらかじめデザインされたテンプレートを使用する

Add Template（テンプレートの追加）をクリックするか、左の一番下のファイルのアイコンをクリックして、 テンプレートライブラリを選択すると、事前にデザインされたテンプレート画面が表示されます。

目的のテンプレートを選択して、Insertをクリックして挿入します。 テンプレートがロードされると、必要に応じ修正が可能です。

ステップ4：最初から新しいページデザインする

最初から新しいページをデザインすることもできます。 サイドバーのメニューに移動し、 ページ>新しいページを追加をクリックして新しいページを作成します。 ページのタイトルを履歴し、Elementorと編集」をクリックします。

Elementor Editorがロードされると、Elementsタブのさまざまなコンテンツブロックをドラッグして、必要に応じて編集します。

現在、次のような要素（Element）が提供されます。

• Columns（カラム）
• Heading（タイトル）
• Image（画像）
• Text Editor（テキストエディタ）
• Video（ビデオ）
• Button（ボタン）
• Divider（ディバイダ）
• Spacer（スペーサー）
• Google Maps（グーグルマップ）
• icon（アイコン）
• Image Box（画像ボックス）
• Icon Box（アイコンボックス）
• Image Gallery（ギャラリー）
• Image Carousel（画像カルーセル）
• Icon List（アイコンリスト）
• Counter（カウンター）
• Progress Bar（進行状況バー）
• Testimonial（使用期限、経験談）
• Tabs（タブ）
• Accordion（アコーディオン）
• Toggle（トグル）
• Social Icons（ソーシャルアイコン）
• Alert（警告表示）
• SoundCloudが
• Shortcode（ショートコード）
• HTML
• Menu Anchor（メニューアンカー）
• Sidebar（サイドバー）
• 加えて、 WordPress 要素：ページ、カレンダー、記事リスト、オーディオ、画像、ビデオ、その他の機能、検索、テキスト、カテゴリー、最新記事、最新コメント、RSS。 タグクラウドは、カスタムメニュー、カスタムHTML

他にも Elementorプロ バージョンでは、より多くの機能が提供されるとね。

ステップ5：空白のページにキャンバステンプレートを使用する

空白のページにキャンバステンプレートを使用するには、 WordPress 伝言板>ページ>新しいページを追加するを選択する必要があります。 ページのタイトルを入力した後、ページの右側の[テンプレート]ドロップダウンから Elementor Canvasを選択し、「Elementorと編集」をクリックします。

ステップ6：新しいセクションを追加する

新しいセクションを非常に簡単に追加することができます。 Elementorエディタで「Add Section」を選択するようにします。

希望の構造を選択すると、セクションが追加されます。

ステップ7：2列を追加する

要素 タブで「コラム「オプションを選択して新しい列を追加することができます。

希望カラム構造を選択すると、新しい列が作成されます。

新しい列が追加されると セクション編集 タブの[追加のオプションを設定して、カラムをカスタマイズすることができます。

手順8：タイトル（見出し）を追加する

要素 タブで「見出し「オプションを選択して、新しいタイトル（見出し）を追加することができます。

その後、 セクション編集 タブの[追加のオプションを設定して、タイトル（見出し）をカスタマイズすることができます。

手順9：画像

パネルで「画像「ウィジェットを選択して、新しいイメージを追加することができます。

今 Edit Image와 スタイル タブの[追加のオプションを指定して画像をカスタマイズすることができます。

手順10：ボタンを追加する

要素 タブで「ボタン「オプションを選択して新しいイメージを追加することができます。

同様にEdit Button]タブで、追加のオプションを指定して、ボタンをカスタマイズすることができます。

※7段階以下から写真がすべて壊れて削除しました。 （いくつかの理由でわからない写真がサーバーから削除されましたね。おそらくサムネイル再生成プラグインを使用する過程で削除されたようです。）Elementorページの編集方法を次の記事で確認することができます。

• WordPress Elementorページビルダーで作られたページを変更する方法

最後に、

様々なツール（要素）を提供する Elementorページビルダーは無料ですが、高い完成度を示すようです。 通常のページビルダーは、サイトの読み込み速度に悪影響を及ぼしますがElementorは、サイトの速度をあまり低下させないですね（個々のサイトに基づいて異なる場合があります）。

ページビルダーは使用しないことが最も理想的だが、レイアウト作業のためのページビルダーを使用する場合は無料ページビルダーであるElementorを考慮してみることができるようになります。

メモ：

• Elementorページビルダーを使用している WordPress テーマ
• 무료 WordPress ページビルダーElementor Page Builder
• Avadaはなぜ人気があるのか​​？