Wednesday, August 5, 2015

How to Create a Clickable Collage for your Blog to your TpT Store - Step by Step

I just created a clickable collage for my last post and it was pretty easy so I wanted to share with you how to do it. Just follow the steps below to create your own. See the one I made previously here.

Part One

1. Go to PicMonkey  I used the free version of PicMonkey to create my collage because everyone can access it. No need to create an account.

2. Click on "collage" at the top. You can choose to you use their layouts or create your own. I created my own for this example.

3. Choose your first image. Continue to add the images you want for your collage. I used my product covers for my images.
4. Now drag the images over to the collage template to the right one at a time.
5. If the collage gets filled but you still have more images to add just drag the next picture to the bottom of one of the images already in the collage. When you see the highlight bar drop in your picture.

6. Once you have all of your pictures in you can drag them around to move and center them.
7.  Now click "save"  to save it to your computer. I saved mine as a png.
 I changed the resolution of my collage to 3400 x 3400.

Part Two

8. Now you need to upload your collage image to the Internet. Picassa, Flickr, and Photobucket are great places to upload your image to. You can even do it to a secret Facebook page if you have one.
9. Once your image is uploaded, right click on it to "copy the image url".

Part Three

10.  Now head over to Image-Maps. It's free.
11. Paste in the image's url and click "start mapping". Then click "click to continue".

12. Close the yellow bar at top. Right click on one of the images and click on "create rect". Drag your cursor to create a box around it.
Add the url and title of the product from your TpT store. Then under the tab events click "target" and choose "blank". This will open the image in a new window for your readers. Do this for all images.

13. Once you have added all of the urls right click and choose get code. Choose the tab "html code". Scroll down and copy the code.

Part Four

14. Now go to your blog and paste in the code. If you are using blogger just click on "HTML" (next to "Compose"). Paste in your code. Then click back on "Compose". Your clickable collage is now ready for your readers.

I hope you liked this tutorial. If you have any questions just leave me a comment.

No comments:

Post a Comment