Elementor Proでトップページに新着投稿一覧を作ってみる

Elementor Proで投稿一覧を作成する場合、「ポスト」の機能を使うことで簡単に設置することが出来ます。

WordPressでエレメンタープロを有効化している状態が必須です。
無償版では設置することが出来ません。

投稿一覧を作成する

前提条件として、図のような投稿サンプルを5個作ってみます。
これらの投稿には「タイトル」「アイキャッチ画像」「本文」があります。

投稿新着一覧を入れたい場所へ、左側のメニューから「ポスト」を選択して、挿入します。

挿入するだけでも図の様に、投稿一覧が自動で作成されることが分かります。
こちらの場合はスキンが「Classic」になります。

スキンを「Cards」にすると図のようになります。

スキンを「Full Content」にすると図のようになります。

一例でClassicを調整してみる

コンテンツのカスタマイズ

スタイルのカスタマイズ
ボックスの様々な調整が可能です。
図の場合は、ボーダー・ボックスシャドウドウなどを入れてみました。

さいごに

ワードプレスでテーマを作成していた経験や、コーディング経験がある場合、投稿一覧が
「こんなに簡単に調整できちゃうのか・・・」
という感想が第一に来ると思います。

カラム数や投稿の表示数などサイトデザインにあうよう色々と調整してみてみてください。

画像の位置や順番などカスタマイズをかけたい場合は、プラグイン「Elementor Custom Skin」を使うことでさらに柔軟な調整が可能となります。「Elementor Custom Skin」を使ったカスタマイズについては以下の記事にて取り上げています。

2023.06.28

Elementor Proで投稿一覧をカスタマイズする「Elementor Custom Skin」

Elementor Proでは投稿一覧を簡単に設置することが可能ですが、デザインにこだわりがある場合など、細かいカスタマイズをすること...