We’re with you. JoomShaper is offering a 20% Discount on all plans due to the impact of COVID-19.

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

Your Time: Our Time:

Good "Super Simple Contact Form" conflicts with SP Page Builder...

Featured Lock Resolved Issue
This is the best solution I've ever seen for feedbacks / callbacks for Landing Pages and sites:
https://extensions.joomla.org/index.php?option=com_jed&view=extension&layout=default&id=9502
  Never had any problems with it, but with the Page Builder something goes wrong with z-indexes:
It is overlapped by the bottom elements (in modal mode):
https://snag.gy/aGSchp.jpg

Increasing of the "z-index" for modal window does not solve the problem:
http://demo.ofestival.ru/#contact-form

Please help me find a solution!

10 Answers

Paul Frankowski - Staff

More than a month ago #Permalink
Hi,
In Custom CSS please use this:

.mypopup-content {padding: 30px 15px 15px; }
.sscf-form textarea,
.fl_wrap_textarea {height: 150px !important;}
.mypopup-wrapper {
top: 40% !important;
max-height: 80%;}

custom_css_field_helix3.png
ok.png

Attachments (2)

  • custom_css_field_helix3.png
    custom_css_field_helix3.png 9.9 KB
  • ok.png
    ok.png 31.5 KB

kupala

More than a month ago #Permalink
Paul, thanks for the quick reply!
Custom.css slightly changes the shape and position of the window but it still overlaps with Page Builder blocks...
I changed the parameters for a better example:

.mypopup-content {padding: 30px 15px 15px; }
.sscf-form textarea,
.fl_wrap_textarea {height: 500px !important;}
.mypopup-wrapper {
top: 55% !important;
max-height: 80%;}

http://demo.ofestival.ru/#contact-form
(Please, scroll the button to the top of the screen and push)
https://snag.gy/ful3Mw.jpg
Result:
https://snag.gy/qz97nP.jpg

The problem occurs only with the Page Builder content. On other pages with the shaper_helix3 template everything is fine!

Paul Frankowski - Staff

More than a month ago #Permalink
have you tried to change z-index

.mypopup-content { z-index: 91;}
.mypopup-wrapper {z-index: 911;}

Paul Frankowski - Staff

More than a month ago #Permalink
sorry, you have to ask "Super Simple Contact Form" developer for help, he should know why window bottom is cut.
Or change popup script.

kupala

More than a month ago #Permalink
I have tried to change z-index - not working...

Paul Frankowski - Staff

More than a month ago #Permalink
sorry, I cannot help more.
Do what I suggest you last time.

Marco

More than a month ago #Permalink
Hi kupala,

The problem is that the section (page builder row) where the button resists has same z-index than a following section. And so the z-index 9999999 of the pop-up is not taken in consideration.

if you didn't solve this so far: here is how i did it:
1)
Under the row where the joomla module addon for the mailform is added: enter a css class name under Style-CSS Class (e.g. "mailpopup" - choose one of your own)
2)
Add ".mailpopup {z-index: 5 !important;}" to your custom.css file when you are using HELIX template or add it to your own css override file if you use different template.

Now the sbbp-section (row) has a higher z-Index and your popup will be also be displayed infront of the next folllowing section.

Cheers
Marco.

Marco

More than a month ago #Permalink
Hi again,

of course when you want to avoid "!important" in your CSS instruction you can also use

#sp-page-builder .page-content .mailpopup {
z-index:5;
}

for full cascade of the css style definition in the custom.css file.

Cheers
Marco.

kupala

More than a month ago #Permalink
Many thanks, Marco!
I will try this solution.

kupala

More than a month ago #Permalink
Thanks again, Marco!
It works great!
https://snag.gy/0RaTwU.jpg


There are no replies made for this post yet.
Be one of the first to reply to this post!

124

Templates

331450

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