【Swell】画像のポップアップをオフにする最も簡単な方法

WordPressのテーマ「Swell」では、画像をクリックするとこんなアニメーションが出て、周りが暗くなり、

ライトボックスアニメーション
白い2つの丸がクルクルと回る(撮り方が下手で申し訳ない)

画像が拡大して表示される「ポップアップ機能」があります(ライトボックスというらしい)。

今回は、このポップアップをオフにする方法を紹介します。

画像拡大結果画面
目次

コピペに使用するコード

まずはコードをコピペしてください。

コピペに使用するコードはこちらです。

/* 画像拡大無効 */
.lum-lightbox.lum-open {
    display: none;
}
/* ホバー時のカーソルをデフォルトへ */
.luminous {
    cursor: default!important;
}

このコードを貼り付ける場所によって、

  • サイト全体の画像拡大をオフにするか
  • 特定のページでだけ画像拡大をオフにするか

を選択できます。

サイト全体の画像拡大をオフにする

WordPress管理画面→外観→カスタマイズ→追加CSS

に進んで、コードをコピペし、”公開”をクリックして下さい。

コピペ箇所(サイト全体に適用)

以上で、サイト全体の画像の拡大が無効になります。

特定のページでのみ画像拡大をオフにする

特定のページの編集画面を開いて、最下部にある”カスタムCSS & JS”CSSの箇所にコードを入れます。

コピペ箇所(特定のページにのみ適用)

以上で、特定のページの画像拡大が無効になります。

目次