[Gerald EParticipant]

Hi,

I use integrety xtheme combined with optinmonster. The plugin docs (http://optinmonster.com/docs/how-to-manually-load-optinmonster-popup-with-click-of-a-button/) give me the following instructions and i struggle to implement this in CORNERSTONE:

The next step requires just two things: a custom class and data attribute. The class required to make the optin trigger is “manual-optin-trigger”. It needs to be added to the class attribute for your element. The data attribute required is “optin-slug”. Here’s what it looks like:

Button MonsterLink:
<a href="#" class="button manual-optin-trigger" data-optin-slug="h95qqg9sqx9atrsl">Click me!</a>

You may need to replace the class “button” with your own theme-specific class. Some themes use button as a class while others use alternative naming conventions. Refer to your theme’s documentation for information about button classes.

I am viewing the button i created in cornerstone witht the inspector function. I dont know what to enter into what fields there to make it work.

Thank you in advance!

[Paul RModerator]

Hi Gerald,

Thanks for writing in!

You can add the class(manual-optin-trigger) in the class field of your button element in cornerstone.

http://screencast.com/t/Te3XdjDdW3k

Please note that you need to enable advanced controls for the class field to appear.

Hope that helps.

[Gerald EParticipant]

Almost there! Thank you. Now I need to enter a “slug” into the link. how do I do this in cornerstone?

<a href="#" class="button manual-optin-trigger" data-optin-slug="h95qqg9sqx9atrsl">Click me!</a>

See Instructions (Step3): http://optinmonster.com/docs/how-to-manually-load-optinmonster-popup-with-click-of-a-button/

[Paul RModerator]

Hi Gerald,

In that case, you can add your button in a text element instead.

eg. Add code below in a text element.

<a class="manual-optin-trigger x-btn x-btn-blue-green x-btn-flat x-btn-rounded x-btn-regular" data-optin-slug="h95qqg9sqx9atrsl" href="#example" title="Example" data-options="thumbnail: ''">Click me!</a>

Can you provide us your site url, so we could take a closer look.

Thanks

[Gerald EParticipant]

This reply has been marked as private.

[JadeModerator]

Hi Gerald,

Thanks for the info, you can try to put this code in the Cornerstone Custom JS panel:

(function($){

	$('a.manual-optin-trigger').attr('data-optin-slug','h95qqg9sqx9atrsl');
	
})(jQuery);

Hope this helps.

[Gerald EParticipant]

That works! you are my hero! 🙂

last question: I want to have multiple buttons triggering lightboxes on the entire page. Each button includes a different “slug”. So whats the code I need to edit/add so this works?

See Instructions (Step3): http://optinmonster.com/docs/how-to-manually-load-optinmonster-popup-with-click-of-a-button/

[Paul RModerator]

Hi Gerald,

To achieve that you need to add a unique class to each of your button.

eg. If you have five buttons

Add button1 class to the first button,
Add button2 class to your second button
and so on…

http://screencast.com/t/HKs93Wpn85

After that you need to add your slug using javascript.

(function($){
	$('a.button1').attr('data-optin-slug','h95qqg9sqx9atrsl');
        $('a.button2').attr('data-optin-slug','button2slug');
        $('a.button3').attr('data-optin-slug','button3slug');
        $('a.button4').attr('data-optin-slug','button4slug');
        $('a.button5').attr('data-optin-slug','button5slug');	
})(jQuery);

Hope that helps.

[Gerald EParticipant]

still does not work. No pop-up comes up.

I added this in cornerstone to the button:

HREF
Click me!

CLASS
manual-optin-trigger button1

CUSTOMIZER>>CUSTOM>>JAVA SCRIPT (not in Cornerstone Custom JS panel – but tried there too and did not work)
<script type=”text/javascript”>
(function($){

$(‘a.button1’).attr(‘data-optin-slug’,’v5sy35ufqpicwhbs’);

$(‘a.button2’).attr(‘data-optin-slug’,’os58a5pb02gqnhv8′);

})(jQuery);
</script>

[ThaiModerator]

Hi There,

Please remove the <script> tag from Customize > Custom > Javascript.

+ Change:

<script type="text/javascript">
(function($){

$('a.button1').attr('data-optin-slug','v5sy35ufqpicwhbs');

$('a.button2').attr('data-optin-slug','os58a5pb02gqnhv8');
	
})(jQuery);
</script>

+ To:

(function($){

$('a.button1').attr('data-optin-slug','v5sy35ufqpicwhbs');

$('a.button2').attr('data-optin-slug','os58a5pb02gqnhv8');
	
})(jQuery);

Hope it helps 🙂

[Gerald EParticipant]

Thanks for the help but it still does not work. button says it refers to linkedist.com/# but its dead.

my settings are the following:

Button
HREF:
<a href="#" class="manual-optin-trigger button1" data-optin-slug="v5sy35ufqpicwhbs">Click me!</a>
CLASS:
manual-optin-trigger button1
(is it double entered now?)

Customize > Custom > Javascript

(function($){

$('a.button1').attr('data-optin-slug','v5sy35ufqpicwhbs');

$('a.button2').attr('data-optin-slug','os58a5pb02gqnhv8');
	
})(jQuery);

Thanks for your support!

[ZeshanMember]

Hi Gerald,

I’ve checked your site and it seems the button is working but not the form itself. Can you make sure the form OptimMonster is working properly in your site? Or try switching back to the first code that worked for you in the preview post.

Thank you!

[Author]

Posts