How to Make Zazzle Store Builder Links Open in a New Browser Tab

Unlike similar applications which are offered by other POD websites, the Zazzle Store Builder doesn’t allow us to view the actual product pages from within our personal website. Why? The Store Builder only accesses Zazzle’s feed to pull back products… Nothing more, nothing less!

Store Builder pulls in the products, a potential customer clicks a link to view your product in more detail and they get whisked off to Zazzle for a better look. Good… That’s what we want, potential sales… Except, here’s the catch.

By default, the Store Builder tells all of it’s product links to load it’s target page in the current tab of your browser window… bye bye personal website! So, how do we get it to load pages in a new browser tab? Well, it’s fairly simple to do, only takes a few minutes, and can be used whether you have the Store Builder installed on a self built website or one which uses a CMS.

IMPORTANT: The following tutorial involves editing one of Store Builder’s core files. PLEASE make a back-up copy, as instructed in step 1, before you make any changes to it.

Step One:

First you will need to open zstore.php in your preferred code editing program (Dreamweaver, Notepad++, etc). You’ll find it inside the zstore/includes folder. Before you start make a back-up copy of this file by using save as. Don’t rename the file, just save it with the same name to another folder somewhere on your computer. If something goes wrong, you can use this file to overwrite the one you’re going to edit in step two. Hopefully you won’t need it!

Step Two:

Okay, now you’ve done that you’ll need to locate the section of code that needs a few alteterations to it. It starts on line 471 and ends on line 490, if you’re using Dreamweaver, and it looks like this:

It might look daunting at first but don’t worry. In this piece of code are the 5 lines which generate the links to your products on Zazzle. These links are the product title link, the product description link, the show by line link, the product price link, and the product thumbnail link. All we are going to do is add a new attribute to each of the <a> tags to make these links open in a new tab, or window if your browser is set up that way.

Step Three: The product title link

Okay, first on the list is the product title link. This is located on line 472 and looks like this:

All you need to do is add the attribute target=\"_blank\" to the end of the opening <a> tag. Those of you familar with HTML will notice it looks a little different than it usually does. The addition of the \ before the quotes changes the meaning of them so that we can use them within PHP. Quotes are part of the PHP coding language and mean something completely different to what they do in HTML. If we don’t change the meaning of them by using \, PHP will throw it’s toys out of the pram!

Anyway, the line of code should now look like this:

Step Four: The product description link

Next locate the product description link on line 477. It looks like this:

Do exactly the same thing as you did for the product title link and add target=\"_blank\" to the <a> tag. Your code should now look like this:

Step Five: The byline (artist) link

Next locate the byline link which will now be on line 481. It looks like this:

Add target=\"_blank\" to the <a> tag and it should now look like this:

Step Six: The product price link

Next locate the product price link which will now be on line 484. It looks like this:

Add target=\"_blank\" to the <a> tag and it should now look like this:

Step Seven: The product thumbnail link

Finally you need to work your magic on the product thumbnail link. The line of code you need should be on line 491 and looks like this:

This time you need to use the normal HTML version of target="_blank". No \ needed. However, make sure you put it in the <a> and not the <img /> tag. It should now look like this:

All done!

That’s it. Upload the edited version of zstore.php to the zstore/includes folder, try your Store Builder links, and hopefully they’ll open in a new tab or window. Sit back. Relax. Job done!

print on demandStore BuilderZazzle