Jump to content

Recommended Posts

9 hours ago, LeeFoster said:

I want the gallery on the left and because of the size everything else gets pushed below it.

Just set gal to 6 wide and anything that needs to sit next to it has to be 6 or less in width. Just remember any row can only be 12 wide so if an item is 12 wide it can not sit next to any other item. You can have any number of items next to each other as long as the all add up to no more than 12.

Maintaining this layout on all screen sizes is simply not posiable as Bootstrap will reoder based on screen size. You will need to add much more css to maintain any layout over diferent screen sizes.


 

Share this post


Link to post
Share on other sites

I have set as below 

Name = 10 & 12

Gallery = 20 & 6

Price = 30 & 6

Buy button = 40 & 6

Share buttons = 50 & 6

Tabbed description = 60 & 12 

This is how it looks 

image.png.e4ab845b9793f80039256f7884879bc8.png

Share this post


Link to post
Share on other sites

An issue you might get,  depending on the screen width is if the description runs out longer than the images you can get a gap underneath the gallery.

There is not a way to get the description to start to the right of the image and then wrap underneath it without code changes/replacement modules.


For a new install or if your store isn't mobile-friendly, get the community-supported responsive osCommerce (Phoenix).

here: on the official osc download page

Working on generalising bespoke solutions for Quickbooks integration, Easify integration and pay4later (DEKO) integration at 2.3.x

Share this post


Link to post
Share on other sites

Keep it simple and clean. 

Make the buy button/text visible.

Use high quality images.

And the OP layout looks decent!

 

Share this post


Link to post
Share on other sites
11 minutes ago, LeeFoster said:

I have set as below 

Name = 10 & 12

Gallery = 20 & 6

Price = 30 & 6

Buy button = 40 & 6

Share buttons = 50 & 6

Tabbed description = 60 & 12 

This is how it looks 

image.png.e4ab845b9793f80039256f7884879bc8.png

There are a couple of things that could force those 6-widths down: styling making something wider than it should be, and left/right floats


For a new install or if your store isn't mobile-friendly, get the community-supported responsive osCommerce (Phoenix).

here: on the official osc download page

Working on generalising bespoke solutions for Quickbooks integration, Easify integration and pay4later (DEKO) integration at 2.3.x

Share this post


Link to post
Share on other sites

Just tested on Phoenix 1.0.1.2 and out of the box I'm not abe to produce what you need. I would suspect that some aditional css changes are required.


 

Share this post


Link to post
Share on other sites
50 minutes ago, LeeFoster said:

No code changes?

The only code changed was mentioned in the original thread you found. It was CSS added to the user.css file to control the length of the image placeholder. I did also add some padding to the buy now button as I wanted to make that intl a module which would have had padding in it but that has been done now in the latest version.

I am about to try the same thing on the latest Phoenix version so it will be interesting to see if it still works.


REMEMBER BACKUP, BACKUP AND BACKUP

Get the latest Responsive osCommerce CE (community edition) here

It's very easy to over complicate what are simple things in life

Share this post


Link to post
Share on other sites
13 minutes ago, JcMagpie said:

Just tested on Phoenix 1.0.1.2 and out of the box I'm not abe to produce what you need. I would suspect that some aditional css changes are required.

I'm on Edge bs4 and I suspect the same. Just don't want to hard code css changes and break it in mobile view.

Share this post


Link to post
Share on other sites
10 minutes ago, LeeFoster said:

I'm on Edge bs4 and I suspect the same. Just don't want to hard code css changes and break it in mobile view.

You are right. I have just tried and regardless of what I try  I cannot replicate the layout I had in Frozen. Something somewhere must have changed. I have had a quick look through the module files and the template files and they look very much the same. . I will have to dig deeper.


REMEMBER BACKUP, BACKUP AND BACKUP

Get the latest Responsive osCommerce CE (community edition) here

It's very easy to over complicate what are simple things in life

Share this post


Link to post
Share on other sites
1 minute ago, 14steve14 said:

You are right. I have just tried and regardless of what I try  I cannot replicate the layout I had in Frozen. Something somewhere must have changed. I have had a quick look through the module files and the template files and they look very much the same. . I will have to dig deeper.

Thanks it's much appreciated. 

Share this post


Link to post
Share on other sites
7 minutes ago, LeeFoster said:

Thanks it's much appreciated. 

It may be worth contacting Gary and see what he says as it was his suggestion last time that it should just work. He may know what is different.


REMEMBER BACKUP, BACKUP AND BACKUP

Get the latest Responsive osCommerce CE (community edition) here

It's very easy to over complicate what are simple things in life

Share this post


Link to post
Share on other sites
2 minutes ago, 14steve14 said:

It may be worth contacting Gary and see what he says as it was his suggestion last time that it should just work. He may know what is different.

@burt Can you offer any insight please?

Share this post


Link to post
Share on other sites

BSv4 uses Flexbox and does not have a "masonry" style capability at the moment.

This approach that can be used in BSv3 cannot be used in BSv4.


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites
4 minutes ago, burt said:

BSv4 uses Flexbox and does not have a "masonry" style capability at the moment.

This approach that can be used in BSv3 cannot be used in BSv4.

Thanks @burt

Share this post


Link to post
Share on other sites

You'll notice none of those examples show an output like the image posted earlier.  They are all in standard rows.


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites
20 minutes ago, burt said:

You'll notice none of those examples show an output like the image posted earlier.  They are all in standard rows.

What;s the best way to achieve it then? Or is it a case of it cant?

Share this post


Link to post
Share on other sites
4 minutes ago, LeeFoster said:

What;s the best way to achieve it then? Or is it a case of it cant?

Idea:

Chop up the product_info page and make modules installable per chopped section. 

Like the navbar is done (home, left, right).   

That adds in different problems but may be a solution that works.  Would take some hardcore coding though.

 


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites
Posted (edited)
4 minutes ago, burt said:

Idea:

Chop up the product_info page and make modules installable per chopped section. 

Like the navbar is done (home, left, right).   

That adds in different problems but may be a solution that works.  Would take some hardcore coding though.

 

So a Left, Right, Top, Bottom. May be a lot more work then I'm wanting to do on this at the moment.

Could it not be done easier with card-columns?

Edited by LeeFoster

Share this post


Link to post
Share on other sites
Just now, LeeFoster said:

So a Left, Right, Top, Bottom. May be a lot more work then I'm wanting to do on this at the moment.

You've already seen the problem.  

What if someone else wants;

Top
Left Right
Left Middle Right
Left
Bottom

And then someone else wants

Left Right
Full
Full
Left RIght
Full

Put simply;

  • The overall controlling module would need to be able to be changed to any layout needed. 
  • Then the modules would need to dynamically pick up available slots.

Good Luck with that!


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites
Posted (edited)
2 minutes ago, burt said:

You've already seen the problem.  

What if someone else wants;

Top
Left Right
Left Middle Right
Left
Bottom

And then someone else wants

Left Right
Full
Full
Left RIght
Full

Put simply;

  • The overall controlling module would need to be able to be changed to any layout needed. 
  • Then the modules would need to dynamically pick up available slots.

Good Luck with that!

Yeah that's a bit beyond me

Edited by LeeFoster

Share this post


Link to post
Share on other sites
Posted (edited)
1 hour ago, LeeFoster said:

Yeah that's a bit beyond me

It all depends on what you are trying to do. If you are just looking to fix one layout get it right and then never wanting to mess with it  then the solution is very easy.

Decide on the key layout you wish to fix, ie top line then one left and one right. Hardcode that into your product info page, then any othe stuff can be added as normal below that.

You are basicly trying to do fixed yet responsive layout for part of your page which can be done with BS4.

https://www.tutorialrepublic.com/twitter-bootstrap-tutorial/bootstrap-fixed-layout.php

If your going be chainging the product info layout every week, month, year..... then you have more work to do.

Question gets even more intresting if you wish to have a diferent layout per product type!

Edited by JcMagpie

 

Share this post


Link to post
Share on other sites
7 minutes ago, JcMagpie said:

Question gets even more intresting if you wish to have a diferent layout per product type!

What do you mean?

Share this post


Link to post
Share on other sites

Well a simple product like a M5 screw costing 1p may only need a simple basic layout. A complex power tool costing a few £k may need a far more complacated layout. The one size fits all is not allways the best sollution but that's another discussion not relavent to your question.


 

Share this post


Link to post
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

×