WordPressでギャラリー画像の並び方についてご相談を頂きました。ギャラリー作成の簡単なマニュアルなどもご紹介します。
目次
ギャラリー機能の写真の並べ方について
初心者の為、初歩的なご質問で申し訳ありません。
ギャラリー機能を使って、写真を横並びにしたいのですが、手順通りやっても、写真が縦に並んでしまいます。「ショートコードを挿入」➡「ギャラリー機能」というやり方だと、
<p>[su_custom_gallery source="media: 632,633,634" link="image" width="160" height="120"]<br /> [su_custom_gallery source="media: 635,636,637" link="image" width="160" height="120"]</p>
となり、写真は横並びになるのですが、「メディアファイル」➡「ギャラリーを作成」で、手順通りに行うと
<p>[[gallery ids="637,636,635,634,633,632"]]</p>
となり、プレビュー画面で確認すると、縦並びになっています。
画像の大きさを調整しても縦並びになります。
ギャラリーのショートコードについて
ご相談ありがとうございます。
まずはショートコードの違いについて解説します。
【gallery】で始まるショートコードはWordPressに最初からあるギャラリー機能です。
そして、【su_custom_gallery】から始まるものは、プラグイン「shotocode ultimate」で作られるショートコードっぽいですね。
実際にはそれほど利用したことがありませんが、このプラグインは様々な機能をショートコードで実装できるようになるプラグインです。
両者のショートコードは共に画像ギャラリーを作成するものではありますが、全く別のものと思っていただいた方がよいでしょう。
そのため、「ショートコードを挿入」「ギャラリーを作成」で作られるギャラリーも別物です。
プレビュー画面で確認すると、縦並びになる
ちなみに、【gallery】ショートコードは編集や数値の挿入で列を変えることができます。
link=”file” （画像のURLにリンク）
columns=”2″（列変更 なしだと初期設定3）
size=”medium”（thumbnail large fullなど）
ids=”画像ID”
こういった数値、特にcolumnを変更してもダメでしょうか。
[gallery column="2" ids="637,636,635,634,633,632"]
といった形ですね。
写真が縦になる原因
column数値の変更や、後述するマニュアルでもだめな場合、なんらかのCSSの影響を受け画像のサイズが変わっている可能性があります。
サイト上の見た目は最終的にCSSで装飾されているので、カラムを設定しても幅が100％になるようCSSが書かれていればそのようになってしまいます。
shortcode ultimateのCSSなのか、独自で書かれたCSSなのかはわかりませんが、プラグインの場合はプラグインを停止させれば解決するかもしれません。
それか、【su_custom_gallery】の方だけを使うということでも良いでしょう。そちらのギャラリーは問題ないようなので。
デフォルトのギャラリーマニュアル
こちらは以前作成したギャラリーのマニュアルです。基本的な作成や編集について言及していますので参考にして頂ければと思います。
