Just a quick question. Is there a pop-up builder plugin that is compatible with Salient and where I can use the WP Bakery Visual Composer to create the look and feel of that pop-up?
If so, which one would you recommend?
I did some research but I have no idea which one to choose / buy - OptinMonster, Popup Builder, Popup Maker etc?
Thank you. I've made a great start with pop-up maker. I do have a question about it. Within Popup maker it is possible to create the content using the Salient page builder which is a great function by the way.
On this page: https://zeal.kleidi.nl/ the bottom left icon (Team ZEAL) has a pop-up triggered when clicking on it. You will see the same as the attached screenshot. As you can it has 6 columns. Only the first column has the same white space on the left and right side. The second column (and third, fourth, fifth and six) have more space as it seems. How is this possible? The settings are the same.
About editing the popup with the builder, go to Dashboard > WP Bakery > Role manager and select custom. You can then select popup to allow the builder to be used on the popup.
Thanks. That fixed it! But I do have the same problem with a different pop-up. I imagine it's because of a different column lay-out? This is the page: https://zeal.kleidi.nl/ and it's the pop-up if you click on 'Reviews'.
I've created another pop-up here: https://zeal.kleidi.nl/ when you click on the Blue Word icon which says: "Wie is ZEAL". You can see it attached as a screenshot. But there are two very small borders visible on the left and right side of this column/element.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
On this page: zeal.kleidi.nl there is a pop-up for the icon "reviews" but when I open it the single image items are very big. I want them to be 50x50 px. How to fix that?
As an alternative I entered the first image as a text block, but even though I have checked the box equal heights columns it's not showing on the same line.
I would prefer the first option but I don't know if that is possible.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
I have a pop-up called 'Onze ambassadeurs' on the bottom right. When you click on it there is an image inside, but it is showing very big. It wasn't like that before. How to make it fit agin inside of the pop-up?
In addition to this I have a pop-up which is called 'Wie is ZEAL' on the top left corner. It shows nicely when you click on it but when scaling it to a smaller screen size the top of the header of that pop-up (which is an image) is deleting a part of the top (see attached screenshots).
This is the code that I've used:
@media only screen and (max-width: 1400px) and (min-width: 1000px) { #popmake-337.pum-container .pum-title { background-size:cover !important; height:110px; color: transparent; }}
@media only screen and (max-width: 1800px) and (min-width: 1401px) { #popmake-337.pum-container .pum-title { background-size:cover !important; height:160px; color: transparent; }}
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
.pum-content .full-width-section img {
height: auto !important;
max-width: 100%;
}
After this there occurred something else. In the height but also in the width, when you scale down, it repeats the image below each other or next to each other. How to disable that?
Hi there,
Just a quick question. Is there a pop-up builder plugin that is compatible with Salient and where I can use the WP Bakery Visual Composer to create the look and feel of that pop-up?
If so, which one would you recommend?
I did some research but I have no idea which one to choose / buy - OptinMonster, Popup Builder, Popup Maker etc?
Also +1 for future request :)
Thanks in advance!
Hello Tes,
There’s no built-in modal element, but Salient provides support for the popular plugin: https://wordpress.org/plugins/popup-maker/
Thanks for suggesting it we will consider it for our future updates.
Thanks.
Hi,
Thank you. I've made a great start with pop-up maker. I do have a question about it. Within Popup maker it is possible to create the content using the Salient page builder which is a great function by the way.
On this page: https://zeal.kleidi.nl/ the bottom left icon (Team ZEAL) has a pop-up triggered when clicking on it. You will see the same as the attached screenshot. As you can it has 6 columns. Only the first column has the same white space on the left and right side. The second column (and third, fourth, fifth and six) have more space as it seems. How is this possible? The settings are the same.
And more importantly, how can we fix it?
Thanks in advance.
best regards,
Tes
Hello Tes,
Use the following CSS>
.wpb_column.child_column.border_color_dbdbdc > .vc_column-inner { border: none; } .wpb_column.child_column.border_color_dbdbdc { border-right: 1px solid #dbdbdc; }Thanks,
About editing the popup with the builder, go to Dashboard > WP Bakery > Role manager and select custom. You can then select popup to allow the builder to be used on the popup.
Thanks,
Hi Andrew,
Thanks. That fixed it! But I do have the same problem with a different pop-up. I imagine it's because of a different column lay-out? This is the page: https://zeal.kleidi.nl/ and it's the pop-up if you click on 'Reviews'.
See attachment.
Thanks in advance.
Best regards,
Tes
Hello again,
Use the following CSS.
#popmake-350 .col.padding-2-percent > .vc_column-inner { padding-left: unset; }Thanks,
Thanks!
I've created another pop-up here: https://zeal.kleidi.nl/ when you click on the Blue Word icon which says: "Wie is ZEAL". You can see it attached as a screenshot. But there are two very small borders visible on the left and right side of this column/element.
How to fix that so it's not visible anymore?
Thanks in advance.
Hello again,
The black border appears all round. Do you want to remove this?
Yes, please!
Hi Tes,
I am not seeing the border from my end anymore, were you able to remove it:
Thanks.
Hi Judith,
No, but I began to think this might be a browser issue? I'm still seeing the border in Google Chrome.
Were you able to test this on other devices ?.
Thanks
ThemeNectar Support Team
It's disabled for smartphones and tablets. But I can see it on Safari as well. It shows a small border on the left and right side.
Hey Again,
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
#border-wie { background: #fff !important; }Thanks
ThemeNectar Support Team
Yes, awesome. Thanks!
Hi there,
On this page: zeal.kleidi.nl there is a pop-up for the icon "reviews" but when I open it the single image items are very big. I want them to be 50x50 px. How to fix that?
As an alternative I entered the first image as a text block, but even though I have checked the box equal heights columns it's not showing on the same line.
I would prefer the first option but I don't know if that is possible.
Hey Again,
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
.pum-container .img-with-aniamtion-wrap .hover-wrap .hover-wrap-inner img.img-with-animation { height: auto; width: 100% !important; }Thanks
ThemeNectar Support Team
Hi Tahir,
I have a pop-up called 'Onze ambassadeurs' on the bottom right. When you click on it there is an image inside, but it is showing very big. It wasn't like that before. How to make it fit agin inside of the pop-up?
Thanks.
In addition to this I have a pop-up which is called 'Wie is ZEAL' on the top left corner. It shows nicely when you click on it but when scaling it to a smaller screen size the top of the header of that pop-up (which is an image) is deleting a part of the top (see attached screenshots).
This is the code that I've used:
@media only screen and (max-width: 1400px) and (min-width: 1000px) {
#popmake-337.pum-container .pum-title {
background-size:cover !important;
height:110px;
color: transparent;
}}
@media only screen and (max-width: 1800px) and (min-width: 1401px) {
#popmake-337.pum-container .pum-title {
background-size:cover !important;
height:160px;
color: transparent;
}}
Hi guys,
Could you provide me with an update about the two requests below?
That would be awesome.
Thanks!
Hey Again,
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
.pum-content .full-width-section img { height: auto !important; max-width: 100%; }Thanks
ThemeNectar Support Team
Also try using the
so there is no cropping.
Thanks
ThemeNectar Support Team
Yes, awesome. Thanks.
After this there occurred something else. In the height but also in the width, when you scale down, it repeats the image below each other or next to each other. How to disable that?
Use this
Thanks
ThemeNectar Support Team