Theme Configurator: Ho can I add more Images on the same row?

[filipstudio]

The default theme comes with 5 pictures in the home hook: 3 equal images on the 1st row,  and 2 unequal images on the 2 row.
 
How could I change this layout?
 
I am trying to use 4, or 5 images on the same row, but even if I make them very small, they're still displayed on 2 rows.
 
Thank you.

[vekia]

make sure that there is enough space to display 4 images per row. if there is no space, images will be moved to the next row.

[filipstudio]

Unfortunately. this doesn't work. These 4 images are 200 px wide each... there should be plenty of space for them on a single row. The default theme comes with 3 images 383 px wide (each). Is there a different way to do this?

Thank you.

[vekia]

perhaps parent element has got restriction related to width? for example width:300px;

[valo]

have the same Problem.

the Template-Konfigurator have by default 3 Images in first Row and 2 Images in second row.

 

How is it possible to Change this layout.

For example 4 Images on each row ?

 

If i put the Images one by one in the right size (200 px width), the layout allowed only this default  configuration:

3 Images in first row and 2 Images in second row

[FurkyStyle]

Same problem here!

[Darius Webdevelopers]

Same problem. Any solution ? 

[vekia]

share urls please, 

this is probably simple problem related to css styles.

[Darius Webdevelopers]

share urls please, 

this is probably simple problem related to css styles.

 

Thanks for answering Vekia

http://chuwak.lt.anakonda.serveriai.lt/lt/

But I can't add any ITEM to other hooks like Hook "TOP" or other. B.O. says "Successfully updated", but no picture appears. 

 

Also there is a question is it possible to add more than 5 ITEMS to hook "Home" ? I would like to change size of 5th picture, and add one more. 

[vekia]

let's clarfiy.

you've got problem with width, or with something else?

at the moment i see there pictures

[Darius Webdevelopers]

let's clarfiy.

you've got problem with width, or with something else?

at the moment i see there pictures

Yes. Also with these. As you see you we have got 5 pictures (Items) in this hook (It is hook "Home") I can't add one more(6th.) to this hook. I would like to have 2x3 pictures.

And also can't add any Items to other hooks. 

[vekia]

okay, so what you see when you're trying to add next picture?

[Darius Webdevelopers]

okay, so what you see when you're trying to add next picture?

B.O. gives message that "Succesfully updated", but nothing happens at all. No new item added. 

[valo]

If i put the Images one by one in the right size (for example 200 px width), the layout allowed only this default  configuration:

3 Images in first row and 2 Images in second row

[Darius Webdevelopers]

If i put the Images one by one in the right size (for example 200 px width), the layout allowed only this default  configuration:

3 Images in first row and 2 Images in second row

Thanks valo,

 

Is is any possibility to gave 3 images in first row and 3 images in the second(pictures size the same)? 

Any hack of css? 

[danr87]

I tried to add the 6th picture to my own site, and it works. My theme configurator module is at version 0.10.

 

I don't understand why yours won't work.

 

I also moved my newly added banner to the TOP, and it works.

 

As for positions, and customizing them, its made with CSS

[Darius Webdevelopers]

I tried to add the 6th picture to my own site, and it works. My theme configurator module is at version 0.10.

 

I don't understand why yours won't work.

 

I also moved my newly added banner to the TOP, and it works.

 

As for positions, and customizing them, its made with CSS

Danr87 I have installed fresh copy of prestashop and tried to add 6th photo. the same problem! module version  0.10

[danr87]

Thanks valo,

 

Is is any possibility to gave 3 images in first row and 3 images in the second(pictures size the same)? 

Any hack of css? 

 

yes it is possible with CSS....

 

like in the example given earlier, you can change the width of the last picture to fit.

 

 

This theme CSS doesn't alter the height, which is a good thing. So you must keep the picture at the same height and width with the rest, and it will look ok

[danr87]

Danr87 I have installed fresh copy of prestashop and tried to add 6th photo. the same problem! module version  0.10

I checked a bit, and it looks like it has something to do with language

 

I only have 1 language, the other is deactivated

 

Look at this:

 

http://chuwak.lt.anakonda.serveriai.lt/en/

 

In the other language, its another photo.

 

So it probably works for you too, but you can;t see it , and you should have 2 sets of pictures, if you want 2 languages, or change them all on your desired language

Edited May 9, 2014 by danr87 (see edit history)

[Darius Webdevelopers]

I checked a bit, and it looks like it has something to do with language

 

I only have 1 language, the other is deactivated

 

Look at this:

 

http://chuwak.lt.anakonda.serveriai.lt/en/

 

In the other language, its another photo.

 

So it probably works for you too, but you can;t see it , and you should have 2 sets of pictures, if you want 2 languages, or change them all on your desired language

I have tried already disable languages. Also i have added different pictures to different languages, but result is the same. ... 

[danr87]

I have tried already disable languages. Also i have added different pictures to different languages, but result is the same. ... 

 

After you add new item, do you see it in your BO ?

 

Like i see mine ( 06 )

 

[Darius Webdevelopers]

After you add new item, do you see it in your BO ?

 

Like i see mine ( 06 )

 

No! I dont even see number "6"

[danr87]

No! I dont even see number "6"

 

This are my steps when i create a new one

 

 

add new element, choose title, choose hook, choose picture, save

 

and result:

 

 

If you've done the same, it's weird

[Darius Webdevelopers]

This are my steps when i create a new one

 

 

add new element, choose title, choose hook, choose picture, save

 

and result:

 

 

If you've done the same, it's weird

I am doing the same, bet i have no such result.

[valo]

okay, i think we have all the same Problem, but we don´t understand each other.

 

once again.

 

Problem:

the Default Theme allowedthis layout:

first Row: 3 Pictures

second Row: 2 Picture

 

ofcourse if the picture have the wrong weight it show completly incorrect.

But if the size are right (like 200 px weigt) the first 3 Images will be show in the first row.

 

if than we put the Image #4 it show in the second row.

Image #5 show in the second row too, with the size of the rest of second row.

 

 

[Darius Webdevelopers]

okay, i think we have all the same Problem, but we don´t understand each other.

 

once again.

 

Problem:

the Default Theme allowedthis layout:

first Row: 3 Pictures

second Row: 2 Picture

 

ofcourse if the picture have the wrong weight it show completly incorrect.

But if the size are right (like 200 px weigt) the first 3 Images will be show in the first row.

 

if than we put the Image #4 it show in the second row.

Image #5 show in the second row too, with the size of the rest of second row.

 

 

valo you're absoliutly right. I need that what you have written. 

[danr87]

give me the shop url, with all 8 pictures added, and i will correct them in CSS

[danr87]

Like this you mean right? :

 

i have 7 pictures, with width at 24%

 

i only need to change the small ones with better sized pictures.

 

For this example, you need to change global.css

and search:  .col-xs-4  and make the width 24% like this:

 

.col-xs-4 {

width: 24%;

/* height:219px; */   

/*remove the comments to enable the height. This is needed if you want to have smaller pictures like in the example shown. if you have the same height pictures already, this isn't necessary. it's 219px because when you change this height, you also affect the TOP HOOK, and it will look glitchy with less than 219px. SO, the best way is to have your pictures already with their height identical with each other*/

}

 

AND

 

in the hooks.css

 

search

#htmlcontent_home ul li.htmlcontent-item-5

 

 

#htmlcontent_home ul li {

/* delete the width:66.6667%;    leave it empty */

}

 

 

 

 

 

Edited May 9, 2014 by danr87 (see edit history)

[Darius Webdevelopers]

I need something like that,  but i can't upload the 6th picture - pants. 

[danr87]

I need something like that,  but i can't upload the 6th picture - pants. 

 

it's almost the same code.

 

instead of 24%, use 33%. 

 

.col-xs-4 {

width: 33%;

}

 

+

 

#htmlcontent_home ul li {

/* delete the width:66.6667%;    leave it empty */

}

 

 

 

it should work with 5 pictures also, i still don't know why you can;t upload the 6th....

 

Tell me if it works

[Darius Webdevelopers]

it's almost the same code.

 

instead of 24%, use 33%. 

 

.col-xs-4 {

width: 33%;

}

 

+

 

#htmlcontent_home ul li {

/* delete the width:66.6667%;    leave it empty */

}

 

 

 

it should work with 5 pictures also, i still don't know why you can;t upload the 6th....

 

Tell me if it works

 

Changing global.css & hooks.css works fine, but i have still problem in B.O.  with uploading 6th photo  

[Darius Webdevelopers]

darn87 

 

 

I have fresh copy of prestashop with the same problem of uploading 6th photo to hook HOME. I can give you connections to B.O. you can check it. 

[danr87]

darn87 

 

 

I have fresh copy of prestashop with the same problem of uploading 6th photo to hook HOME. I can give you connections to B.O. you can check it. 

 

ok, make a temp password and message me

 

I hope I can see something you didn't

[Darius Webdevelopers]

darn87 helped to solve problem. The problem was with Safari browser. Safari didn't uploaded photos. With Firefox everything is OK. 

 

I think this topic should be market [solved] 

 

Thanks for help. 

[peter433]

Thanks valo,

 

Is is any possibility to gave 3 images in first row and 3 images in the second(pictures size the same)? 

Any hack of css? 

Did you find a fix for this as i need the same solution

 

Peter

[philjo]

Hello all, 

 

you guys seem to know your stuff. Without appearing as a duch, I am trying to get this:

 

Do you think it is possible? 

 

I'm on latest prestashop using wamp server. 

01Responsive thème + theme configurator module. 

All Hooks from Home (demo default_Bootstrap) are vertically aligned... 

 

Thanks