Frequently Asked Questions:

Upload and insert multiple images in a post at one time

One of the cool features of WordPress 2.5 (have you upgraded yet) is that you can upload multiple images at one time.

If you haven’t already tried this yet, all you have to do is click on the “Add media:” image button, click on “choose files to upload” and use shift+click or command+click (ctrl+click for PCs) to select multiple images at once. You can also click on an entire folder to upload all the images inside it.

Well, that’s pretty cool and all, but wouldn’t it be even nicer if you could insert all your images into your post all at once instead of one by one? Well, you can, sort of. All you need to do is use WP 2.5’s new “gallery” shortcode feature, with a little special sauce thrown in.

Here’s how it works:

First, upload a bunch of pictures using the “Add media:” image button.

Once they’ve all finished uploading, click on the “gallery” tab of your little uploader box, and at the bottom you can click on “insert gallery into post.” What this does is add a little bit of special WordPress code to your post that says:

[ gallery]

(I added an extra space after the first [ that shouldn't be there so that the code wouldn't execute in this post). When you publish your post now, it will insert all your images into your post as small thumbnails. Go ahead, try it and then come back here.

Cool, huh? The only problem is, we don't want little thumbnails, right? Right. The next step is to modify the gallery shortcode just a bit so that we display our images full-size. To do that, just change the gallery short code to:

[ gallery size="full" columns="1"]

(again, leave out the space after the first "["). Now if you publish your post your images should display full-size, one per line, and centered. We're getting closer.

However, there is still a funky border that we don't want.

To get rid of that, we have to make one change to our stylesheet. We only have to do this once, and then from now on every time we use the gallery shortcode, we won't have those borders. To make the change, go to "Design" --> "Theme Editor" and open up "Stylesheet (style.css)". Scroll down to the bottom, add a new line, and paste in this line:

.gallery img {border:none !important;}

Click "update file" to save your changes, refresh your browser, and the borders should be gone.

Once you get used to this, this can save you a lot of time. Again, all you have to do is upload all your images, and then paste this line (minus the extra space) into your post where you want your images to appear:

[ gallery size="full" columns="1"]

The only real downside is that inserting your in this way does not allow you to type text between images, so if you like to do that, then this probably isn't for you. But, if you like to write up your post and then post all of your pictures in a row, this could save you lots of time.

Questions? Instead of emailing for support, leave a comment below so everyone can benefit from any clarification.

This entry was posted on Friday, May 2nd, 2008 and is filed under Blogging, Frequently Asked Questions, Posting, Using WordPress. You can leave a response, or trackback from your own site.

46 Responses to “Upload and insert multiple images in a post at one time”

On May 2nd, 2008 at 3:05 pm --christine said:

HOW DID YOU KNOW I was just about to ask you this question!?! when I’ve tried to use the gallery, my images showed up all funky, some thumbs, some large, some left aligned…really a mess. so I gave up. I’ve since upgraded, so off to try it again with these modifications. thank you!
On May 21st, 2008 at 10:14 am Rick said:

Well, not as easy as you might think. The problem here is that you assume that we all know how to modify these codes. I for one have never done this before and I have no idea how to do it. May be easy for you but not for all. I copied and pasted the code as instructed but it did not work. I still have the border on the top and bottom of the picture. I put it at the bottom of the page just like you said but is that right? did I forget to add something? a bracket or a dot? All I know is that it did not work. Frankly, these should be fixes on your end and not the users responsibility.
On May 21st, 2008 at 12:00 pm Jared said:

@Rick: I’d be happy to help you with your problem. I’m sorry if the instructions weren’t more clear. Can you post again on your blog using the gallery code so that I can see the problem and try to help you debug it?

Also, when you say that these “should be fixes on our end” you fail to understand that ProPhoto is a theme for WordPress, which is a huge, open-source software project used by millions and which is in constant development. We cannot possibly anticipate all of the feature changes and code implementation that is constantly coming out in new versions of WordPress. The post you commented on was meant to be a helpful resource for people in using a new WordPress feature, not a ProPhoto feature. I know editing CSS can be a bit overwhelming at first, but I do go out of my way to make it as easy as possible, and I am very easy to reach for support.
On May 29th, 2008 at 10:37 pm Caty said:

Hi Jared, if we want to do all of the above, but instead of center we would like it to be left alligned, now do we do that?

Thanks so much!
On May 30th, 2008 at 3:31 pm Jared said:

@Caty: I’m not sure if that is possible with the shortcode parameters. You can read the WordPress codex article about it here: http://codex.wordpress.org/Using_the_gallery_shortcode
On June 1st, 2008 at 12:19 pm Andrea said:

Hi Jared,

When I post one image, I still have the funky border- even though I inserted the code to remove borders.

What can I do?
On June 2nd, 2008 at 10:11 am Jared said:

@Andrea: it looks like you’ve previously turned on a border for your all your images. so when you’re not using the gallery function, that border shows up, but when you do use the gallery function the borders are gone, because you did insert the code correctly.

what you need to do is remove the code that is adding a border to your non-gallery inserted images. it’s right around line 353 in your style.css, it looks like this currently:

div.entry-content img {
margin: 10px auto 15px auto;
padding:0;
border: 1px solid #666666;
}

just remove the line about the border.
On June 13th, 2008 at 8:04 am Jes said:

How do I get my images in order? They are all numerically named and once inside the gallery they get all jumble up and out of order. I dont see anyway to resort them back into the correct order. I cant post them like this.

And really, there is no way to turn off these borderes and still be able to type in between the images?! That stinks
On June 13th, 2008 at 8:24 am Jared said:

@Jes: there’s no way to type in between images when inserting multiple images at once. if you want to type between them you will need to insert them one by one. sorry, that’s just a limitation of wordpress, not of prophoto.

i’m not sure about the images getting jumbled. again, if you want very specific, granular control of these images and what order they come in, you’ll need to insert them one by one. this is just a shortcut to dump a bunch of images into your post at once. it was never meant to be more than just a quick image dump.
On June 27th, 2008 at 1:58 am Jeff said:

The problem some people may have is with the period before the line you add to your stylesheet. Follow all the steps but delete the period and you should be good to go. I had troubles until I deleted the period.
On June 27th, 2008 at 8:21 am Jared said:

Jeff, that’s odd, because the period should be necessary. a period in a stylesheet indicates a “class” reference. i don’t recommend removing the period unless you’re having trouble.
On July 1st, 2008 at 4:13 pm Neal Hacker said:

This is working perfectly for me with regard to inserting all images, centering them up and displaying them.

However, when the post is being listed under ‘Categories’ I am getting some code that is showing up under the post title as shown here:
http://vimstudio.com/blog/?cat=8

Thanks for an AMAZING product! If you would like to post our blog to your client list, I would be ok with that.
On July 2nd, 2008 at 7:07 am Jared said:

@Neal Hacker: I can’t seem to even see your blog. is it working ok? what’s your blog address so I can look at this.
On August 5th, 2008 at 5:35 am Shari DeAngelo said:

Hi Jared,

I just love how straightforward your coding is. Nice and clean. Fabulous, really! Thank you for thinking things through so well…

I have a couple of questions:

#1. I placed the code line in at the bottom of the stylesheet but still have the borders around the images. I’m sure I’m missing something obvious, but I’m out of coffee. Mind taking a look?

#2. Relative to the gallery (can’t tell if it’s a WP issue or not)– I inserted one image from the gallery into the post. I then use the more line to add the remaining images to the gallery. All works well except that the inserted image is doubled inside the gallery. That makes a total of 3 of the same images being shown. Changing the order # to 0 didn’t help. Would you mind helping me troubleshoot that?

#3 (okay so more than a couple… How do you clear all images from the gallery? I was thinking I could add smaller batches to help with sorting order issues (on larger galleries).
On August 5th, 2008 at 9:24 am Jared said:

@Shari DeAngelo: a few answers:

1. i can’t really tell you, because i can’t see any posts where it looks like you used the gallery feature. can you post again so I can see the problem?

2. this is actually the correct behavior. the “gallery” is basically a term meaning ‘all the images you’ve uploaded for a post or a page’. so you can insert images from the gallery individually, or you can insert all the images using the gallery shortcode. but you can’t insert one image and then use the gallery shortcode to insert everything but that image. it wasn’t meant to mix and match like that. using the shortcode will always insert ALL of the uploaded images for that post.

3. i’m not sure, to be honest. regarding sorting issues, did you know you can drag and drop to sort pictures? you don’t need to use the numbers. also, be careful not to post too many pictures, because at the size that prophoto will allow you to use, this can be very slow to load on many internet connections.
On August 5th, 2008 at 10:08 am Shari DeAngelo said:

1. Nevermind. Must have been a cache issue. Borders are gone now. Sorry, bout that.

2. I was indeed trying to split them. I was hoping to put one or two teaser images on the front page and then allow viewers to click for more (after the jump). If you come up with an idea on how I might be able to do that, I’d really appreciate you letting me know. I’ll try and come up with a solution in the meantime.

3. Noted. I’ll figure out a way to manage this a little better on my end. Do you know if the sorting issue is strictly a Wordpress issue? Dragging and dropping (for large galleries) isn’t ideal. I guess I can rule out adding multiple galleries to one post now though.
On August 31st, 2008 at 10:21 am photoTristan said:

Quick question – is there a way to make the space between images less? I don’t use the method in this post to post images (I just add a link to them) but I’d like the space between each image to be a bit less.
On September 2nd, 2008 at 6:44 am Jared said:

@photoTristan: add a chunk in your stylesheet like so:

.entry-content img {
padding-top: 0px !important;
padding-bottom: 0px !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}

and you can fiddle with all the zero’s if the spacing is too tight.
On October 3rd, 2008 at 12:37 pm April Williams said:

When doing this, is there a way to unlink the picture so that clients can’t single or double click on this to pull up in new window and then do a save as? I know that you change a line of code so that in the blog, you can’t right click and then do a save as, but you can still single click, pull in new window and then save with this method of inserting all the images into a post at one time. Did that make sense?
On October 5th, 2008 at 4:28 pm Jared said:

@April Williams: when using the gallery-insert feature, i don’t think there is a way to prevent left-clicking.
On October 15th, 2008 at 9:09 am chris said:

i am control clicking, but it wont let me upload more than one file. i am on ver. 2.6. can anyone help me on this
On October 15th, 2008 at 2:08 pm Jared said:

@chris: what browser/os are you on?
On October 17th, 2008 at 10:10 am chris said:

safari, and osx 10.5.5
On October 17th, 2008 at 11:40 am Jared said:

@chris: are you control-clicking? on a mac, you should be command-clicking…
On October 19th, 2008 at 1:49 pm chris said:

even with command clicking it doesnt work. i’ve tried them all. any ideas.
On October 20th, 2008 at 5:07 am Jared said:

@chris: shoot me an email with your wp login info and i’ll try from my end with a couple setups and see if i can figure anything out.
On October 22nd, 2008 at 3:27 am Daniel said:

i use [gallery size="full" columns="1"] and the gallery its ok posted
but when i use categories or archives … tha gallery desapear
and only can see the code [gallery size="full" columns="1"] and no images.

Help me please

Here is an example

http://www.daniperezfotografia.es/wordpress/?cat=67
On October 22nd, 2008 at 6:35 am Jared said:

@Daniel: Can you switch your blog briefly to the default theme and see if you have the same problem with your categories and archives? if you do, it’s not a prophoto problem, it’s a wordpress problem and you might want to post a question on their support forum at wordpress.org/support. if you don’t have the problem with the default theme, then its a problem with the theme, and then get back to me and i’ll try to get to the bottom of it.
On October 25th, 2008 at 1:42 pm Daniel said:

OK … using the default theme all works properly
So its should be a prophoto problem?
Can you help me please … thanks
On October 26th, 2008 at 4:06 pm Daniel said:

I have resolve the problem

making the changes that they are indicates in this post

http://www.professionalphotographertheme.com/tips/how-to-show-full-posts-on-wordpress-category-archive-pages/

I hope it helps other prophoto users where have the same problem
On October 26th, 2008 at 5:00 pm Jared said:

@Daniel: thanks for reporting your findings. I’m glad that switching to full content resolved it, but it still seems to me like a WordPress bug that should be fixed. If the archive pages show excerpts, they should not spit out garbled gallery shortcode, it seems it should either show the pictures, or not show the pictures and hide the code.
On October 28th, 2008 at 12:02 am Cliff said:

I’m having the same issue as Chris all of a sudden. I cannot shift/click, ctrl/click, or ctrl/A, to select multiple images for upload. I have done so many times in the past. I’m on XP, and have tried IE, FireFox, and Chrome with no luck.

Any ideas?
On October 28th, 2008 at 7:03 am Jared said:

@Cliff: did you do something recently? upgrade wordpress? did you switch to browser uploader? if so, multiple uploads don’t work in browser uploader. try switching back to flash uploader if possible. chris’s was stuck in browser mode for some reason.
On October 28th, 2008 at 9:13 am Cliff said:

That must be it then. I can’t get Flash uploader to work in any of my browsers all of a sudden. I click on the “choose files for upload” and nothing happens unless I’m in browser mode. I did upgrade Wordpress, but only after I began having the problem, hoping for a fix. I’m having problems with Flash in IE since downloading the newest version. It won’t install, and only gives a link to a dead page for reference for the error. (http://www.adobe.com/go/tn_19166_fr) Flash seems to be fine in FF and Chrome, but I’m sure it’s likely related somehow, so that’s not your problem!

Thanks.
On October 29th, 2008 at 1:02 pm Jamie said:

I’m uploading multiple files at once, but the images are uploading out of order. I want to post images from a wedding and need them to be from beginning to end. Please help.
On October 29th, 2008 at 1:56 pm Jared said:

@Jamie: yeah, images inserted many at once often end up backwards. this is a silly thing that wordpress does, and i wish they would fix it. you can reorder the images before you insert them, under the gallery tab by typing numbers OR by dragging and dropping.
On October 29th, 2008 at 2:23 pm Jamie said:

Thanks Jared. I tried to rename the Title in the gallery, but that didn’t work. Is that what you meant. I didn’t see another spot to rename them. Also I can’t drag and drop them. I went ahead and did a one by one upload but it would be best to be able to do a multi upload. Thanks.
On October 30th, 2008 at 7:30 am Jared said:

@Jamie: i’m not sure what you mean about renaming the title. you should be able to click on the gallery tab when you’re in the media upload popup window. if you have uploaded a bunch of pictures, there should be a bunch of bars, one for each picture. on the right side there is a number. you can change these numbers or drag the bars around to reorder them.

that is, if you are on the most current version (at least 2.6) of wordpress. are you?
On February 13th, 2009 at 5:55 pm Paulo Rigon said:

The problem here is not just that Jared assumes that we all have the same knowledge as he does with computer. Many times his tutorials are not accurate at all. For every problem he either blame our web host or the wordpress. I would recommend you guys to pay more attention to your customers and make things easier. You guys are definitely the cheap ones out there, but I’m starting to ask myself if it was worth it.
On March 5th, 2009 at 8:24 pm PHPDug Social Poster said:

PHPDug Social Poster enables you promoting unlimited number of domains on autopilot. Moreover, software not only bookmarks domains automatically, it also creates unlimited number of social accounts automatically! Domains and accounts are rotated randomly, so each your bookmark looks like posted by real person! Get ready for massive traffic – PHPDug Social Poster will start sending thousands of real visitors to your websites today!
On August 29th, 2010 at 5:20 am PHPDug Social Poster said:

Post trackbacks and comments to remote blogs automatically with PHPDug Social Poster! This tool will submit your comments to millions of blogs automatically. PHPDug Social Poster – the most powerful tool on the planet to submit trackbacks automatically!
On September 18th, 2010 at 10:38 am Computers said:

dis website is reloading slack fo me
On October 20th, 2010 at 9:03 am Amber Prior said:

Thank you very much for this helpful tip! I couldn’t find it in other support forums, and once I figured out where my stylesheet was, adding the no-border code was a cinch! Thank you again.
On October 29th, 2010 at 5:51 am Sadye Plaxco said:

I love your site cause it contain very attractive article
On October 30th, 2010 at 1:55 am SEO Freelancer said:

Hey Geneva,You got me:)I will thing about it!
On February 26th, 2012 at 9:43 am Akkubohrhammer said:

Akkubohrhammer…

[...]» Upload and insert multiple images in a post at one time Jared’s ProPhoto Tips[...]…

ProPhoto - Premium Wordpress Theme for Professional Photographers - Single Column, big pictures - Blog Template

Frequently Asked Questions:

Upload and insert multiple images in a post at one time

46 Responses to “Upload and insert multiple images in a post at one time”

Leave a Reply

Tips Home

Archives

Categories