Menyembunyikan / nenonaktifkan kolom kiri dan kanan Prestashop pada halaman tertentu

Berikut ini saya share artikel tentang menyembunyikan / menonaktifkan Kolom Kiri dan Kanan Prestashop pada halaman tertentu, yang saya dapatkan langsung dari Forum Prestashop.

Cekidot...

Q1:

Dear All,

I am new to prestashop and am trying to customize the default theme of version 1.4.7.3. I want to have the below layout for my home, category and product pages.

1. Home Page: Both the left and right columns will be disabled. The center column will occupy all the space between Header and Footer section.

2. Category Page: Right column will be disabled. Left column will be as it is. Center column will occupy the space for center and right columns.

3. Product Page: Left column will be disabled. Right column will be as it is. Center column will occupy the space for center and left columns.

Please let me know what all changes are required to achieve this layout.

A1:

Disabling columns for certain pages is actually quite easy.

For the home page use: (change the center column width to suit your own site)

body#index #center_column {width:951px}
body#index #right_column #left_column {display:none}
For the category pages use:

body#category #center_column {width:951px}
body#category #right_column {display:none}
For the product pages use:

body#product #center_column {width:951px}
body#product #left_column {display:none}
This will work fine, aslong as you don't want to move boxes from left to right depending on the page.

Q2:

Thanks for the quick reply, jhnstcks.

Your CSS code is working perfectly fine to hide the left and right columns on the required pages. But what I have to do to disable these columns altogether, so that they won't execute the modules attached to these two hooks (left and right column hooks) unnecessarily on these pages?

A2:

If you go to back-office>modules>positions then edit the modules you want to hide and add an exception to the pages you want to hide them, index.php, category.php and product.php

Q3:

which file must be edited to remove the right column from home/index page? I cannot find it anywhere.

A3:

The global.css of your current theme

Q4:

Hi, I don't know if it's because the version of prestashop I have is a newer one, but this code doesn't seem to be there in my global.css


body#index

how can I do it for the columns? the modules>position thing isn't working neither

Sorry to reopen this post, but I thought some of you might be able to help.

Thanks!

A4:

This code is not there is global.css... In fact, you have to add it to be able to hide some columns according to the current page....

e.g. The below code will hide both left and right columns on the index page,

body#index #center_column {width:951px}
body#index #right_column #left_column {display:none}

and this code will hide the right column on the category page,

body#category #center_column {width:951px}
body#category #right_column {display:none}

and this code will hide the left column on the product page,

body#product #center_column {width:951px}
body#product #left_column {display:none}

If you want to hide a module on some pages then you can do so by mentioning those page names in Exceptions list...

Modules | Positions | Edit | Exceptions

Q5:

thanks for the fast reply!

1. I added your code, but for some reason the left column keeps showing, I hope I didn't add text where I shouldn't :/

2. also, from te positions panel, I tried this, but it does nothing

A5:

1. You may need to clear your browser's cache if the modified CSS is not taking effect... You may also want to disable Smarty cache and enable force compile option for template cache as follows...

Advanced Parameters | Performance | Smarty section | Template Cache | select Force Compile option

Advanced Parameters | Performance | Smarty section | Cache | select 'No'

2. There should not be any issues with positions configuration... You may want to refer to prestashop user guide for configuring module positions...

...