わざわざカラムを分ける必要なし!テキストの「段組み(カラム分割)」機能

Elementor で長文を配置した時、「画面の端から端まで文字が続いて、なんだか読みにくい…」と感じたことはありませんか? 新聞や雑誌のように文章を2列や3列に分けたい場合、わざわざカラムを複数作ってテキストを分割する […]
スクロールで背景が動く!プロっぽい「パララックス(視差効果)」の作り方(後編)(※Elementor Pro)

前回の基本編では、背景をピタッと固定する視差効果を解説しました。 今回はその後編として、Elementor Proの機能を使ったさらに本格的なパララックスの作り方をご紹介します! スクロールに合わせて背景画像が「ゆっくり […]
スクロールで背景が動く!プロっぽい「パララックス(視差効果)」の作り方(前編)

Elementor でサイトを作っていて「背景画像がただ置いてあるだけで退屈…」と感じていませんか? そんな時におすすめなのがパララックス(視差効果)です。スクロールした時に、手前の文字と奥の背景画像が違うスピードで動く […]
ファーストビューに最適!画面ぴったりに表示する「100vh」の設定

サイトを開いた瞬間に飛び込んでくる最初のエリア、ファーストビュー。ここがパソコンやスマホの画面サイズにぴったり収まっていると、一気に洗練されたデザインになりますよね。実はElementor なら、難しいコードを使わなくて […]
Elementorで文字をくるっと丸く曲げる!テキストパスの活用法

タイトルや見出し部分で「期間限定!」のような文字を、くるっとカーブさせて配置したいと思ったことはありませんか? 画像編集ソフトがないと無理かな… と諦める必要はありません!Elementor 標準の、テキストパスウィジェ […]
スマホで崩れない!「アイコンボックス」でサービスの強みを綺麗にレイアウト
ホームページで3つの特徴や選ばれる理由を作る時、画像とテキストを別々に配置していませんか? PCでは綺麗でも、スマホで見ると位置がズレてレイアウトが崩れやすいですよね。そんなお悩みを一発で解決するのがアイコンボックスウィ […]
サイトがプロっぽくなる!「ホバーアニメーション」の作り方

Elementorでサイトを作っていて、「なんだか動きがなくて物足りない…」と感じていませんか?そんな時におすすめなのが「ホバー(Hover)アニメーション」です。ホバーとは、パソコンでボタンや画像の上にマウスカーソルを […]
Elementor 制作の見出しのHTMLタグ(H2・H3)の基本

Elementor で見出しを作る時、テキストウィジェットの文字サイズをただ大きくして目立たせていませんか? 実はそれ、見た目は綺麗でも、Googleの検索エンジン(SEO)には見出しとして認識されていません。検索順位を […]
スクロールしてもついてくる!追従(sticky)ヘッダー(※HappyAddons)

縦に長いページを読んでいる時、画面の一番上に常にヘッダーメニューが表示されているサイトを見たことがありませんか?これは「追従ヘッダー」と呼ばれ、ユーザーがいつでも他のページへ移動できるため、サイトの使いやすさが格段に上が […]
余白作りに「スペーサー」ウィジェットを多用してはいけない理由

Elementorでウィジェットの間にすき間を空けたい時、便利な「スペーサー」ウィジェットをポイポイと置いていませんか?直感的にすき間を作れるので初心者には大人気ですが、実はこれを多用すると、後々「取り返しのつかない修正 […]