Place Two Add-ons Next To Each Other - Question | JoomShaper
Black Friday sale is live with flat 50% OFF. Sale ends soon! Grab your deal now!

Place Two Add-ons Next To Each Other

SS

Stefan Scheidegger

SP Page Builder 3 years ago

Hi all,

how can I place two add-ons next to each other without a gap?

In my websites top bar I want to display a Navigation add-on with two navigation items next to each other and a Joomla module add-on with a shopping cart.

If I place the add-ons in two columns (i.e. 10+2), there is always a gap between the two addons because I can't set the column width to fit exactly the content width. If I place both add-ons in one column, the second add-on is diplayed on a new line.

What I want is something like display:inline-block, so both add-on blocks are displayed on the same line next to each other.

Also an extra question: Can I configure a Joomla module add-on to not reserve any space, if there is no content displayed? In my example I am aligning both add-ons to the right. I would like to hide the shopping cart, if it is empty. But I don't want empty space on the right, I want the navigation add-on to move all the way to the right, if the sopping cart is not shown. Is this possible?

Thank you very much, best regards Stefan

0
4 Answers
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 3 years ago #64957

Hi there!

Thanks for contacting us.

It seems you need to modify margin/padding values for your addons/columns to fit them well. Please make sure you have given them enough space to display.

If you give me your site URL where you are facing this issue along with screenshot indicating that would be better for us to understand.

For your extra question: It maybe possible but needs code customization, which is prohibited here.

Best Regards

0
SS
Stefan Scheidegger
Accepted Answer
3 years ago #64997

Hi Rashida,

thank you very much for your answer. The site is still under construction and not yet online. But I'm sending you a Page Builder export and a screenshot of an example page. Could you maybe insert your changes and send me an export of the version with your suggested solution?

Thank you very much, best regards

0
SS
Stefan Scheidegger
Accepted Answer
3 years ago #66546

Hi Rashida,

did you have a chance to check the export of the example page? Please let me know how to solve this problem.

Have a great day, Stefan

0
SS
Stefan Scheidegger
Accepted Answer
3 years ago #68514

Hi Rashida,

as I didn't hear back from you, I still can not test the solution you suggested.

In the meantime I checked how this is solved in Elementor, a page builder for Word Press. There, the user has the option to set the Add-on/Widget with to "auto", which places them next to each other, if there is enough space. In order for this to work, Elementor sets the Add-on/Widget container to flex.

I solved the problem in SP Page Builder by adding following code to the Helix Ultimate template custom.css:

#column-id-1634218561194 .sppb-column-addons
{
    display: flex;
    flex-wrap: wrap;
}

I consider this a feature request for future versions of SP Page Builder: I would like in Add-ons - Advanced to get an option to set Add-on with to auto, which would allow to display add-ons next to each other within the same column.

Best regards, Stefan

0