Return to previous page

Pop-up and countdown - by MJ - on WordPress WooCommerce support

This topic has 7 replies, 2 voices, and was last updated 3 years ago ago by MJ

MJ

Participant

October 28, 2021 at 10:28

Hi
1. i’d like to activate popup window for my home page. how to do that?
2. I created static block “download-pop” that i wish to appear as pop-up window when i click a button (i put the block link in homepage last button). when i click it goes not open as popup. how can i open it as popup?
i want to achieve this https://gyazo.com/936512c93f3f69424dc2e101b07347b2 with close-window option.
3. any suggestion for creating countdown after clicking the button? i found some scripts online that need to put in Footer.php, however, i need your advice if that is ok to do?
Thanks

Please, contact administrator
for this information.

#306817 Copied Theme version: 8.0.8

6 Answers

Rose Tyler

Support staff

October 28, 2021 at 13:47

Hello,

You can create a static block with the desired content. Add Newsletter element into the header content via Header builder, or use Fancy Button element into the page content – https://prnt.sc/1xluq3d
You can use Countdown element into the static block content, just enable WPBalery for static blocks – https://www.8theme.com/documentation/xstore/support/static-blocks/

Regards

#306863 Copied

MJ

Participant

October 29, 2021 at 03:01

Hi Rose,
Please check my home page the last button. I did apply what you suggested.
I have 2 issues:
1. the issue with appearance. I did create custom CSS class shown below for my links and they are automatically applied to fancy button without me using the class in the setting. i wonder how i can exclude it?
https://gyazo.com/25566e43b476eb8166e515c596c48b22
Is there anyway i can use my normal buttons to trigger pop-ups (that would be perfect)?
———————————————————-
/* Custom text underline and animation*/
.button-wrap a{
text-decoration: solid underline #fbfbfd 4px !important;
text-underline-offset: 2px !important;
}
.button-wrap a:hover{
text-decoration: solid underline #FFD434 4px !important;
text-underline-offset: 2px !important;
}

.button-wrap :hover {
-webkit-animation: bounceright .7s alternate ease infinite;
animation: bounceright .7s alternate ease infinite;
}
@-webkit-keyframes bounceright {
from { -webkit-transform: translateX(0); }
to { -webkit-transform: translateX(4px); }
}
/* Footer custom text underline and animation*/
.link-underline a{
text-decoration: solid underline #818181 2px !important;
text-underline-offset: 2px !important;
}
.link-underline a:hover{
text-decoration: solid underline #FFD434 2px !important;
text-underline-offset: 2px !important;
}

/* Change footer font-size and line-height */
.footer-widget li a {
font-size: 15px !important;
line-height: 1.0;
}
———————————————————————
2. upon clicking the button, i’d like it to pop-up over the button, and popup window width matches the size of button itself with smaller cross (close option). is there any CSS to force that something like this https://prnt.sc/1xo69va
or
https://prnt.sc/1xo8e9c

Thanks

#306902 Copied

Rose Tyler

Support staff

October 30, 2021 at 15:56

Hello,

1/ We’ve changed custom CSS code – https://prnt.sc/1xu7854 Clear cache and check now.
2/ There is no such option.

Regards

#307069 Copied

MJ

Participant

November 2, 2021 at 07:46

Thanks Rose!
for number 2: can we at least make the pop-up full width on mobile something like https://prnt.sc/1y4wrkt

#307248 Copied
Rose Tyler

Support staff

November 2, 2021 at 08:14
Hello,

Try to add the next code in Theme Options > Theme custom CSS > Mobile:
```
#etheme-popup-holder {
    left: 6%;
    transform: translate(-3%, -50%);
}
```
Regards
#307252 Copied
MJ

Participant

November 3, 2021 at 07:56

Great thanks

#307357 Copied
Tagged: countdown, deals, discounts, pop up, themes, woocommerce, wordpress
Viewing 7 results - 1 through 7 (of 7 total)