Buy graphics from Creative Fabrica for your POD products

Adding Zazzle Products To Weebly Pages

I'm going to show you how I add products from Zazzle to my Weebly website such as on my personalized mugs page. Make sure you are logged into your Zazzle account so your referral id is automatically added to the product links.

Let's make a row of product thumbnails, so from the left side of the Weebly editor drag the IMAGE element onto the page, add another IMAGE element beside it until you until you get the amount you want.

Note: the more image elements you add to a row the smaller the images will be. In the example below there are three for three product thumbnails:

---

Drag more IMAGE elements below the top row in the same way to start a second row. As you do, be sure that a blue line appears that spans the entire row above or else the IMAGE element will end up in the top row:

Now you are ready to add products
Go to Zazzle and pick a product. On the product page click the "Share" button, then the "Link" button:

Right click on the product image in the popup and choose "Copy Image Location" to grab the picture's url:

Back at Weebly click on one of the IMAGE elements in your cells, choose the Image URL tab in Weebly's popup and paste the picture's url into the textbox. You will notice a number at the end of the url. This is the size of the picture, you can change the number to make the picture smaller. For example change 325.jpg to 225.jpg and the picture will be smaller:

Go back to the Zazzle product page and copy the product page url from the "Share This" popup. Be sure you're  logged in so the referral id will be included:

Back at Weebly click on the product thumbnail to access more options, click the Link tab and paste the page url into the Website URL section:

Click save and you're done. Do the same with the other cells.

Tip
By default pictures are displayed with a thin border, to remove the border click on the picture to get more options, pick the "Advanced" tab and choose "None" from the dropdown menu.

Another Way To Add Zazzle Products
Here is another way to add products from Zazzle to your Weebly site. Instead of dragging the IMAGE elements onto the page,  drag the EMBED CODE element.  Note: You might need to click the little icon above the elements to access the EMBED CODE element:

Copy the HTML code from the "Share this" popup at Zazzle and paste the code into the EMBED element (where it says "Click to set custom HTML") And you are done! To change the size of the picture, find the place in the code where it says 325.jpg and change the number.


Told you no skills are needed. Don't ya just love Weebly?

Disclosure
This website contains affiliate links which earns the author a commission should a sale occur.