Changing your VPCart 8 store to full screen

Changing your VPCart 8 store to full screen

It is simple to change the width of your VPCart 8.xx store to 100% full screen width.

1. Go to:

Templates > Default > CSS

Open main-responsive.css

2. Locate the following around line 13:

.container { width: 100%; max-width: 1200px; }

3. Change to:

.container {
width: 100%;
max-width: 100%;
/* max-width: 1200px;*/

Doing this allows you to easily revert if you want to.

Save and close.

4. In the same folder locate basic-responsive.css and open

5. Locate the following around line 175:

.vp_topheader_upper { max-width: 1170px; margin: auto; }

Change to:

.vp_topheader_upper { max-width: 100%; margin: auto; }

6. Save and close.

7. You might now want to show more products on the home page in your rows so now open shoprandomproducts.asp

8. Locate around line 160:

desktopstring = desktopstring & "<div class='col-lg-4 col-md-6 col-sm-4'>"

Change to:

desktopstring = desktopstring & "<div class='col-lg-3 col-md-4 col-sm-4'>"

9. If you like you can change the col-lg-3 to maybe even col-lg-2 if you like.

The number of products shown in a row is 12 divided by the above number.

So if you have 4 it would be 3 products displaying. If you enter 2 it would be 6 products.

If your version is more recent than 8.00.7 it will not be necessary to do this as you will be able to set from the admin.


Times Viewed:
Added By:
Date Created:
Last Updated: