内容をスキップ

製造業・メーカー企業のコンサルティング、Web制作、BtoBマーケティング

製造業BtoBデジタルマーケティング│OH26株式会社
  • サービス一覧
  • デジタルマーケティング
    • デジタルマーケティング
    • お試し診断
    • MAツールBowNow
    • SEOツールAhrefs
    • Google対策(SEO)
    • WordPressプラグインElementor
  • Web制作
  • 実績
  • ダウンロード
  • 会社概要
  • メタバース
お問い合せ
お問い合せ
製造業BtoBデジタルマーケティング│OH26株式会社

エレメンター小技(4) 画像ボックスのタイトルだけを左寄せにする

Home » Web制作 » Elementor動画講座 » エレメンター小技(4) 画像ボックスのタイトルだけを左寄せにする

画像ボックスのタイトルだけを左寄せにする

Webページを制作する上でとても便利なElementorですが、細かなレイアウト調整が効かなくて困ったことはないでしょうか?

例えばこんな『画像ボックス』でのこんな場面↓

画像をセンター寄せ

画像をセンターに置きたいけど、タイトルやテキストは左寄せにしたいって場面は多いと思います。センター揃えは、日本語ですと変なところで改行されて読みづらい時がありますからね。ですが、Elementorの機能では、テキスト部分だけを左寄せにすることはできません。テキストを左寄せにするには、画像ごと左寄せにするしかありません。

テキストを左寄せ

CSSでタイトル(または説明文)を左寄せにする

Elementorで編集できない部分は、CSSで編集する必要があります。Elementorで制作したページのidやclassを探すにはChromeのデベロッパーツールが便利です。

デベロッパーツールの使い方

Ctrl+Shift+iでデベロッパーツールを開きます。下記添付の順で該当箇所のclassを探すことができます。

デベロッパーツールの使い方

class名がわかったら、Elementor編集画面の『サイト設定』>『カスタムCSS』でCSSを編集します。

タイトルや説明文を左寄せ

これで画像ボックスでセンター寄せを選択しても、タイトルや説明文を左寄せにできます。

Elementor 動画講座一覧へ

Elementorに関する記事の更新情報などをお届けしています。ぜひご登録ください↓

  • 製造業ホームページ制作はこちら

関連記事

メーカー企業、製造業のためのMETAディスクリプションの書き方

記事を読む »
Astra Theme アストラテーマ

WordPressテーマAstraのスターターテンプレートとElementorで見栄えの良いWebサイトを一瞬で作成する

記事を読む »
プレゼンテーション

Elementor(エレメンター)とは

記事を読む »
エレメンター3カラム

エレメンター小技(3) テキストの内容量が違っても上下が揃う3カラム作成

記事を読む »
headやbodyにタグを入れる

エレメンター小技(2) Elementorで作ったWebサイトのheadやbodyにタグを挿入する

記事を読む »
エレメンターの小技 スクロールするスクショ

エレメンター小技(1) スクロールするスクリーンショットの作り方

記事を読む »
  • Web制作TOP
  • Elementor(エレメンター)とは
  • SEO・検索対策について
  • 製造業 Web制作について
メニュー
  • Web制作TOP
  • Elementor(エレメンター)とは
  • SEO・検索対策について
  • 製造業 Web制作について

Home » Web制作 » Elementor動画講座 » エレメンター小技(4) 画像ボックスのタイトルだけを左寄せにする

Web施策優先度診断
Elementor カテゴリー
  • ElementorとSEO (1)
  • ElementorとWeb制作マネジメント (0)
  • Elementor動画講座 (6)
  • SEO・Google対策 (1)
Elementor 新着記事
CSVを読み込んで表を作成する
ElementorプラグインPowerPackで、CSVを読み込んで表を作成する
2022年9月1日
画像ボックスのタイトルだけを左寄せにする
エレメンター小技(4) 画像ボックスのタイトルだけを左寄せにする
2022年2月4日
エレメンター3カラム
エレメンター小技(3) テキストの内容量が違っても上下が揃う3カラム作成
2022年1月29日
FAQスキーマ
WordPress Elementorと構造化マークアップ(FAQリッチリザルト編)
2022年1月26日
ニュースレター 代表 小野の「デジタルの舞台裏」

技術に対話を起こし、 より良い世界に貢献する。

BtoB専門 & 中小企業向けの、Webコンサルティング、MAツール導入、Web制作会社です。ものづくり企業がITを活用して営業を強化することを専門としています。

  • 187-0032 東京都小平市小川町1-2591-18
  • 042-508-2904
  • info@web-keiei.com
  • サービス一覧
  • デジタルマーケティング
    • デジタルマーケティング
    • お試し診断
    • MAツールBowNow
    • SEOツールAhrefs
    • Google対策(SEO)
    • WordPressプラグインElementor
  • Web制作
  • 実績
  • ダウンロード
  • 会社概要
  • メタバース