Replacing a Wordpress Image gallery

Question

Since my last question was answered pretty quickly, I thought I'd try my luck again.

I am trying to create a gallery within a custom post type I have created. I would like to be able to add the images/gallery to the post through the wordpress admin editor, but then have a function pull the images, wrap them in divs, and replace the existing gallery with the new images.

I would like to do the because I would like the images to fit into a grid of different sized images. For example, image 1 would be the full width, image 2 would be half the width, image 3 quarter and so on.

I have tried two methods, one being get_children()

$featuredImage = get_post_thumbnail_id( $post->ID );
$imageArgs = array(
    'numberposts' => 5,
    'order' => 'DESC',
    'post_mime_type' => 'image',
    'post_parent' => $post->ID,
    'post_type' => 'attachment',
    'exclude' => $featuredImage
    );
$attachments = get_children($imageArgs, ARRAY_A);
$rekeyed_array = array_values($attachments);
$child_image = $rekeyed_array[0];
echo '<div class="project-img"><img src="' . $child_image['guid'] . '" class="project-image"></div>';
$child_image = $rekeyed_array[1];
echo '<div class="project-img w2"><img src="' . $child_image['guid'] . '"></div>';
$child_image = $rekeyed_array[2];
echo '<div class="project-img w3"><img src="' . $child_image['guid'] . '"></div>';
echo '<div class="project-img w3"><img src="' . $child_image['guid'] . '"></div>';

and the other being get_post_gallery()

$gallery = get_post_gallery( get_the_ID(), false );

            /* Loop through all the image and output them one by one */
            foreach( $gallery['src'] AS $src )
            {
                ?>
                <div class="project-img">
                <img src="<?php echo $src; ?>" alt="Gallery image" />
                </div>
                <?php
            }

I haven't made much progress with the get_post_gallery(), but I sorta understand that I will have to use wp_get_attachment_url() to get the full sized images instead of thumbnails.

Now, two questions:

I'm a little confused about arrays, so how would I go about selecting the first image in the array and wrapping it in a div with class "image-large" and then the second image and wrapping it in a div with class "image-medium"?
How do I replace the gallery/images I have added through the editor with the new gallery/images? Right now, I get two instances of the images, the original added through the editor, and the images obtained through the functions.

EDIT

I figured out question 1, I think. Read up on associative arrays and realized you can do something like echo $gallery['src'][0]; to get the source url of each image. Still confused about question 2, though.

mjaim mjaim · Accepted Answer · 2014-10-27T20:42:32

Figured it out.

//Remove original Gallery
function remove_the_first_gallery( $output, $attr ){
    $output = '<!-- gallery 1 was here -->';   // Must be non-empty.
    return $output;
}

add_filter( 'post_gallery', 'remove_the_first_gallery' );

That removed all galleries on the page. But since my new gallery isn't technically a post_gallery, it was left alone.

Replacing a Wordpress Image gallery

1 Answers