Updated with new need: Weebly Promote contact popups

[mschumpert]

Ok, I finally figured out how to remove the Promote popup...(I can't seem to get rid of Mailchimp though...see comment) 

I do like the promote popups...Now I was wondering if it was possible to use any kind of additional coding to make certain they looked a certain way (or at least looked good) on mobile. See the way it displays...

I'd like to add the pop up back on to my site, but have it appear all at once without anything getting cut off...is that possible?

Original post request: I added a Promote popup on my site (surfgroundswell.com) ... it didn't look good on mobile, so i disconnected the app and republished...the popup still shows up...how do i get rid of it? thank

[mschumpert]

also, i was testing using a mailchimp popup on a different page, had trouble making the code work...i tried inputting the code into the header, and it started working. I then deleted it to try something different, but it still pops up! what am i overlooking?

[Bernadette3]

HI there. I'm not seeing the popup on your site. Is it on the homepage? 

[mschumpert]

Thanks Bernadette,

I just changed my post with an update...I finally figured out how to remove the Promote popup...(I can't seem to get rid of Mailchimp on my other site though...see my previous comment) 

I do like the promote popups...I'm now wondering if it is possible to use any kind of additional coding to make certain they looked a certain way (or at least looked good) on mobile? See the way it displayed before I took it down...

I'd like to add the pop up back on to my site, but have it appear all at once without anything getting cut off...is that possible?

tia!

[Adam7]

It might be possible to fix that with custom CSS. I'm surprised it's cutting cut off like that, though. Do you have any experience with HTML and CSS? It's possible a member of our Community could provide some help with that, although they'd probably need to see the popup on the live site.

[mschumpert]

Hey Adam, re: experience, I've successfully followed instructions you guys at Weebly have given me to do html and css stuff. 

re: live site, i didn't want to put it back on my main site, but I put a similar quick popup here... testingfor91devco.weebly.com

it looks like this on two different phones...still shows the pic getting cut off on one, and not being able to see the whole popup on the other:

 

I'd like to see that pic! or is it possible to make this popup like one of those floater tabs?

thanks!

[BJ5]

I checked the site for you but I only see a mailshimp ad.

[mschumpert]

yes, i removed it...should i put it back to help troubleshoot?

[BJ5]

Yea, that would help. Thanks!

[mschumpert]

ok, i installed it again on my test site at www.testingfor91devco.weebly.com

i'd like to figure out how to prevent the pic from getting cut off at top and bottom, and on some devices, i can't see the whole form...

also, a new problem has developed...underneath the all fruit text, i put some custom code for a floating feedback button...it was working until i put the promote form back on the site...suggestions as to how to keep both? or display the button after the promote form is submitted or "x"ed out? 

Thanks!

[BJ5]

They must share some similar css selectors for that to happen. Try this in Settings >  SEO > Header Code to see if it works on the live site:

<style>
    @Media screen and (max-width: 30em), screen, projection
    {
        .leadform--popup .leadform-widget-container.popup_50-50 .leadform-imagedrag
        {
            background-position: 50% 20% !important;
        }
        .leadform-popup-widget .leadform-popup-container.leadform-popup-container--split, 
        .leadform-popup-widget .leadform-popup-container.leadform-popup-container--50-50 
        {
            height: 80% !important;
            margin-top: 25px !important;
        }
    }
</style>

[mschumpert]

thanks for your efforts...i copy and pasted the script into the header, but it didn't work...i think i did everything right...in case it matters or makes things easier, the main thing I want to do is zoom the picture out on mobile, or have it cropped in a way that it looks similar to what it looks like on desktop...it loses it's meaning with the guys head cut off...thanks!

[BJ5]

That's ok. Sometimes it takes a bit of trial and error. Try this instead, I tweaked it slightly. If it doesn't work, can you leave it in place on the live site so I can see what it's doing?

<style>
    @Media screen and (max-width: 800px)
    {
        .leadform--popup .leadform-widget-container.popup_50-50 .leadform-imagedrag
        {
            background-position: 50% 20% !important;
        }
        .leadform-popup-widget .leadform-popup-container.leadform-popup-container--split, 
        .leadform-popup-widget .leadform-popup-container.leadform-popup-container--50-50 
        {
            height: 80% !important;
            margin-top: 25px !important;
        }
    }
</style>