{"id":105412,"date":"2012-12-13T09:00:11","date_gmt":"2012-12-13T14:00:11","guid":{"rendered":"http:\/\/wpmu.org\/?p=105412"},"modified":"2013-04-20T18:52:09","modified_gmt":"2013-04-20T22:52:09","slug":"wordpress-gallery","status":"publish","type":"post","link":"https:\/\/wpmudev.com\/blog\/wordpress-gallery\/","title":{"rendered":"How to Create WordPress Photo Galleries with the New 3.5 Media Manager"},"content":{"rendered":"
\n
\"Post<\/div>\n<\/div>\n

The biggest change in the recently released 3.5 version of WordPress was undoubtedly the way media is handled. Not only did the Media Library change, but the way galleries are created also changed \u2013 all for the better.<\/p>\n

Below we\u2019ll go over how to insert a photo gallery in a WordPress post. We\u2019ve got both a video tutorial as well as text and images.<\/p>\n

First up, a video of the process.
\n8O0swHbEdVU<\/span><\/span>
\n<\/p>\n

Opening the Media Manager<\/strong><\/h2>\n

To create a gallery, you need to click on the Media Manager button at top left of your editing screen.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n

When you first open the Media Manager, you will be shown the files in your Media Library. \u00a0If you\u2019d like to create a gallery from those files, then you\u2019re already where you need to be. \u00a0Just select the files you\u2019d like to include in your gallery.<\/p>\n

You can select multiple images at the same time by holding down the Shift key and selecting a range of photos. You can also select or deselect images by holding down the Ctrl key.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n

Uploading Files<\/strong><\/h2>\n

If you\u2019d like to upload files, then you\u2019ll need to click over to the \u201cUpload Files\u201d pane.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n

Once inside your computer, select the files you\u2019d like and upload them. You can upload multiple images at the same time by holding down the Shift key and selecting a range or photos. You can also select or deselect images by holding down the Ctrl key.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n


\nSelecting Files<\/strong><\/h2>\n

Once the files are uploaded, you will automatically be switched over to the Media Library pane where you\u2019ll have access to both those newly uploaded files and all the other files in your library. The files you\u2019ve just uploaded will already be selected, however.<\/p>\n

In addition, you have the choice of showing only the files uploaded to that particular post by using the pull-down menu in the top left corner.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n

Adding Files from the Media Library<\/strong><\/h2>\n

If you would like to add more files from the Media Library, then hold down the Ctrl key and select the files individually.<\/p>\n

If you\u2019d like to select a range of more files at the same time, hold down the Ctrl key and select the first one in the range, and then hold down the Shift key and select the last file in the range.<\/p>\n\n

Adding Meta Information
\n<\/strong><\/h2>\n

When an image is selected and active, you will see that it has a blue border around it. You will also see the image on the right hand side. You can add meta information and captions in this area.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n

Create a Gallery<\/strong><\/h2>\n

In order to create a gallery from the selected images, you will need to click the link in the upper left portion of the screen that says, \u201cCreate Gallery.\u201d<\/p>\n

\n
\"Post<\/div>\n<\/div>\n

Once you do this, you will see a new button in the bottom right hand corner of the screen that says, \u201cCreate a new gallery.\u201d Click that.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n\n

Style Gallery as You Like<\/strong><\/h2>\n

Once you create your gallery, you will be taken to a screen where you can style it as you like.<\/p>\n

You can drag and drop the images to reorder them.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n

You can reverse the order that all the images are currently in with a button in the upper right hand corner.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n

On the far right hand side, you can also set links on the images to go to an attachment page (like a regular page on yours site) or an image file (a blank page with only the image and nothing else \u2013 no header, no sidebar<\/a>, etc.).<\/p>\n

You can also set the number of columns for the gallery and choose to have the images ordered randomly.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n

Inserting the Gallery<\/strong><\/h2>\n

Once you\u2019re happy with everything, hit the \u201cInsert gallery\u201d button in the bottom right hand corner.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n

Once you insert your gallery, you will see a large icon for it appear in your editor. You will not see any of your actual images in the editor \u2013 only this icon.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n

From there, just publish your post.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n

Editing the Gallery<\/strong><\/h2>\n

If you\u2019d like to edit the gallery, click on the gallery icon to select it. When you do this, two icons will appear in the upper left portion of it. Clicking the one on the left will let you edit the gallery.<\/p>\n

\n
\"Post<\/div>\n<\/div>\n

And those are the basics of creating a gallery. If you’ve worked with the old WordPress gallery, then you can probably already see what an improvement this new 3.5 version brings. Nice work, WP crew.<\/p>\n\n","protected":false},"excerpt":{"rendered":"

Learn how to use the more powerful and flexible WP Media Manager to create your galleries.<\/p>\n","protected":false},"author":84404,"featured_media":105414,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"blog_reading_time":"","wds_primary_category":0,"wds_primary_tutorials_categories":0,"footnotes":""},"categories":[1],"tags":[4645],"tutorials_categories":[],"class_list":["post-105412","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-news-community","tag-galleries"],"_links":{"self":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/105412","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/users\/84404"}],"replies":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/comments?post=105412"}],"version-history":[{"count":1,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/105412\/revisions"}],"predecessor-version":[{"id":216396,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/105412\/revisions\/216396"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media\/105414"}],"wp:attachment":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media?parent=105412"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/categories?post=105412"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tags?post=105412"},{"taxonomy":"tutorials_categories","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tutorials_categories?post=105412"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}