GET 20% OFF on Joomla Templates & Extensions Developer Plan - Use Coupon Code at Checkout dev20

Support Forums

Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

5 column layout for pagebuilder

Featured Lock Resolved
hello, i just recently purchased sp pagebuilder and i need to make a layout 5 equal columns. (20%, 20%, 20%, 20%, 20%) for one of my pages.

i have been trying to adjust the layout but it keeps giving me the "Error generated. Please correct your column arrangement and try again."

Can someone help me out with this? my layout must be 5 columns - no other options. if i have to do something custom to set it up that is fine, i just need a hand getting it set up.

thank you!

10 Answers

Toufiq - Staff

More than a month ago #Permalink
Hi,

Thanks for your query. Sp page builder does not exist this feature to make 5 column in row. Besides if you want to do 5 column, then you can increase core css file. But it could be hamper other css.
components\com_sppagebuilder\assets\css

.sppb-col-sm-2 {
width: 16.66666667%;
}


And replace this code

.sppb-col-sm-2 {
width: 20%;
}


-Thanks

pedro olaia

More than a month ago #Permalink
You can try to use one row with 2 colunms (9/3) or (10/2) and then inside of the larger colunm insert 4 iqual colunms (3/3/3/3). The end result will be 5 colunms, will not be perfect or exacly what you want, but preaty close to it. Then you can try to ajust colunms with a bit of margin and padding...

But ye, It would be awesome if joomshaper guys could implement an extra rule for 5 colunms.

There are lots of exemples of it, heres one:
https://coderwall.com/p/-uxgaq/5-columns-layout-with-twitter-bootstrap

Nico

More than a month ago #Permalink
Hello,

Why don't you do a :

1+2+2+2+2+2+1

Like this you do have 5 columns, more space on left and right, but it might not be a problem ?
Cheers

Mohammed Ahmed

More than a month ago #Permalink
It's definitely strange to not be able to divide by 20%!

Paul Frankowski - Staff

More than a month ago #Permalink
It's bootstrap gird.
---
Beside, "SP Page Builder 1.x" is not supported anymore.
We develop only 3.x now.

Federica Satta

More than a month ago #Permalink
Hi,

Thanks for your query. Sp page builder does not exist this feature to make 5 column in row. Besides if you want to do 5 column, then you can increase core css file. But it could be hamper other css.
components\com_sppagebuilder\assets\css

.sppb-col-sm-2 {
width: 16.66666667%;
}


And replace this code

.sppb-col-sm-2 {
width: 20%;
}


-Thanks


Doesn't work for me.. can you be more precise?
in which file should be included the script? in css folder there are many!
After the script change where it should comes the option for 5 columns?
Thank's
Federica

Paul Frankowski - Staff

More than a month ago #Permalink
Search in SP Page Builder 3.x category, I remember that someone gave temporary fix for it.

Paul Frankowski - Staff

More than a month ago #Permalink
custom CSS can be used , for example here

custom_css_for_pages_sppb.png

Attachments (1)

  • custom_css_for_pages_sppb.png
    custom_css_for_pages_sppb.png 7.6 KB

Federica Satta

More than a month ago #Permalink
custom CSS can be used , for example here

[attachment]custom_css_for_pages_sppb.png[/attachment]


Dear Paul.
thank you ! This is working fine for me!


There are no replies made for this post yet.
However, you are not allowed to reply to this post.

Leaderboard (30 days)

Paul Frankowski

Paul Frankowski

Total Accepted Answers: 175
Sifat

Sifat

Total Accepted Answers: 94
Toufiq

Toufiq

Total Accepted Answers: 77
Pavel

Pavel

Total Accepted Answers: 4
SS

SuperSys IT Services

Total Accepted Answers: 2

100+

Templates

200,000+

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us