Pop up modal within pricing table - Forum | JoomShaper
Solved SP Page Builder

Pop up modal within pricing table

Asked by Günther Klauser 4 years ago Last activity 4 years ago

Hi there,

I'm trying to build a button within a pricing table (there is already a button, but not the way I want to) that should open a modal pop up (the site is using onepage design).

I know there is an addon, which can achieve this. But I want the pricing table button to open the modal, not any button outside the table.

Is there any possibility? Thanks!

Accepted answer

Marked as the solution
Paul Frankowski Senior Staff

Done, you have centered now.

Inside that page Custom CSS I added

.sppb-text-center a.sppb-modal-selector {
  text-align: center;
  display: block;}

5 more replies

Paul Frankowski Senior Staff
4 years ago · edited

Hi Günther,

inside modal addon you cannot use any other addon, you can use only image or text box.

So my quick idea is... do Pricing table using addon and make screenshot and use that image inside Modal addon.
Maybe not perfect solution, but works without any hacks or extra extension.

Günther Klauser Asked this

Hi Paul,

I just want to to use the things the other way round. I want the button inside the pricing table to open a modal. Within this modal only text or html is used.

I can change the URL the pricing table button links to, but how can I achieve that the link will open a modal?

Paul Frankowski Senior Staff

Sorry but addon php code customization is beyond support.

Maybe put 3x Modal Addons below, under the pricing addon and set white bg for columns.

Günther Klauser Asked this

Thanks Paul for your answer. Tried it and it works, but I want the caption of the button under the pricing table in center. Changed properties of the css class .sppb-text-left to text-align: center but no effect. Other custom css codes works fine (I'm using custom.css).

Best regards!

Günther Klauser Asked this

Great! Thank you very much. Could be that easy, if knowing which classes are effected...

Log in to reply.