【WordPress】無料の「Elementor」を使ってLPの背景に画像を挿入する手順【実践編1】2019.07.17ブログ運営ツールLPとは、広告費をかけたキャンペーン、新しい商品・サービスの訴求、アフィリエイトのペラサイトなど様々な場面で使える形式のウェブサイトページのことをいいます。Webで集客や商品の販売をするには「非常に効果的」な方法なので、出来るだけ簡単に作る方法は覚えて損のないスキルです。私はコードの知識はほとんどありませんが、下記のようなページを作ることが出来ました。完成図サンプルhttps://www.liberta-corp.jp/lp-sample/今回はこのようなLPをWordPressでオシャレに作る方法についてご紹介します。LP作成には画像の配置が大切Elementorで画像の上に文字を書くこのような画像の上に文字を書いたり、ボタンを設置するのもCSSでコードを書かなければできませんが、Elementorを使えば非常に簡単に対応できます。画像のサイズも指定できるので、解像度の高い大きめのサイズでも大丈夫です。セクションの背景設定を行う1セクション上部の四角が六つ重なった部分をクリック2セクションの編集画面が開くので、「スタイル」から背景に画像を挿入する。このような手順で画像を背景に挿入することが可能です。背景画面の表示設定をする背景画像の設定がデフォルトだと、上記の画像のように画面が繰り返しになってしまったり、画像がズレてしっまたりしているので設定を加えます。【繰り返し】繰り返しなし【サイズ】カバーに設定すると良いでしょう。テキストエディターでテキストを挿入する画像が上手く背景に挿入できたら、いよいよテキストを入力します。テキストエディターというウィジットを使えばテキストを通常の固定ページと同じように入力することが可能です。ここではテキストリンクや、文字の大きさ指定も出来るので色々試しながら書き込んでみてください。背景オーバーレイを設定する今回のような明るい画像を背景にしたとき、文字が読みづらくなってしまいます。そこで背景オーバーレイを使い画像全体を少し暗くすることで文字を目立たせます。背景オーバーレイ後このように画面全体を暗くしたり、色を加えることで文字を目立たせることが出来ます。通常のサイトよりも文字情報の少ないLPサイトでは、画像の使い方が非常に大切になってきます。逆に言えば、同じ情報でも画像の配置や選び方、配色でサイト全体のデザインを良くすることが出来るんですね。私はシャッターストックという画像サイトに登録して、著作権フリーの画像を常に集めています。シャッターストックURL:https://www.shutterstock.com是非、参考にしてみてください。次回はスマートフォンでの表示最適化(レスポンシブ)についてご紹介します。2019.05.23こんにちはリベルタの藤岡(@liberta_corp)です。2019.07.08ブログ記事を書くのにも様々なツールがあり、私も色々試してみた結果今はWordを利用してます。2019.05.24こんにちはリベルタの藤岡です。Mitsuki)1989年大阪生まれ。職歴を経て2019年29歳で独立。現在はWebマーケティングの情報発信、フリーランス・中小企業のSEO対策・コンサルティング業に従事。営業×コンテンツライティングが得意。WordPress.。