X-Cart: shopping cart software

X-Cart forums (https://forum.x-cart.com/index.php)
-   Changing design (https://forum.x-cart.com/forumdisplay.php?f=51)
-   -   Resize and add column (https://forum.x-cart.com/showthread.php?t=64787)

rachelzhao 09-05-2012 12:03 PM

Resize and add column
 
Hi, I am new to the forum and X-cart. I am using the "stock" Book and Magazine skin template. I would like to do 2 things: resize the left column and add one more column on the right. Would someone please show me what file do I need to edit? Thanks in advance.


Jinji Zhao
X-cart 4.5.2
Book and Magazine skin template
EWDhosting.

Toora Designs 09-05-2012 01:10 PM

Re: Resize and add column
 
Use webmaster mode and Firebug to do this.

Left side bar's width can be added by edit the css file and you will editing #left-bar, .fancycat-page-subskin-c #left-bar

Code:

#left-bar, .fancycat-page-subskin-c #left-bar {
    margin-left: 29px;
    top: 29px;
    width: 250px; /*Change this*/
}


rachelzhao 09-05-2012 02:17 PM

Re: Resize and add column
 
Thanks Toora. I changed the left bar size to smaller and moved the center margin to the left. Now I need to add one column to the right, What file(s) do I need to modify to add a right bar (add one column to the right)? Please help.

pauline 09-05-2012 03:19 PM

Re: Resize and add column
 
Create new .tpl, use the left-bar.tpl and duplicate just call it right-bar.tpl.

(it will show exactly whats in the left-bar.tpl but you can add or remove whatever you need to show)

ftp to common_files/customer/right-bar.tpl

In content.tpl after

<div id="left-bar">
{include file="customer/right_bar.tpl"}
</div>
{/if}

ADD:

<div id="right-bar">
{include file="customer/right_bar.tpl"}
</div>
{/if}

ADD:

#right-bar, .fancycat-page-subskin-c #right-bar {
margin-left: 29px;
top: 29px;
width: 250px; /*Change this*/
}

To your CSS and play with the margins.

I think this is right, it's how I added a right bar myself and it worked okay, but i'm no expert

Pauline

rachelzhao 09-06-2012 03:44 PM

Re: Resize and add column
 
Hi Pauline
I did exactly what you said but it didn't show the right bar. Nothing change!. Do we miss anything else? Anything needs to be add to the home.tpl?

pauline 09-07-2012 02:57 AM

Re: Resize and add column
 
Hi,
I'm using 4.4.4 which doesn't include books and magazines, looking at the template I believe it should work if you open content.tpl and at the bottom of the file copy and paste below

{if ($main neq 'cart' or $cart_empty) and $main neq 'checkout'}
<div id="left-bar">{include file="customer/left_bar.tpl"}</div>
{/if}



{if ($main neq 'cart' or $cart_empty) and $main neq 'checkout'}
<div id="right-bar">{include file="customer/right_bar.tpl"}</div>
{/if}

in altskin.css below

#left-bar,
.fancycat-page-subskin-c #left-bar {
margin-left: 29px;
top: 29px;
width: 250px;
}

ADD

#right-bar,
.fancycat-page-subskin-c #right-bar {
margin-right: 29px;
top: 29px;
width: 250px;
}


Play with the margins.

Pauline.

rachelzhao 09-10-2012 11:44 AM

Re: Resize and add column
 
I just found that I have to Rem out this line: (approx line 940)

/* #right-bar {
display: none;
} * /

now i have right bar but overlaps on center

pauline 09-10-2012 12:14 PM

Re: Resize and add column
 
You need add and set the margin-left: ?px

also take a look at these vids, great when you're starting out,

http://forum.x-cart.com/showthread.php?t=62810


all the best,
pauline


All times are GMT -8. The time now is 11:57 PM.

Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.