One of the things that was high on the list for my redesign was to figure out how to make pretty index galleries to highlight my recipes and DIYs. Previously I had alternated between long links to posts with no pictures and an fairly ugly wordpress plugin that I found by googling.
I knew there had to be a better solution out there, so I started to look at some of my favorite food blogs to see what their approach was. I noticed that With Sprinkles on Top had a beautiful gallery made with the program In Linkz. I checked out their website, but for the life of me I could not figure out how to make the beautiful galleries on With Sprinkles on Top.
Not one to be defeated easily, I emailed Annie, the author of With Sprinkles on Top, to ask for advice. Annie could very well be my sister from another mister. She’s blonde, lives in Wisconsin, loves to bake, went to the same University as me and is now finishing professional (law) school. As a bonus she’s also a complete sweetheart! She emailed me a beautiful step-by-step tutorial on setting up blog index galleries, complete with screen shots.
I knew this tutorial was too good not to share. I can’t be the only one scratching my head trying to figure out how to do this! Annie was gracious enough to let me share her tutorial here on A Side of Sweet. Note, this tutorial is WordPress specific, which is the platform that both of us use.
How to Make Pretty Index Galleries for Your Blog on WordPress
1. Create an account with inLinkz – then log in. You’ll see this page after log in. Click on “Project Manager”
2. You’ll need to create Collections. My collections are the categories you see on my blog – Cupcakes, Cookies, Breakfast, etc. The pickle is that you can’t create collections until you have links to into the Collections. So now we’ll create the links.
3. Click “Add new link”
4. This window will pop up. Fill in all of the fields to your liking.
5. This is what mine looks like filled in for my Cinnamon Roll Bundt Cake post. Paste the link to the post into the “Target URL” box.
Next you’ll need to create the thumbnail. So click on “Select Image”
6. This will be what you see next.
I allow inLinkz to gather the image directly from the Target URL that I’ve provided. You can also upload directly if you’d like. Click “Select”
7. I click on the image I want to use from the collection inLinkz picks up from the Target URL.
8. You’ll be allowed to crop the photo into a square to use as the thumbnail. Click “OK” when finished.
9. Now all of the fields from this page will be filled in and ready to go. Click “Accept”.
10. Now the thumbnail link you’ve just created will show up on the left.
Now you need to create the Collection for the image! My collections are “Breakfast” “Cookies” “Cupcakes”, etc.
So click on the “Add new collection” link near the top of the page. This screen will come up. Name your collection whatever you’d like – then drag your newly created thumbnail into it. Click “Save”
11. This is what my “Cakes” collection looks like, just so you can fully see what we’re doing here. The collection will get filled with the thumbnails you make. You can rearrange the thumbnails however you’d like. Just always remember to hit Save after any edits! (It’s easy to forget to do!)
12. Now…. How do you get this to show up on your blog? Easy! I promise.
On the list of collections on your main inLinkz page, click on “Get script”
13. When you click on Get Script, you’ll see a page with a bunch of different codes to choose from. You’ll want to highlight and copy the code in the “Old widget code” box.
14. Now, go to your blog platform and create the page for your thumbnail gallery. Pretend that this screenshot says Cakes instead of Breakfast.
I created a page for Cakes – and pasted the old widget code into the text box. Click Publish. And that’s it!
Something to note – you do not have to edit the code every time you add a new thumbnail. It automatically updates because it’s a dynamic script. So all I do is log into inLinkz, add new thumbnails to my collections when I update my blog, and that’s it. The visual indexes on my blog update themselves.
Thanks again Annie, for letting me share this awesome tutorial!
Shashi Charles says
Wow – awesome tutorial – thanks so much for sharing this one!
Kelly says
It’s all Annie! I can’t take any credit.