web-dev-qa-db-fra.com

Comment modifier la sortie HTML d'un élément de la galerie (à l'aide du shortcode de la galerie)?

Je suis un peu perdu sur ce problème simple, alors je pensais que je pouvais venir demander aux pros. Mon client vient de me dire que dans la galerie de ses sites, le nom et la description sont sur la même ligne.

ainsi, par exemple, si l'image est appelée ABC et que la description est "123".

la sortie est "ABC-123" sur une seule ligne. Elle ressemble à ceci:

 --------
| Picture |
 --------
ABC-123

Elle veut le nom sur une ligne et la description sur une autre, comme ceci:

 --------
| Picture |
 --------
ABC

123

le problème est que, je ne sais même pas ce que je cherche en ce qui concerne la façon de modifier le code pour effectuer ce changement simple.

Sur le code de sortie id, entrez simplement une balise 'br' ou quelque chose comme ça, mais là encore, je ne sais pas où faire ce changement. Pour contourner le problème, je me suis lancé sur mon serveur local et dans la zone de légende des galeries, j’ai mis "ABC
123 "et cela a fonctionné. Il a mis le nom et la description sur 2 lignes mais il y a BEAUCOUP d'images sur cette galerie et il y a certainement quelque chose de plus propre et élégant que cette solution de contournement lol.

des idées sur où je peux éditer le code? J'utilise la dernière version de WP et tout bien que mon thème soit personnalisé mais qu'il soit fondamentalement par défaut et que rien ne le rend fou.

je me demandais simplement quand vous ajoutez le code de la galerie, par exemple [gallery link = "fichier" orderby = "Rand"], quelle page ou quel bloc de code s'agit-il de ce référencement?

Merci d'avance

imagesgallery
3
somdow

Eh bien, au cas où quelqu'un examinerait cela, j'ai résolu le problème en insérant manuellement une balise <br/> dans la zone de légende.

ainsi, par exemple, si le contenu de l'image contient cet exemple de texte, "ABC-123", qui affiche cette

 --------
| Picture |
 --------
ABC-123

puis dans la légende je suis entré quelque chose comme ceci ABC<br/>123 qui produit cette

 --------
| Picture |
 --------
ABC

123

Ceci est la simple galerie (avec shortcode) dans Wp à laquelle je faisais référence et on m'a demandé plus haut http://deadsilencethemovie.com/?page_id=29 (après la balise br) mais là encore, c'est juste une solution de contournement jusqu'à ce que quelque chose de plus légitime baisse pour Wp. (si ce n'est déjà fait). Merci a tous.

0
somdow

Supposons que votre thème ne roule PAS son propre shortcode de galerie et supposons que vous utilisez le shortcode [gallery] plutôt que le format de publication 'gallery' ici. Ce que vous recherchez, c'est la fonction 'gallery_shortcode' dans wp-includes/media.php autour de la ligne 750 (à partir de la version 3.3.1). C'est là que la sortie HTML de vos éléments de galerie est codée en dur.

Bien sûr, nous ne pouvons pas (eh bien, nous ne devrions vraiment pas) éditer ou modifier les fichiers de base de WordPress. Nous devons donc rechercher d'autres moyens de raccorder, de filtrer ou d'améliorer les fonctionnalités intégrées à l'aide de nos propres fichiers. d'ajouter les informations "titre" et "description" souhaitées pour chaque pièce jointe. Malheureusement, à la manière dont le shortcode de la galerie a été codé, il n’existe aucun filtre pratique permettant d’ajouter au contenu de chaque élément de la galerie (ce qui me fait penser que ce n’est peut-être pas une mauvaise idée de soumettre une demande d’amélioration et un correctif ... hmm ...) Nous devons donc remplacer la fonction shortcode dans son ensemble.

Ce n'est pas aussi difficile que cela en a l'air, car nous pouvons simplement copier et coller le code intégré dans notre propre plugin, puis ajouter/modifier/mutiler ce que nous voulons.

Voici comment vous feriez cela. Pour utiliser ce code, créez simplement un fichier nommé 'WPSE45326_Gallery_Replacement.php "dans votre dossier plugins. Ensuite, vous devez accéder à votre back-end Admin et activer le nouveau plugin. Assurez-vous simplement que les images ont une Description et un titre.

Remarque: essayez ceci sur une installation WordPress de Vanilla, en premier. Si cela fonctionne là-bas, mais pas sur le site de votre client, c'est que le thème que vous utilisez roule son propre code. Cela compliquerait les choses.

<?php
/*
Plugin Name: WPSE-45326 Gallery Replacement example
Plugin URI: http://wordpress.stackexchange.com/questions/45326
Description: A plugin to demonstrate how to replace the default 'gallery' shortcode and add additional HTML tags for more customization.
Version: 1.0
Author: Tom Auger
Author URI: http://www.tomauger.com
License: GPL2
*/

class wpse_45326_Gallery_Replacement {
    function __construct(){
        // Hook on the plugins-loaded action since it's the first real action hook that's available to us.
        // However, if you're using a theme and want to replace that theme's `gallery` custom shortcode,
        // you may need to use another action. Search through your parent theme's files for 'gallery' and see
        // what hook it's using to define it's gallery shortcode, so you can make sure this code runs AFTER their code.
        add_action( "init", array( __CLASS__, "init" ) );
    }

    function init(){
        remove_shortcode( 'gallery' ); // Remove the default gallery shortcode implementation
        add_shortcode( 'gallery', array( __CLASS__, "gallery_shortcode" ) ); // And replace it with our own!
    }

    /**
    * The Gallery shortcode.
    *
    * This has been taken verbatim from wp-includes/media.php. There's a lot of good stuff in there.
    * All you want to do is add some more HTML to it, and since (for some reason) they didn't provide more
    * filters to be able to add, we have to replace the Gallery shortcode wholesale.
    *
    * @param array $attr Attributes of the shortcode.
    * @return string HTML content to display gallery.
    */
    function gallery_shortcode($attr) {
        global $post;

        static $instance = 0;
        $instance++;

        $output = apply_filters('post_gallery', '', $attr);
        if ( $output != '' )
            return $output;

        if ( isset( $attr['orderby'] ) ) {
            $attr['orderby'] = sanitize_sql_orderby( $attr['orderby'] );
            if ( !$attr['orderby'] )
                unset( $attr['orderby'] );
        }

        // NOTE: These are all the 'options' you can pass in through the shortcode definition, eg: [gallery itemtag='p']
        extract(shortcode_atts(array(
            'order'      => 'ASC',
            'orderby'    => 'menu_order ID',
            'id'         => $post->ID,
            'itemtag'    => 'dl',
            'icontag'    => 'dt',
            'captiontag' => 'dd',
            'columns'    => 3,
            'size'       => 'thumbnail',
            'include'    => '',
            'exclude'    => '',
            // Here's the new options stuff we added to the shortcode defaults
            'titletag'  => 'p',
            'descriptiontag' => 'p'
        ), $attr));

        $id = intval($id);
        if ( 'Rand' == $order )
            $orderby = 'none';

        if ( !empty($include) ) {
            $include = preg_replace( '/[^0-9,]+/', '', $include );
            $_attachments = get_posts( array('include' => $include, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => $order, 'orderby' => $orderby) );

            $attachments = array();
            foreach ( $_attachments as $key => $val ) {
                $attachments[$val->ID] = $_attachments[$key];
            }
        } elseif ( !empty($exclude) ) {
            $exclude = preg_replace( '/[^0-9,]+/', '', $exclude );
            $attachments = get_children( array('post_parent' => $id, 'exclude' => $exclude, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => $order, 'orderby' => $orderby) );
        } else {
            $attachments = get_children( array('post_parent' => $id, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => $order, 'orderby' => $orderby) );
        }

        if ( empty($attachments) )
            return '';

        if ( is_feed() ) {
            $output = "\n";
            foreach ( $attachments as $att_id => $attachment )
                $output .= wp_get_attachment_link($att_id, $size, true) . "\n";
            return $output;
        }

        $itemtag = tag_escape($itemtag);
        $captiontag = tag_escape($captiontag);
        $columns = intval($columns);
        $itemwidth = $columns > 0 ? floor(100/$columns) : 100;
        $float = is_rtl() ? 'right' : 'left';

        $selector = "gallery-{$instance}";

        $gallery_style = $gallery_div = '';
        if ( apply_filters( 'use_default_gallery_style', true ) )
            $gallery_style = "
            <style type='text/css'>
                #{$selector} {
                    margin: auto;
                }
                #{$selector} .gallery-item {
                    float: {$float};
                    margin-top: 10px;
                    text-align: center;
                    width: {$itemwidth}%;
                }
                #{$selector} img {
                    border: 2px solid #cfcfcf;
                }
                #{$selector} .gallery-caption {
                    margin-left: 0;
                }
            </style>
            <!-- see gallery_shortcode() in wp-includes/media.php -->";
        $size_class = sanitize_html_class( $size );
        $gallery_div = "<div id='$selector' class='gallery galleryid-{$id} gallery-columns-{$columns} gallery-size-{$size_class}'>";
        $output = apply_filters( 'gallery_style', $gallery_style . "\n\t\t" . $gallery_div );

        $i = 0;
        foreach ( $attachments as $id => $attachment ) {
            $link = isset($attr['link']) && 'file' == $attr['link'] ? wp_get_attachment_link($id, $size, false, false) : wp_get_attachment_link($id, $size, true, false);

            $output .= "<{$itemtag} class='gallery-item'>";
            $output .= "
                <{$icontag} class='gallery-icon'>
                    $link
                </{$icontag}>";

            // MODIFICATION: include the title and description HTML if we've supplied the relevant shortcode parameters (titletag, descriptiontag)
            if ( $captiontag ) {
                $output .= "
                    <{$captiontag} class='wp-caption-text gallery-caption'>";
                // The CAPTION, if there is one
                if ( trim( $attachment->post_excerpt ) ) {
                    $output .= "
                        " . wptexturize($attachment->post_excerpt);
                }

                // The TITLE, if we've not made the 'titletag' param blank
                if ( $titletag ){
                    $output .= "
                        <{$titletag} class=\"gallery-item-title\">" . $attachment->post_title . "</{$titletag}>";
                }

                // The DESCRIPTION, if we've not specified a blank 'descriptiontag'
                if ( $descriptiontag ){
                    $output .= "
                        <{$descriptiontag} class=\"gallery-item-description\">" . wptexturize( $attachment->post_content ) . "</{$descriptiontag}>";
                }

                $option .= "
                    </{$captiontag}>";
            }
            $output .= "</{$itemtag}>";
            if ( $columns > 0 && ++$i % $columns == 0 )
                $output .= '<br style="clear: both" />';
        }

        $output .= "
                <br style='clear: both;' />
            </div>\n";

        return $output;
    }
}

new wpse_45326_Gallery_Replacement();
7
Tom Auger