Web Training Wheels
WordPress & Online Marketing Training / Consulting. Call me at: (323) 920-5297 (9am – 6pm PST, Mon-Fri) or email anytime: lucy@webtrainingwheels.com
How To Use The WordPress Gallery Shortcode
In: WordPress
10 Jul 2010
WordPress has an in-built image gallery feature which does not yet seem to be common knowledge even though it’s incredibly simple to use.
So let’s say you are writing a post that you want to include an image gallery in.
1) Using the usual upload/insert image button, upload any images you want to include in the gallery BUT make sure to just click “Save All Changes” instead of “Insert Into Post.”
2) If you want your gallery to have captions, make sure to fill in the Caption field when uploading your images.
3) To display the images you just uploaded, simply use the shortcode:
[gallery]
You can type the shortcode in either the HTML or the Visual tab, and it will automatically display the images you uploaded.
Slightly more advanced options:
1) By default the gallery shortcode will display thumbnails – at the size set in your Media submenu under Settings. You can choose to display the images at Medium or Large sizes (again, according to the settings in your Media menu), or at the full size of the image. Just use the following format:
[gallery size="medium"]
2) You can determine how many columns you want the images to display in by using this format:
[gallery columns=”4”]
This example would display images in 4 columns.
4) If you want to show images that are attached to another of your posts, just locate the ID number of that post and use this shortcode:
[gallery ID="123"]
and replace “123” with the ID of the relevant post.
5) Combine options in the following way:
[gallery size="medium" columns="2"]
6) If you want to get fancy with it, you can style certain elements of the Gallery. See the Codex for more detailed information
The example gallery below features 3 images I uploaded, displayed as thumbnails (which I had set at 125×125) in 3 columns, and I assigned a caption for the first image.
**header image courtesy fionamclaren
- Tags: gallery, images, shortcode, wordpress tutorial
Comment Form
- Blog updates via RSS
- Blog updates via email | includes free SEO ebook
How I Can Help You
Hi! I'm Lucy Beer. I believe that technology is liberating when you know how to use it, and bewildering when you don’t. That’s where I come in. I help non-techies understand and use the web to empower their personal or business mission. Whether you need to build a website, optimize your existing site, or create a marketing strategy that works, I'll help you understand, in plain English, what you need to do to achieve your goals. Don’t let lack of technical know-how hold you back! I’ll lead you on a clear, practical path that you can master, without the confusing geek-speak. Find out more.
Are you in the Los Angeles area? Get customized training to suit your needs.
WordPress Training - 1 on 1, private groups
Get in-person help and training for WordPress
WordPress Classes, Workshops in Los Angeles
Get discounts and info on upcoming WordPress workshops
Online Marketing Consulting & Training
Need more clients, leads, sales, promotion ideas? Get more quality web traffic and improve your visibility. I’ll help you reach your goals.
Blogging For Small Business Training Program
Customized 1-on-1 training program to get your small biz blog up and running with a strategy.
Social Media For Small Business Training Program
Customized 1-on-1 training program to formulate and implement a social media strategy for your business.
Blogging For Beginners
Just starting out? Learn all the blogging basics
Sometimes I Talk To People
GroundUp Business Meetup - Why Use WordPress For Your Business
Seattle WordCamp - Going Beyond The Basics
Orange County WordCamp - Fun With Gravity Forms
Categories
- Blogging Basics (9)
- email marketing (2)
- General Marketing (1)
- Online Marketing (24)
- seo (11)
- social media (21)
- Twitter (3)
- video (3)
- WordPress (47)
- WordPress Plugin Reviews (1)
- @nybinc: Thanks for sharing this information Lucy, it really cleared up my confusion. [...]
- iamabdus: Awesome, thanks Lucy for the great tutorial. It helped me a lot to backup my sites. [...]
- Shaun Snapp: Very cool Lucy. I have been looking for a replacement for Amazon S3 which runs me around $100 per mo [...]
- Jon: What an excellent way to use Dropbox! Already a user and this makes perfect sense, thanks for the p [...]
- LucyBeer: Hey there - thanks for checking out my blog! Display Widgets will definitely make your life easier a [...]
- WordPress Sites That Don’t Look Like WordPress Sites
- My Three Favorite Backlink Research Tools for SEO
- How To Back Up Your WordPress Site To DropBox
- How To Change The Color Of The Thesis Comment Box
- How to Have Different Sidebar Content On Different Pages of Your WordPress Site
- WordCamp San Diego 2012 – All The Knowledge!!
- Facebook Timeline For Profiles and Pages – Get Ready!
- Essential WordPress Plugin When Using Category Name In Permalinks
- Handy Web Design Resources For The Non-Designer
- Planning Your Website Effectively- WordPress Is A Tool Not A Strategy
Connect With Me
Email Me:
lucy [AT]webtrainingwheels.com
Discussions on WordPress, blogging, online marketing
blog updates, useful articles and tips
business networking
bookmark collection contains WordPress & online marketing resources
15 Responses to How To Use The WordPress Gallery Shortcode
Gregg
July 27th, 2010 at 1:13 am
Correct me if I am worng but this is only availabel with WordPress.com not for self-hosted WordPress sites.
LucyBeer
July 27th, 2010 at 1:17 am
No this IS available on self-hosted WordPress! The Codex link is included in the post above.
elf
February 15th, 2011 at 5:20 am
Does this work only with images that are newly uploaded? How about images that are already in the media library?
Mike
February 18th, 2011 at 12:25 pm
I just created my own theme based on sandbox and for some reson the gallery feature doesnt work:( I picked images i want to display and then Save All Changes and then [gallery] into the body and nothing happens… I had the same troubles with comments for pages, but one function was missing in the template and I had to add it manually. Is there anything like <?wp-gallery_show()?>. I cant find anything on wordpress.org…
LucyBeer
February 20th, 2011 at 10:40 pm
Images have to be 'attached' to a post in order for them to be available for the gallery function. So if you have already uploaded some images in your media library you would have to go into the Media Library first, click "attach" for each image you want to use, then search for the post you want to add it to. Unfortunately this process is a bit of a pain, especially if you have a lot of images to attach.
rhassall
March 26th, 2011 at 10:36 am
This is great that WP has integrated this. But, how do you get these images to link to external URLs when you click on them?
My issue is that I want my images to be linked to external URLs that link to other websites, it appears that these options only provide you with linking the images to the "Image File" or the Attachment Page"
rhassall
March 27th, 2011 at 7:09 am
In addition to creating the shortcode, as you suggested I also was able to acheive the same results by performing the follwing steps, from within the Page Edit screen:
1) Using the upload/insert image button, upload any and all the images you want to include in the gallery, make sure to just click “Save All Changes” instead of “Insert Into Post.”
2) Under the Gallery Settings, make your selections (I have 1 issue with an opttion)
3) Clikck the "Update gallery settings" button
4) That's it you are done!
On the Page Edit screen, if you select the html tab, you will see the shortcode created from the settings you selected under Gallery Settings.
My issue is that I want my images to be linked to external urls that link to other websites, it appears that these options only provide you with linking the images to the "Image File" or the Attachment Page"
I have tried deleting the saved URLs and entering the URLs of my choice, with no success.
LucyBeer
March 29th, 2011 at 7:32 am
I haven't tried it with external images but I think you are correct in that it's not designed to work with external URLs. I would recommend looking for a plugin that does that. There's tons of photo gallery plugins, I'm guessing you can find something that will do what you want that doesn't rely on the in-built WordPress gallery function. If you find something good, please come back and post it here!
Roving Jay
June 22nd, 2011 at 11:15 am
Thanks for this post… I didn't know I could exclude specific photo's – the Codex link was useful. Jay
Tema Frank
July 27th, 2011 at 12:41 pm
THANK YOU! I’ve been hunting for days for a clear explanation of how the gallery feature works.
Bill
August 23rd, 2011 at 3:16 pm
Thank you for clarifying the gallery tag. Is there a way to integrate the gallery tag with a lightbox?
LucyBeer
August 25th, 2011 at 11:06 pm
Hey Bill
Yes indeed. I have used the gallery in conjunction with a plugin called Lightbox Plus and it worked really nicely. I used this shortcode for the gallery: [gallery link="file"]
making the thumbnails click to larger versions which open in the lightbox.
Cheers
Lucy
GARY CHIRO
September 29th, 2011 at 4:50 am
Thanks Lucy this article cleared up a lot for me. I cant believe I have been sing WordPress for over two years and didn't know this option was available on self-hosted wordpress sites. The only thing they need to do to make it less techie is to simplify the removal of images from the gallery instead of manually looking up image id's and using shortcode like [gallery exclude="21,32,43"]
Lisa
October 7th, 2011 at 7:47 am
Hi Lucy, thanks for this. However, the photos in the gallery are weirdly distorted – really tall and skinny and stretched. I have tried changing the sizing in media settings, different number of columns, etc, but always the same result. Any ideas>?
LucyBeer
October 7th, 2011 at 8:42 am
hi lisa – can you post a link to where I can see the problem?