Jump to content

Prestashop 1.6 category block next to image slider


Recommended Posts

  • 3 weeks later...

Hello sirs, 

I have the same problem. I want to place manufucturer module to the left of the slider. I have added a hook and the module is now hookable to the displaytopcolumn. But the problem is I cannot get the slider and the manufacturer modules to display side by side (in a row). it only display one above the other. Hope you understood. Please help me

Link to comment
Share on other sites

Another way to do this it to add a hook to the slider to hook it to displayHomeTab (not content) then remove it from DisplayTopColumn this will move the Slider to the center column and allow the left column to move up to header.

 

 

For a preview look here at my testing site, https://team-shepherdusa.com/shop14160t    (this is just a testing site)

 

if this is what your looking for copy and paste this around line 480 of homeslider.php

 

public function hookDisplayHomeTab($params)
{
return $this->hookdisplayTopColumn($params);
}

 

 

 

Now go to Modules, Positions, click on transplant a module select image slider for your homepage then select DisplayHomeTab (Home Page Tabs) and click save.

Now we need to remove the slider from the Top Column, scroll down to bottom of positions page and look for displayTopcolumn and unhhok the slider from this position.

If you do not see displayTopColumn you will need to edit the ps_hook in the database, go to database scroll down to ps_hook and click browse at top of page.

Scroll though the pages and look for displayTopColumn, (mine was id 120) click on edit and in the positions box just change the 0 to 1 and the hook will now show in BO so

you can now unhook the slider from top column.

 

Its not as complicated as it sounds just follow the steps and all will be fine.

Edited by tdr170 (see edit history)
  • Like 2
Link to comment
Share on other sites

Thanks sir tdr170 for the reply.

I am using the default template with PS 1.6.0.11 but not the default slider. Rather I am using sliders everywhere from the forum by misthero. The following is an advice from misthero the developer of sliders everywher concerning my problem. He said

”” like I said change the width and the position, go to positions and choose "right" and change the width 60%,this way you have 40% of space on the left for anything else you may need.””

That is what he said. The module I wish to add in the displaytopcolumn is the manufacturer module. I wand it to display on the left while the slider displays on the. (that is they will display side by side). Meaning that the displaytopcolumn will be two rows one for the manufacturer module and one for the slider. I want it this way because I don't want to enable the left column.

Actually I can manage to hook the manufacturer module to the displaytopcolumn but it doesn't want to stand side by side with the slider which is my main problem.

 

As misthero said I'll have 40% of the space in the displaytopcolumn free. The question is how do I make the manufacturer module stand in this 40% free space? It could be anything not just 40%.

Take a look at my site url: www.asso9.com and you will find the space in which I want to put the manufacturer module. Please help me

 

Cheers

Link to comment
Share on other sites

Please a basic example on how to wrap it in a div can help a great deal and also where exactly do I insert the clearing codes.

Is it in global.CSS? Or where exactly?

 

For example bellow is an extract of codes in global.css.

 

#home-page-tabs {

border: none;

background: #fff; }

@media (min-width: 768px) {

#home-page-tabs {

padding: 10px 0;

margin: 0 0 0 -18px; } }

#home-page-tabs > li {

margin-bottom: 0; }

@media (min-width: 991px) {

#home-page-tabs > li {

border-left: 1px solid #d6d4d4;

margin: 0 0px 0 9px;

padding: 0 0px 0 9px; } }

@media (max-width: 479px) {

#home-page-tabs > li {

width: 100%; } }

#home-page-tabs > li a {

font: 600 21px/24px "Open Sans", sans-serif;

color: #555454;

text-transform: uppercase;

border: none;

outline: none;

margin: 0;

padding: 10px; }

@media (min-width: 768px) {

#home-page-tabs > li a {

padding: 1px 10px; } }

@media (min-width: 768px) and (max-width: 991px) {

#home-page-tabs > li a {

padding: 10px 10px; } }

#home-page-tabs > li:first-child {

border: none; }

#home-page-tabs > li.active a,

#home-page-tabs > li a:hover {

background: #333;

color: #fff;

padding: 10px; }

@media (min-width: 768px) {

#home-page-tabs > li.active a,

#home-page-tabs > li a:hover {

margin: -9px 0; } }

@media (min-width: 768px) and (max-width: 991px) {

#home-page-tabs > li.active a,

#home-page-tabs > li a:hover {

margin: 0px 0; } }

 

 

 

where in this codes do I insert clear: both; to clear the home tabs?

 

Cheers

Link to comment
Share on other sites

Hello sir Nemo,

The clear function has worked like margic. Thank you a thaousand times.

The one issue left now is the gutter. How to create s gutter between the manufacturer module and the slider.

Cheers

Link to comment
Share on other sites

Well, see that block you have there, just find the corresponding closing tag. Then, before it opens, add another div <div class="col-xs-3">
And close it after the closing one </div>

That's what I mean by wrapping it :)

Link to comment
Share on other sites

  • 3 weeks later...

Please help me...

I am stucked in a situation where i want the block categories module to be displayed in the left side and next to it i want image slider for home page module...

i am searching for it since last 6 days but no solution..please help my PrestaShop version: 1.6.0.13 and i am using default theme

Edited by jsbmudit (see edit history)
Link to comment
Share on other sites

  • 1 year later...

Hi, dont understand, how to use hooks, what I need to do is place category block near image slider (main page) instead of theme configuration images (By default they are next to image slider)

 

 

 

Hi Gramas,

 

you can do this in just a few clicks with Presta-theme-maker.com, I made a very quick design for a demonstration (picture attached)

 

http://presta-theme-maker.com/

 

Cheers,

 

Andrej

post-48475-0-23964600-1461308601_thumb.png

Link to comment
Share on other sites

  • 9 months later...

Another way to do this it to add a hook to the slider to hook it to displayHomeTab (not content) then remove it from DisplayTopColumn this will move the Slider to the center column and allow the left column to move up to header.

 

 

For a preview look here at my testing site, https://team-shepherdusa.com/shop14160t    (this is just a testing site)

 

if this is what your looking for copy and paste this around line 480 of homeslider.php

 

public function hookDisplayHomeTab($params)
{
return $this->hookdisplayTopColumn($params);
}

 

 

 

Now go to Modules, Positions, click on transplant a module select image slider for your homepage then select DisplayHomeTab (Home Page Tabs) and click save.

Now we need to remove the slider from the Top Column, scroll down to bottom of positions page and look for displayTopcolumn and unhhok the slider from this position.

If you do not see displayTopColumn you will need to edit the ps_hook in the database, go to database scroll down to ps_hook and click browse at top of page.

Scroll though the pages and look for displayTopColumn, (mine was id 120) click on edit and in the positions box just change the 0 to 1 and the hook will now show in BO so

you can now unhook the slider from top column.

 

Its not as complicated as it sounds just follow the steps and all will be fine.

 

Finally I found it  :D

Thank you very much to share it 

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...