[gallery]ショートコードにより表示されるHTMLの調整方法

解決済

(@contsuzuki)

[gallery]ショートコードを利用して、投稿記事に写真の一覧を表示しています。

[gallery link="file"]

と、記事内に入力し、以下の要に表示されています。

<div class="gallery default columns_3" id="gallery-1">
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a title="画像1" href="画像1のURL">
        <img width="150" height="150" alt="画像の代替テキスト" …>
      </a>
    </dt>
    <dd class="gallery-caption">画像のキャプション</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a title="画像2" href="画像2のURL">
        <img width="150" height="150" alt="画像2の代替テキスト" …>
      </a>
    </dt>
    <dd class="gallery-caption">画像2のキャプション</dd>
  </dl>
  <dl class="gallery-item gallery-endcol">
    <dt class="gallery-icon">
      <a title="画像3" href="画像3のURL">
        <img width="150" height="150" alt="画像3の代替テキスト" …>
      </a>
    </dt>
    <dd class="gallery-caption">画像3のキャプション</dd>
  </dl>
<br class="clear">
</div>

この表示されたHTMLの＜a＞タグに、何らかのclassを指定したいのですが、
どのファイルの、どの部分に、どのように、カスタマイズすれば良いのかがわかりません。

どなたか、ご教授頂けませんでしょうか？
質問に不備などがあれば、ご指摘下さい。

よろしくお願い致します。

5件の返信を表示中 - 1 - 5件目 (全5件中)

kz
(@kz)

12年、 7ヶ月前
以下の *ように* functions.php に追加すれば OK！
```
add_filter( 'wp_get_attachment_link', 'my_get_attachment_link', 10, 6 );
function my_get_attachment_link( $link, $id, $size, $permalink, $icon, $text ) {
  return str_replace( $link, '<a ', '<a class="my-class" ' );
}
```
※ギャラリーでなくてもリンク付き画像すべてに適用されます。

画像ごとにクラス名を変えたい場合は、$id を使ってみたりすると良いかも。
トピック投稿者 contSuzuki
(@contsuzuki)

12年、 7ヶ月前

kz様、返信有難うございます。
ご教授頂いたとおり記述してみたのですが、クラスが入りません。

利用中のテーマのディレクトリ内のfunctions.phpに記述したのですが、別のfunctions.phpだったのでしょうか？

それとも、こちらの状況に合わせて、どこかを変更する必要があったのでしょうか？

—
“以下の要に”←誤字、すいません。
nobita
(@nobita)

12年、 7ヶ月前
こんにちは
```
return str_replace( '<a ', '<a class="my-class" ', $link);
```
かも
トピック投稿者 contSuzuki
(@contsuzuki)

12年、 7ヶ月前

nobitaさん、返信有難うございます。
やはり、だめのようです…
トピック投稿者 contSuzuki
(@contsuzuki)

12年、 7ヶ月前
kz様、nobita様、すいませんでした。

プラグインで、File Galleryを有効にしていたがため、できなかったようです。
File Galleryを無効にした上で、以下のコードをfunction.phpに追加することで解決しました。
```
add_filter( 'wp_get_attachment_link', 'my_get_attachment_link', 10, 6 );
function my_get_attachment_link( $link, $id, $size, $permalink, $icon, $text ) {
  return str_replace( '<a ', '<a class="my-class" ', $link);
}
```
本当に有難うございました！

5件の返信を表示中 - 1 - 5件目 (全5件中)

トピック「[gallery]ショートコードにより表示されるHTMLの調整方法」には新たに返信することはできません。

トピックタグ

表示