Tag Archives: interspire

How to sell affiliate products in your Interspire Shopping Cart store

Posted on September 2, 2011 by
No comments

Here is the simple way I have found to sell affiliate products in your Interspire Shopping Cart store.

First, get the code that your affiliate provides you to add the affiliate products to your website.

Next, go to Add a Product in your Interspire admin panel.

Click the “HTML” button above the box where you type in the product description:

Paste the code from your affiliate into the window that pops up.

Scroll down in the pop up window and click the “Update” button.

You should now see the affiliate product in the Product Description box.

If there is an image for the product, right-click it and save it to your computer. Then delete it from the Product Description and add the image as you would add an image to any other product in your store.

Copy and paste the product name into the correct field, put the product in the correct category on your site, and add the price to the correct field.

Once you have the product listed the way you want, scroll down and UN-check the box next to “Allow customers to purchase this item.”

Save the product and go look at in in your store. It should look just like any other product you would add to the store, except that in order to purchase it, people have to click the affiliate link which you pasted into the product description (this way their clicks from your website to the affiliate site will be tracked, since you are using the code that the affiliate site gave you).

Let me know if you have any issues with this or any questions about it.

Categories: Ecommerce | Tags: , , , ,

Interspire Shopping Carts: Add a Flyout or Dropdown Menu to Sidebar Panel

Posted on May 8, 2011 by
14 comments

Here is the easiest way I have found to add flyout or drop down menus to a particular panel in an Interspire shopping cart’s template.

First, sign  into the website’s admin panel.

Go to Settings -> Store Settings -> Display.

In the box next to Category List Depth, change the number to the number of levels you want to display in the flyout or drop down menu.

Now, go to Store Design and then click Browse Template files.

In your website template’s style.css file, add this code:

.Left #SideCategoryList li:hover, .CategoryList li:hover, .CategoryList li.Over {
background: #746755;
}
.Left #SideCategoryList li:hover a, .CategoryList li:hover a {
color: #fff;
}
.Left #SideCategoryList li ul, .CategoryList li ul {
display: none;
padding: 0 0 9px 0;
-moz-border-radius-bottomleft: 17px;
-moz-border-radius-topright: 17px;
-webkit-border-top-right-radius: 17px;
-webkit-border-bottom-left-radius: 17px;
width: 160px;
position: absolute;
}
.Left #SideCategoryList li:hover ul, .CategoryList li:hover ul {
display: block;
position:absolute;
margin-top:-15px;
left:160px;
width:160px;
}
.Left #SideCategoryList li:hover li, .CategoryList li:hover li {
float: none;
background: #f0eee8;
}
.Left #SideCategoryList li:hover li a, .CategoryList li:hover li a {
color: #444;
font-size: 14px;
text-transform: none;
font-style: normal;
border-top: 1px solid #f0eee8;
border-bottom: 1px solid #f0eee8;
}
.Left #SideCategoryList li li a:hover, .CategoryList li li a:hover {
background: #746755;
color: #fff;
border-color: #fefaf3;
}
.Left #SideCategoryList li:hover, .CategoryList li:hover {
background: #746755;
}
.Left #SideCategoryList li:hover a, .CategoryList li:hover a {color: #fff;}

.Left #SideCategoryList li ul, .CategoryList li ul {display: none;padding: 0 0 9px 0;-moz-border-radius-bottomleft: 17px;-moz-border-radius-topright: 17px;-webkit-border-top-right-radius: 17px;-webkit-border-bottom-left-radius: 17px;width: 160px;position: absolute;
}
.Left #SideCategoryList li:hover ul, .CategoryList li:hover ul {display: block;position:absolute;margin-top:-15px;left:160px;width:160px;
}
.Left #SideCategoryList li:hover li, .CategoryList li:hover li {float: none;background: #f0eee8;}
.Left #SideCategoryList li:hover li a, .CategoryList li:hover li a {color: #444;font-size: 14px;text-transform: none;font-style: normal;border-top: 1px solid #f0eee8;border-bottom: 1px solid #f0eee8;}
.Left #SideCategoryList li li a:hover, .CategoryList li li a:hover {background: #746755;color: #fff;border-color: #fefaf3;}

This code will add a flyout menu to the Category panel in the left sidebar of your website. You can change the name of the panel in the codes if you want to apply the flyout menu to another panel.

Next, you will want to edit the styles above to match the design of your own site.

And that’s all you need to create flyout or dropdown menus for the sidebar of your Interspire shopping cart template!

Let me know if you run into any issues or have any questions.

You can also learn how to create your own custom panels for Interspire shopping carts in another post I wrote.

Categories: Ecommerce | Tags: , , , , , , ,