Customizing ProductCart - Viewport / Custom Layout Question

Viewport / Custom Layout Question

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=6091
Printed Date: 21-November-2024 at 11:24am
Software Version: Web Wiz Forums 12.04 - http://www.webwizforums.com

Topic: Viewport / Custom Layout Question

Posted By: ammonihah
Subject: Viewport / Custom Layout Question
Date Posted: 22-September-2016 at 3:46pm

Desired Outcome:

When desktop viewport is detected, use a custom layout for all products by default.

When desktop viewport is not detected, use product cart's standard one column layout.

Example:

Go to http://www.disasterstuff.com" rel="nofollow - http://www.disasterstuff.com

Navigate to Water

Navigate to Water Filters

Navigate to Berkey Water Filters

Click on Big Berkey

This is the custom layout we want to use for all products. So when someone is on their computer and they go to DisasterStuff, we want this custom layout to show. But if they are on anything smaller we want the default ProductCart single column layout to be used.

Can this be done?

Replies:

Posted By: Matt
Date Posted: 22-September-2016 at 4:19pm

This is possible by enabling the "mobile settings" in the control panel from v5+.

The files to customize for mobile view:

- "theme/{them_name}/header_mobile.asp"
- "theme/{them_name}/footer_mobile.asp"

... and for tablet and desktop:

- "theme/{them_name}/header.asp"
- "theme/{them_name}/footer.asp"

If you use a responsive theme in v5.2+ you would disable the mobile settings because just about everything in the ProductCart core is responsive in v5.2.

EDIT:

You know, I just realized you don't want to change the page look, but rather the product layout.

So this is still possible and it is pretty straight forward for a programmer to setup.

Depending on what you want to change, it can be done without any programming using CSS media queries.

Many times in custom projects we give products different views on mobile just via CSS.

Unfortunately, it is more of a custom thing that depends on what you need, not a step by step article.

So I recommend getting in contact with our main office.