Call to Action Popup

[BomAle]

Now I'm on the phone... tomorrow I'll write you a template as follows:
- set the image at an angle at the bottom right, use a background gray taken from the image
- overlap and align a full-height box and half width on the left for the content and registration form.

Edited September 9, 2018 by BomAle

[steadyoptions]

Wow, that would be great, really appreciate it! I assume it will be mobile friendly?

[BomAle]

Quote

I assume it will be mobile friendly?

it's a main feature on this plugin 👍

Content

<p>
	<span style="color:#c0392b;"><span style="font-size:20px;"><strong>Join our trading community</strong></span></span>
</p>

<p>
	<span>Hello, I am Kim, founder of SteadyOptions.</span><br>
	<span>Our mission is to help you to become a better trader.</span>
</p>

Template

<div id='bacalltoactionpopup' data-controller='plugins.bacalltoactionpopup' class="ipsHide"
	data-size="{$p->size}"
	data-modal="{$p->modal}"
	data-content="{$p->content}"
	data-title="{$p->title}"
	data-close="{$p->close}"
	data-close-on-click="{$p->closeOnClick}"
	data-open-on-click="{$p->openOnClick}"
	data-class-name="{$p->className}"
	data-transition-popup-show="{$p->transitionPopupShow}"
	data-transition-popup-hide="{$p->transitionPopupHide}"
	data-transition-modal-show="{$p->transitionModalShow}"
	data-transition-modal-hide="{$p->transitionModalHide}"
	data-exit="{$p->exit}"
	data-scroll="{$p->scroll}"
	data-unset="{$p->unset}"
	data-align="{$p->align}"
	data-position="{$p->position}"
	data-wait="{$p->wait}"
>
	<div class='ipsPad ipsType_center' style='background-color: #c7c7c7;background: url(https://steadyoptions.com/uploads/monthly_2018_01/IMG_7292_web_face.thumb.jpg.bbaa235164633c9ff8eac391ee5cf9fa.jpg) no-repeat scroll 100% 100%, linear-gradient(to bottom, #c7c7c7 0%,#CACACA 20%, #d6d6d6 100%);'>
	<div class='ipsType_left' style="margin-right:200px">{$p->msg|raw}</div>
	</div>
{{$form = new \IPS\Helpers\Form( 'form', null, \IPS\Http\Url::internal( 'app=core&module=system&controller=register', 'front', 'register' )/*, array( 'data-controller' => 'core.front.system.register')*/ );}}
{{$email = new \IPS\Helpers\Form\Email( 'email_address', NULL, TRUE, array( 'accountEmail' => TRUE, 'maxLength' => 150, 'bypassProfanity' => TRUE, 'placeholder' => 'Email' ) );$form->addHtml( $email->html() );}}
{{$form->addHtml(\IPS\Theme::i()->getTemplate( 'forms', 'core', 'global' )->button( 'sign_up', 'submit', null, 'ipsButton ipsButton_primary ipsButton_small', array( 'tabindex' => '2', 'accesskey' => 's' ) ));}}{{$form = preg_replace(['/data-ipsForm/', '/<div class="ipsAreaBackground_light ipsClearfix ipsPad ipsType_center">[.\s]*<\/div>/'], '', $form );}}
<div class="ipsPad" style="text-align:center; background-color: rgb(11, 11, 11); box-shadow: 0 6px 3px -3px rgb(0, 0, 0) inset;">{$form|raw}</div>
</div>

 

Edited September 10, 2018 by BomAle

[steadyoptions]

Thank you very much! I will test it later today.

[Unlucky]

Hi,

Re: - on mouse exit on top of page

How near the top of the page does the popup fire?

IE will it fire when people move the mouse towards my menu here:

https://www.walkingfootball.com/

or will it not fire until they have passed the menu and most likely definately leaving the site?

Thanks in advance

[Unlucky]

Just gone ahead and bought this - Am I correct in thinking we can only have 1 call to action popup?

Thanks

[BomAle]

1 minute ago, Unlucky said:

Just gone ahead and bought this - Am I correct in thinking we can only have 1 call to action popup? 

Thanks

Into next major version will be possible to add more popups, the plugin has been thought only to offer an instance

[BomAle]

3 hours ago, Unlucky said:

Re: - on mouse exit on top of page

How near the top of the page does the popup fire?

When position of mouse is less then 10px from the top the popup appear.  I have to improve the functionality of the detection exit intent (track inactive window for touch device not only mouse).

I don't have an ETA for major version, but I will show progress on this topic.

[Unlucky]

If we scroll to the bottom of the page and then use the mouse up action, the popup pops at the top of the page as normal but is out of view until we scroll back to the top of the page

Is there a way the popup can be in view whatever part of the page we are on and do the mouse exit action?

Thanks & Happy New Year

[BomAle]

by clicking outside the popup even if off the screen the popup must close.
If it were not so, you can send me the site where the problem occurs in private, so I can identify and correct it.

[Unlucky]

18 hours ago, BomAle said:

by clicking outside the popup even if off the screen the popup must close.
If it were not so, you can send me the site where the problem occurs in private, so I can identify and correct it.

Hi that does work. Is there a setting to stop the screen going darker?

[BomAle]

Yes, you can disable it into "Customize Modal" tab

or recolor with a custom code to add into content field, see Documentation tab section Interact with the plugin

[Unlucky]

13 hours ago, BomAle said:

Yes, you can disable it into "Customize Modal" tab

Superb thank you.

[mz_]

I have this setup as a guest welcome message with a signup link that displays in the bottom right corner.  Is there a way to keep that displayed but everything in the background to be clickable?  I'd like to keep the message displayed but guests able to still browse the forum.  Thanks!

Edited April 27, 2019 by mz_

[Colombia Humana]

Is it compatible with 4.4.x?

[biofelipe]

I cant show the pop up can you help me ?

[Phil Këvin]

It is a pity that this plugin does not receive updates, it looked very good.

Regards!

[LiquidFractal]

So wait, there are no more updates for this, @BomAle?  Is this just for the Invision site, e.g. are there any updates from your website?

That sucks...maybe this has been the case for a while but this is the first I'm aware of this.