Customizing ProductCart - Home Page questions

Print Page | Close Window

Home Page questions

Printed From: ProductCart E-Commerce Solutions
Category: ProductCart
Forum Name: Customizing ProductCart
Forum Description: Exchange messages with other users that are customizing ProductCart.
URL: https://forum.productcart.com/forum_posts.asp?TID=3764
Printed Date: 01-May-2024 at 12:12pm
Software Version: Web Wiz Forums 12.04 - http://www.webwizforums.com

Topic: Home Page questions

Posted By: lorilorilori
Subject: Home Page questions
Date Posted: 06-June-2010 at 9:00pm

I am not a web designer at all, but I do all the maintenance for my webstore.
My question is about the homepage. My store is related to fashion, and so I need a certain kind of front page for my site. I can't just have a bunch of featured products on the front page as if it were a car parts store.

What I normally do is just create a large jpeg in photoshop and have it be my main image, but what I WANT to do is be able to have this image for the front page be clickable and take the user to different brand pages on the site.

So far, I have been able to teach myself how to create a document in photoshop that will have images that can be clicked on to go to the desired URL's, however, when I save the page in photoshop I have to save it with images and html together, and this makes it a .html document.

So when I got to the html editor for the home page manager in product cart, it won't let me upload a .html file. Therefore, I can't ever have a front page image that is clickable? This can't be...
does anyone know how to create a front page where images are clickable? If this software can't allow for this then I may have to move on. Thanks!

Replies:

Posted By: Greg Dinger
Date Posted: 06-June-2010 at 9:15pm

Well, without seeing your page, it's a little difficult but the first thing you may want to look into is "image maps". Here is a link:

http://www.w3schools.com/tags/tag_map.asp - http://www.w3schools.com/tags/tag_map.asp

The concept is that you define parts of an image that are clickable, and you can have multiple parts of that image that each click to a different URL.

You can search on the phrase of "image map generator" as there are many out there. It may be easier to use such a tool instead of manually determining the positions that you will specify when defining the coordinates of the clickable zones.

-------------
GreyBeard Design Group

Certified ProductCart Developer

Web Design/Development/Hosting

http://tinyurl.com/5c8t4t" rel="nofollow - Add-Ons & Custom Code |

Posted By: lorilorilori
Date Posted: 06-June-2010 at 10:28pm

Thanks Greg. Will I be able to create an image with this that will be uploadable to my site from within the Product Cart control panel?
BY the way, I need to find a new product cart developer that I can hire to help me. Any takers?

Posted By: Greg Dinger
Date Posted: 06-June-2010 at 10:45pm

An example of how this could work:

- you upload the image to your site

- you edit the home page using that text area on the home page settings.

- in that text area you specify the image tag and the image map code, all of which you have tested via a static HTML page so you know it's going to play nice.

Having updated the home page in this manner, you have your splash image ready to go. An example of such an implementation is http://www.colormall.com - www.colormall.com . That's precisely what we did.

If you would like to discuss your development needs, please contact me via my site.

-------------
GreyBeard Design Group

Certified ProductCart Developer

Web Design/Development/Hosting

http://tinyurl.com/5c8t4t" rel="nofollow - Add-Ons & Custom Code |

Posted By: Greg Dinger
Date Posted: 06-June-2010 at 10:46pm

Just noticed the client has updated colormall.com with a single image, whereas we have traditionally featured 3-4 products in the splash image with an image map. I figure the above gives you an adequate description however.

-------------
GreyBeard Design Group

Certified ProductCart Developer

Web Design/Development/Hosting

http://tinyurl.com/5c8t4t" rel="nofollow - Add-Ons & Custom Code |

Posted By: intour
Date Posted: 08-June-2010 at 11:59am

You can also do this by splicing your image. This involves chopping it up into smaller parts which can be put together to form a single larger image. Where this becomes advantageous is that you can use these as background images then overlay them with clickable text links or other images. It is the way many sites are created nowadays.

Nigel

-------------
http://www.innerview.co.uk - Innerview
Productcart Platinum Reseller
Web Design/Hosting/Virtual Tours

Posted By: Brett
Date Posted: 08-June-2010 at 4:53pm

*edit*

Greg's answer is spot on.

However, I found that I wanted to edit the home.asp page so that my featured products message does not show above the home page description:

               <%
               ' If there are featured products, show that message, otherwise hide it
               if pcIntHPFeaturedCount > 0 then
               %>
                    <h1><%response.write dictLanguage.Item(Session("language")&"_mainIndex_11")%></h1>
               <%
               end if

               ' Show Home Page description, if any
               if pcStrHPDesc <> "" then %>
                    <div class="pcPageDesc"><%=pcStrHPDesc%></div>
               <%
               end if
               %>

Replace with:

               <%
               ' Show Home Page description, if any
               if pcStrHPDesc <> "" then %>
                    <div class="pcPageDesc"><%=pcStrHPDesc%></div>
               <%
               end if
               ' If there are featured products, show that message, otherwise hide it
               if pcIntHPFeaturedCount > 0 then
               %>
                    <h1><%response.write dictLanguage.Item(Session("language")&"_mainIndex_11")%></h1>
               <%
               end if
               %>

Posted By: intour
Date Posted: 08-June-2010 at 5:43pm

I've done the same thing as Brett on a few sites as the 'Featured Products' message does mess up a nice clean image at the top of the page.

Another way is to remove the phrase from the languages.asp file then tweak the CSS that displays it.

Nigel

-------------
http://www.innerview.co.uk - Innerview
Productcart Platinum Reseller
Web Design/Hosting/Virtual Tours