web-dev-qa-db-fra.com

Puis-je utiliser le shortcode de la légende pour définir la légende en tant qu'attribut de données et en conservant l'alignement de l'image?

Je veux sortir une légende d'image dans ce genre de format:

<img class="alignleft size-medium wp-image-316" alt="Image Title" data-caption="Here lies the image caption" src="http://example.com/wp-content/uploads/image-400x266.jpg" width="400" height="266">

J'ai obtenu le code de légende de base de WP Core et je l'ai exécuté à travers le filtre add_filter( 'img_caption_shortcode', 'my_magic_caption');, qui semble fonctionner correctement.

Mon problème est que je ne semble pas pouvoir réellement affecter la balise IMG ($content) elle-même, mais l’entourer d’autres codes html, ce qui est bien, mais ce que je ne recherche pas.

Toute orientation serait appréciée.

imagescustomizationfiltersshortcode
1
Jodi Warren

Fondamentalement, le filtre img_caption_shortcode vous permet de remplacer complètement la légende d'image par défaut. Si vous voulez faire cela, vous devrez demander à WP de passer tous les arguments du filtre à votre fonction de rappel.

<?php
add_filter('img_caption_shortcode', 'wpse81532_caption', 10, 3 /* three args */);

Ensuite, votre rappel devra prendre en charge tout le rendu. Vous pouvez copier le code de WP et le modifier en fonction de vos besoins. WordPress s'occupe déjà d'extraire la légende elle-même de l'image HTML afin que vous n'ayez pas à vous en préoccuper.

<?php
function wpse81532_caption($na, $atts, $content)
{
    extract(shortcode_atts(array(
        'id'    => '',
        'align' => 'alignnone',
        'width' => '',
        'caption' => ''
    ), $atts));

    if (1 > (int) $width || empty($caption)) {
        return $content;
    }

    // add the data attribute
    $res = str_replace('<img', '<img data-caption="' . esc_attr($caption) . '"', $content);

    // the next bit is more tricky: we need to append our align class to the 
    // already exists classes on the image.
    $class = 'class=';
    $cls_pos = stripos($res, $class);

    if ($cls_pos === false) {
        $res = str_replace('<img', '<img class="' . esc_attr($align) . '"', $res);
    } else {
        $res = substr_replace($res, esc_attr($align) . ' ', $cls_pos + strlen($class) + 1, 0);
    }

    return $res;
}

Voici ce qui précède en tant que plugin .

3
chrisguitarguy

Vous pouvez utiliser la fonction de remplacement de chaîne pour ajouter l'attribut data-caption.

function my_custom_img_caption_shortcode( $a , $attr, $content = null) {
    // New-style shortcode with the caption inside the shortcode with the link and image tags.
    if ( ! isset( $attr['caption'] ) ) {
        if ( preg_match( '#((?:<a [^>]+>\s*)?<img [^>]+>(?:\s*</a>)?)(.*)#is', $content, $matches ) ) {
            $content = $matches[1];
            $attr['caption'] = trim( $matches[2] );
        }
    }

    extract(shortcode_atts(array(
        'id'    => '',
        'align' => 'alignnone',
        'width' => '',
        'caption' => ''
    ), $attr));

    if ( 1 > (int) $width || empty($caption) )
        return $content;

       $image = do_shortcode( $content );
       return str_replace('<img', '<img data-caption="'.$caption.'" style="width: ' . (10 + (int) $width) . 'px"', $image);
}
add_filter('img_caption_shortcode', 'my_custom_img_caption_shortcode',10,3);
1
M-R