こんにちは、ゆるミニマリスト主婦のくうかです。
当ブログはWordPressテーマ「SWELL」を使用しています。
前々から少し気になっていたワードプレスのブロック「メディアと文章」。
「メディアと文章」は画像と文章をおしゃれなレイアウトで配置できるので、本来はメディアの紹介のような形で使うものなんだろうと思います。

今回私はトップページのおすすめ記事に使用してみました。
簡単なブロックですが、導入の流れをご紹介します…!
WordPressメディアと文章ブロックでおすすめ記事を目立たせる
完成形はこのような感じです。

違う部分としては、投稿リストでは記事のアイキャッチ画像と記事の説明文を表示させますが、「メディアと文章」ブロックでは、好きな画像(もしくは動画)と好きな文章で組み合わせることができ、レイアウトも3種類(うち2種類はSWELL独自)から選択することができます。

他より目立たせたい部分に使うと効果的かもしれない!
メディアと文章、使い方の流れ

選択すると以下のようなブロックが貼り付けられます。

【メディアエリア】と【コンテンツ】に分かれていますね。
アップロードもしくはメディアライブラリから画像を設定します。

コンテンツ部分には、どのブロックでも利用することができます。
ブロックのレイアウトは3種類あります。
- 1. デフォルト
-
シンプルにデフォルト。
- 2. カード型
-
カード型。SWELL独自のレイアウトです。
- 3. ブロークングリッド
-
ブロークングリッド。こちらもSWELL独自のレイアウトです。
このレイアウトが気に入って、私はこちらを採用しています。
設定はあまりないのですが、こちらだけ。

モバイル表示の縦と横の比較です。
モバイル縦表示

モバイル横表示

縦も横も、見た目はいい感じですね^^
設定は以上で、非常に簡単なブロックとなっています。
SWELLでも機能を組み合わせると良きデザインに♪
SWELLでは、
— 了🌊SWELL・Arkhe 開発者 (@ddryo_loos) April 24, 2020
✅見出しタグの「セクション用」スタイル
✅メディアと文章ブロックの「カード型」や「ブロークングリッド」スタイル
を活用することでこういうデザインも構築できます🙌#wpswell https://t.co/HfWDrDn1p5
見出しブロックを使うと、またちょっと良い感じにカスタマイズできますね♪
最後に
この「メディアと文章」ブロックは、ブログのトップページに他より目立たせたい部分に採用すると、より目を引いて良いかなぁと思いました。
またお風呂でボーっとしている時に思いつきました。笑
これらをブログパーツで作成し、トップページの固定ページから呼び出すようにしました。

レイアウトもおしゃれなので、気に入ったらぜひ使ってみてください♪
テーマSWELLで作るトップページ
いくつか使っているブログパーツについて
コメント