お知らせ機能を追加するウィジェットプラグインを作成しました。

概要

このプラグインは、WordPressに「お知らせ(News)」を管理する機能を追加し、ショートコードを使ってサイト上にお知らせ一覧を表示します。

使い方

  1. このプラグインを有効化します。
  2. 管理画面の「お知らせ」メニューから、いくつかお知らせ記事を公開状態で作成します。アイキャッチ画像も忘れずに設定してください。
  3. お知らせ一覧を表示したい固定ページや投稿に、ショートコード [notice-list] を追加します。
  4. ページを保存し、公開されたページを確認します。

機能

1. お知らせ投稿タイプ

  • 管理画面に「お知らせ」というメニューが追加されます。
  • ここから、通常の投稿と同じように「お知らせ」を作成・編集できます。
    • タイトル
    • 本文
    • アイキャッチ画像
    • が利用可能です。

2. お知らせ一覧表示(ショートコード)

固定ページや投稿の本文に以下のショートコードを記述することで、お知らせの一覧を表示できます。

表示されるHTMLの構造

ショートコードは以下のようなHTMLを生成します。CSSでのカスタマイズの参考にしてください。

<div class="notice-list-container">
<ul>
<li>
<a href="{記事へのリンク}">
<section class="notice-img">
<img src="{アイキャッチ画像のURL}">
</section>
<section class="notice-info">
<p>{お知らせタイトル}</p>
<p>{公開日}</p>
</section>
</a>
</li>
<!-- お知らせ記事が続く -->
</ul>
</div>

3. スタイリング

  • お知らせ一覧には基本的なスタイルが適用されます。
  • .notice-list-container というクラスを持つ div 要素に、高さと縦スクロールが設定されています。
  • スタイルの詳細は notice-widget.css を参照してください。

注意点

  • お知らせ投稿のスラッグが日本語ではないことをお確かめください。
    日本語になっていると、正常に表示されません。

タイトルとURLをコピーしました