[SOLVED] 2 Column layout and modifying the column width

[Jaje]

Hi guys!

Need help as I am a complete newbie. I've changed layout from 3 columns to a 2 columns layout (left and center) by commenting out lines in footer.tpl. :

{*<div id="right_column" class="column grid_2 omega">
 {$HOOK_RIGHT_COLUMN}
</div>*}

1.Is that the proper way to do it?

What I would like to do next is to spread the center column all the way to the right until it is vertically in line with the edge of the header bar. I cant manage to do that. I have changed the width of the left and the center column in the grid_prestashop.css but I can't increase it enough to make it in line with the header bar as it jumps down. I can only increase the width to the point where it lacks around 50px to be in line with the header. I believe there is some kind of margin that needs to be changed in order to spread the center column all the way but i can't find it. 2.How do I increase the width of the center column without it jumping down?

Now that I have spread it (and hopefully I manage to increase the width of the center column a bit more) the slider needs to be configured. I changed the height and width of the slider in back office and now the slider has spread over the "featured products" module at the bottom. 3.How can I move featured products module so it doesn't get covered by the picture slider?

I am really grateful to all of you, this forum has been of a great help to me!!

 

edit: solved the picture slider problem, changed the height value of the bx-wrapper located in modules/homeslider/bx_styles.css to match the height set in prestashop back office.

Edited April 29, 2013 by PascalVG (see edit history)

[NemoPS]

Hi there!

To solve the center column size issue, you can apply the classes "grid_7 omega" to the div, so that the right margin gets killed

[PascalVG]

There are two video's on youtube from that show you how to change from 3 to 2 columns easily.

 

Go to youtube and search for:

 

HOW TO MAKE THE 2-COLUMNS THEME QUICKLY: WAY 1 : PrestaShop Tutorial : IXThemes 7.x

and

 

HOW TO MAKE THE 2-COLUMNS THEME QUICKLY: WAY 2 : PrestaShop Tutorial : IXThemes 7.x

 

(Tried to add a link directly, but Prestashop forum gave me consistently an error doing so )

 

In short:

Go to modules->positions, scroll to the block: Left Columns block (or Right Columns Block, depending which side you want to remove). Select all modules hooked to this block and press the button at the top that says Unhook the selection.

 

 

See if after changing to 2 columns the other problems still exist.

 

My 2 cents,

Pascal

[Jaje]

Thank you guys! changing layout to 2 columns works well in both cases, but I am still kinda struggling with what Nemo1 said. Can you please explain it a bit more specific, because I am a total beginner when it comes to code lines stuff

[PascalVG]

Memo tried to solve the problem of the small column width, as you mentioned. He indicated how to make it wider in the code.

 

I think with the solution I suggested the column width doesn't need any more changes, right? Or is it then still too small??

 

Let us know.

Pascal

[Jaje]

Pascal I tried it the way how it is explained in the link you posted and I get the same result, still there is a right margin bothering me. I have found the explanation of the Nemo's post on his website so I will try it now!

 

EDIT:

 

Works excellent! Thank you guys, you are really helpful! This is one great community when a total beginner like me can do such modifications just by following tutorials on the forum. I am still quite slow cause I first started with html and css 2 weeks ago and sometimes when I see suggested solution like this one it takes time for me to find the proper css or tpl file that needs to be modified..

 

SOLUTION:

1.Column can be removed using both suggestions, either in back office or commenting out lines as described above.

2.Removing right margin from center column is done by editing the header.tpl located in themes/your_theme/header.tpl:

 

<!-- Center -->

<div id="center_column" class=" grid_7 omega">

 

more about it on nemos web page:

http://nemops.com/grid-display-prestashop-1-5/

important: don't resize the center column width before editing header.tpl

 

Thanks Nemo and Pascal!

Edited April 29, 2013 by Jaje (see edit history)

[PascalVG]

Good to hear it all works. I'll mark this post as solved :-)

[ember1205]

There are two video's on youtube from that show you how to change from 3 to 2 columns easily. Go to youtube and search for: HOW TO MAKE THE 2-COLUMNS THEME QUICKLY: WAY 1 : PrestaShop Tutorial : IXThemes 7.x and HOW TO MAKE THE 2-COLUMNS THEME QUICKLY: WAY 2 : PrestaShop Tutorial : IXThemes 7.x (Tried to add a link directly, but Prestashop forum gave me consistently an error doing so ) In short: Go to modules->positions, scroll to the block: Left Columns block (or Right Columns Block, depending which side you want to remove). Select all modules hooked to this block and press the button at the top that says Unhook the selection. See if after changing to 2 columns the other problems still exist. My 2 cents, Pascal

 

Question: If you modify layout like this while using "Theme A" and then switch to "Theme B", do the changes persist or get reset with the change to the new theme?

 

Or, does it depend on whether or not "Theme B" has its own tpl files or relies on the "default" theme?