プログラミング

WordPress jQuery + CSS + ショートコードで モーダルウインドウを自作する

jQuery と CSS で WordPress にモーダルウインドウを実装してみました。

事前準備:
独自jsファイル 及び  独自cssファイルをインクルードする。
single.php に jsファイルをインクルード
これにより投稿詳細ページのみ有効なjavascriptファイルを作成する。
独自jsファイル 及び独自cssファイルをインクルードできるプラグイン
「 Custom CSS and Javascrip 」

モーダルウインドウ関連はプラグインでかなりあります。
今回はWordPress の学習を兼ね作成してみました。

解説は別途作成しようと思います。まずはサンプルのみとします。

モーダルウインドウサンプル


ショートコード追加
ショートコード追加
CSS
CSS
Modal デフォルト
Modal デフォルト
JQuery
JQuery

最近の記事

  1. EC-CUBE 4.0 インストール
  1. Web・デザイン

    CSS3 アニメーションライブラリ animate.cssについて学ぶ
  2. サーバー環境

    Let’s Encrypt dns-01 自動認証で ワイルドカード…
  3. プログラミング

    WordPress にて jQueryUI テーマを動的選択してデザインを反映
  4. Raspberry PI

    Raspberry Pi 4 ModelB Raspbian インストール VN…
  5. サーバー環境

    Macにmysql 8.0.x をインストールする。
PAGE TOP