0

I am new to Wordpress. I was writing my custom shortcode for gallery display in my blog posts with the help from this thread. I followed the code snippet written by Mathielo.

Here is my modified code snippet

add_shortcode('custom_gallery', 'custom_gallery');
function custom_gallery($atts) {
global $post;

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

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' => ''
), $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];
    }
}

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

// Here's your actual output, you may customize it to your need
$output = '<div class="blog-media mt-40 mb-40 mb-xs-30">
            <ul class="clearlist content-slider">';


// Now you loop through each attachment
foreach ($attachments as $id => $attachment) {
    // Fetch the thumbnail (or full image, it's up to you)
//      $img = wp_get_attachment_image_src($id, 'medium');
//      $img = wp_get_attachment_image_src($id, 'my-custom-image-size');
    $img = wp_get_attachment_image_src($id, 'full');

    $output .= "<li>\n";
    $output .= "<img src=\"{$img[0]}\" width=\"{$img[1]}\" height=\"{$img[2]}\" alt=\"\" />\n";
    $output .= "</li>\n";
}

$output .= "</ul>\n";
$output .= "</div>\n";

return $output;`

In my WP editor I tried to use the shortcode like: [custom_gallery ids="33,34,35"]. But the images didn't show up. I am sure I have the images with the exact ids.

Where can I possibly go wrong in using the shortcode??

Any help regarding this issue would be appreciated.

N.B. I wrote the above shortcode snippet in function.php

Tamojit
  • 31
  • 4

1 Answers1

0

You have few minor bugs in your function and use this instead.

add_shortcode('custom_gallery', 'custom_gallery_fn');
function custom_gallery_fn($attr)
{
    global $post;

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

    extract(shortcode_atts(array(
        'order' => 'ASC',
        'orderby' => 'menu_order ID',
        'id' => $post->ID,
        'itemtag' => 'dl',
        'icontag' => 'dt',
        'captiontag' => 'dd',
        'columns' => 3,
        'size' => 'thumbnail',
        'ids' => '',
        'exclude' => ''
    ), $attr));

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

    if (!empty($ids)) {
        $ids = preg_replace('/[^0-9,]+/', '', $ids);
        $_attachments = get_posts(array('include' => $ids, '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];
        }
    }

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

    // Here's your actual output, you may customize it to your need
    $output = '<div class="blog-media mt-40 mb-40 mb-xs-30">
                <ul class="clearlist content-slider">';

    // Now you loop through each attachment
    foreach ($attachments as $id => $attachment) {
        // Fetch the thumbnail (or full image, it's up to you)
        // $img = wp_get_attachment_image_src($id, 'medium');
        // $img = wp_get_attachment_image_src($id, 'my-custom-image-size');
        $img = wp_get_attachment_image_src($id, 'full');

        $output .= "<li>\n";
        $output .= "<img src=\"{$img[0]}\" width=\"{$img[1]}\" height=\"{$img[2]}\" alt=\"\" />\n";
        $output .= "</li>\n";
    }

    $output .= "</ul>\n";
    $output .= "</div>\n";

    return $output;
}

Note that the functions argument should be '$attr' and not '$atts'. Also need to change 'include' to 'ids'. That's it.

Outsource WordPress
  • 3,749
  • 2
  • 10
  • 23