web-dev-qa-db-fra.com

Contenu dynamique dans un widget

Je dois créer un widget à partir duquel l'utilisateur pourra ajouter quelques images, puis je n'en montrerai que quelques-unes, de manière aléatoire, et il sera automatiquement modifié lors de l'actualisation de la page. Le problème est que le nombre d'images n'est pas connu, il peut être 2, il peut être 5. Je pensais utiliser un bouton "ajouter plus" jQuery mais j'ai des problèmes pour travailler sur les données d'un tableau.

Quelqu'un a-t-il déjà fait quelque chose comme ça? Si vous avez une autre idée à ce sujet, je serais heureux de l'entendre.

Remarque: Si vous avez des connaissances sur un widget qui utilise ce type de fonction, n'hésitez pas à me le dire, je pourrai peut-être m'en inspirer.

plugin-developmentwidgetssidebar
2
stefanz

J'ai peu d'expérience dans le développement d'un plugin ou de widgets, mais je pense que c'est certainement faisable dans un thème WordPress personnalisé.

  1. Créez un formulaire de téléchargement de plusieurs fichiers ajax dans la barre latérale. Lien
  2. Gérez les fichiers téléchargés et enregistrez-les en pièce jointe. Lien
  3. Après avoir obtenu l'ID de la ou des pièces jointes, enregistrez-les en tant que tableau dans la méta de l'utilisateur, par exemple "sidebar_image". Codex
  4. Retour à la barre latérale, vérifiez si l'utilisateur actuel a déjà la méta 'sidebar_image'.
  5. Si elle a une valeur, créez simplement une requête de pièce jointe, en fonction de la méta-valeur. Codex

Si vous voulez cette méthode comme un widget. La fonction des étapes 2 et 3 sera la même si vous utilisez une méthode ajax appropriée .

J'espère que cette aide.

1
ifdion

Cela peut être résolu avec des éléments assez simples: un code abrégé et un widget texte.

Tout d'abord, nous activons la fonctionnalité de shortcode pour le widget:

// Enable shortcodes in the Text Widget
add_filter( 'widget_text', 'do_shortcode' );

Utile: Codes courts partout

Ensuite, nous créons un shortcode qui saisira les images d’un article ou d’une page et en affichera un nombre aléatoire. Comme nous allons charger dans un ordre aléatoire, à chaque chargement de page, les images varieront.

L'utilisation sera [random-image id="99" total="4"]. "id" est le post/ID de la page. Vous pouvez même laisser ce message dans l'état Draft, afin qu'il n'apparaisse pas sur le site. "total" est facultatif et représente le nombre d'images à afficher. S'il y a moins d'images attachées, cela n'a pas d'importance, cela montrera tout ce qui existe.

Vous pouvez avoir quelques articles pour stocker les images et utiliser un widget pour chacun. Un type de message personnalisé pourrait être créé et la partie get_posts complexifiée, mais je laisserai cela comme exercice pour le lecteur;)

Vérifiez les commentaires pour plus de détails:

// Declare our shortcode
add_shortcode( 'random-image', 'wpse_45638_random_image' );

/**
 * Shortcode
 */
function wpse_45638_random_image( $atts, $content = null )
{   
    // ID not provided, bail out
    if( !isset( $atts['id'] ) )
        return;

    // Initiate variables, 
    $html = '';
    $total = isset( $atts['total'] ) ? $atts['total'] : -1;
    $gallery = wpse_45638_get_gallery( $atts['id'], $total );

    // No images, bail out
    if( !$gallery )
        return;

    // Build the thumbnails
    foreach( $gallery as $image )
    {
        $html .= '<div style="padding:10px;width:75px;float:left"><a href="'
            . $image['file'] 
            . '"><img src="'
            . $image['t_file']
            . '"  style="width:100%"></a></div> ';
    }

    // Return contents of the shortcode
    return $html;
}

/**
 * Get images from a post
 *
 * @param int $post_id Target post/page/cpt
 * @param int $total   Number of images to retrieve
 */ 
function wpse_45638_get_gallery( $post_id, $total )
{
    $args = array( 
        'post_type'     => 'attachment',
        'numberposts'   => $total,
        'post_parent'   => $post_id,
        'post_mime_type' => 'image',
        'orderby' => 'Rand'
    ); 

    $attachments = get_posts( $args );
    $arr = array();

    if ($attachments) 
    {
        foreach ( $attachments as $img ) 
        {
            // Grab our data - This can be improved
            $data = wp_get_attachment_metadata( $img->ID );
            $thumb = wp_get_attachment_thumb_url( $img->ID);loga($thumb);
            $file = wp_get_attachment_url( $img->ID);loga($file);
            $arr[] = array( 
                'width' => $data['width'],
                'height' => $data['height'],
                'file' => $file,
                't_width' => $data['sizes']['thumbnail']['width'],
                't_height' => $data['sizes']['thumbnail']['height'],
                't_file' => $thumb,
            );
        }
        return $arr;
    }
    return false; // no images found
}
1
brasofilo