Elementorとは?ページ作成の基本紹介


そもそもエレメンターって何?

エレメンターはノーコードでWebサイトが制作できるツールです。
通常、サイト制作にはHTML, CSS, JavaScriptなど、コーディングの知識が必要となりますが、エレメンターを使えばコーディングは不要で簡単にサイトを制作できます。Webデザイナーや制作会社に依頼しなくても自分でサイト制作ができる点が近年ノーコードでの制作ツールが人気の理由のひとつです。

(インストールや初期設定やプラグイン、基本の説明はここでは割愛します)

このコラムでは、実際の制作手順についての紹介していきます。

新規ページを作成して、「Elementorで編集」を押すと作成ページに画面が切り替わります。
デザイン制作はここから始まります。





左側のアイコン付きのカードがウィジェットです。このウィジェットをドラッグ&ドロップで右のスペースで制作を進めます。
この右側の画面でライブプレビューのように制作ができます。
実装したい要素のウィジェットを設置していきます。
制作が初めての方は、最初は参考サイトやデザインを用意して、イメージを固めていくといいと思います。

参考デザインを探したり、優れたデザインのインプットを多くすることで、素敵に見えるWebサイトの共通点が見えてきます。



次回:ウィジェット設置する上での必要な知識。セクション(コンテナ)、カラムについて

recent post

スマホで崩れない!「アイコンボックス」でサービスの強みを綺麗にレイアウト

サイトがプロっぽくなる!「ホバーアニメーション」の作り方

Elementor 制作の見出しのHTMLタグ(H2・H3)の基本

スクロールしてもついてくる!追従(sticky)ヘッダー(※HappyAddons)

余白作りに「スペーサー」ウィジェットを多用してはいけない理由

Making Design Make Sense.
デザインを、感覚から理解へ。
© Design Decode. 901