WordPress コアの RSS ブロックのカスタマイズ例
対馬 俊彦WordPress コアの RSS ブロックを使うと、外部サイトの RSS または Atom フィードを取得して新着情報を表示できます。
これを使うと WordPress 以外のブログのフィードも表示できますので、例えばブログをアメーバブログで運用している場合などに活用できますね。
この RSS ブロックを使って弊社メインサイト https://uonuma-js.com/ のフィードを表示したものをカスタマイズしてみます。
グリッドビュー と リストビュー の両方で、それぞれ1つずつカスタマイズしてみました。
デフォルトの RSS ブロック（グリッドビュー）
テーマが Lightning G3 の場合、デフォルトで以下のように表示されます。
- ロリポップのマニュアルに見つからなかったので、作ってみました。
- BizVektor から Lightning へのテーマ変更は、両テーマに精通している私におまかせください。
- お客様のサイトを拝見しながら相談させていただき、費用見積りなどを提示いたします。ご相談は無料です。
- フィルターフック query_loop_block_query_vars を使って除外するカスタマイズを行う必 […]
- 通常のグローバルナビの位置には SNS アイコン・ピン角ボタンのどちらかまたは両方を配置することができます。
- ブログのトップページがごちゃごちゃしてきたので、検索フォームをシンプルかつコンパクトにカスタマイズしました。
グリッドビューのカスタマイズ例
- ロリポップのマニュアルに見つからなかったので、作ってみました。
- BizVektor から Lightning へのテーマ変更は、両テーマに精通している私におまかせください。
- お客様のサイトを拝見しながら相談させていただき、費用見積りなどを提示いたします。ご相談は無料です。
- フィルターフック query_loop_block_query_vars を使って除外するカスタマイズを行う必 […]
- 通常のグローバルナビの位置には SNS アイコン・ピン角ボタンのどちらかまたは両方を配置することができます。
- ブログのトップページがごちゃごちゃしてきたので、検索フォームをシンプルかつコンパクトにカスタマイズしました。
カスタマイズ内容
- 対角のコーナーをカットしたデザインにしています。
- 背景色を交互に切り替えています。
- リンク先を新しいタブで開くようにしてあります。
- スマホで2列表示にしてあります。
- 日付を先頭に配置してあります。
- リンクエリアを枠全体に拡張してあります。
- マウスホバーで上に動く効果を設定してあります。
デフォルトの RSS ブロック（リストビュー）
テーマが Lightning G3 の場合、デフォルトで以下のように表示されます。
リストビューのカスタマイズ例
カスタマイズ内容
- リンク先を新しいタブで開くようにしてあります。
- 日付を左に配置して1行で表示してあります。
- 日付の表示形式を 2025年1月17日 から 2025 / 1 / 17 に変更してあります。
- リンクエリアを行全体に拡張してあります。
- マウスホバーで日付の色が反転する効果を設定してあります。
- パソコンで表示したときの幅を小さめにしてあります。
関連記事
note のフィードを WordPress で表示したカスタマイズ例 | Lightning / VK Blocks / WordPress のカスタマイズ ②
WordPress サイトのトップページにこのサイトの新着情報と note の新着情報を並べて表示するカスタマイズを行いました。
Lightning / VK Blocks / WordPress のカスタマイズ ② 
投稿者プロフィール
- 魚沼情報サービス・ベクトル公式テクニカルパートナー
-
【日本全国対応】WordPress のサイト制作、設定、カスタマイズ、トラブルでお悩み、お困りの方、ベクトル公式テクニカルパートナーがお手伝いいたします。
Lightning / VK Blocks / VK Filter Search のサポート、カスタマイズを得意としています。
遠方からのご依頼の場合、打ち合わせ・サポートを Zoom や電子メール・電話などを併用して行わせていただきます。
オンラインレッスン形式でのホームページ制作サポートも行っています。お客様ご自身でホームページを制作・運用する上でうまくいかない部分をサポートいたします。設定やカスタマイズを手伝ってもらいたい、同時に便利な使い方や設定方法、カスタマイズのやり方も知ることができたら...という方にご好評いただいています。
デザイナー様、制作業者様のサイト制作のお手伝いも数多く行っています。難しい部分のコーディング ( PHP / CSS / jQuery ) をやってほしい、いま人手が足りない等、お仕事の依頼をお待ちしています。
ご要望をうかがった上で費用見積り（無料）を提示させていただきますので、お気軽にお問い合わせください。
メールでのお問い合わせはこちら
最新の投稿
WordPress2026年4月7日おすすめの投稿をランダムに選んでカルーセル表示したカスタマイズ例
Lightning G32026年3月20日投稿タイトルの下の投稿者の画像を大きめに表示したカスタマイズ
WordPress2025年12月24日クエリーループを使ってノーコードで作った投稿リスト ＋ 追加カスタマイズ
Lightning G32025年10月24日オリジナルのモバイル固定ナビ② - ナビゲーションブロックと組み合わせ
