Adding MailerLite code to a CTA to generate a newsletter popup

  • Resolved Darcey1

    (@darcey1)


    1 year, 4 months ago

    I am using Twenty Twenty-Three, trying to add some code to a CTA button. Important: the CTA button sits in the first section of the body of the page, not the sidebar or header or footer. The goal: when the user clicks the large CTA button (“Get early access”), they see a popup for a newsletter subscription.

    The subscription service is Mailer Lite. I tried the MailerLite plugin, but it only works with older themes as a widget in the sidebar, header or footer.

    Using WPCode “Code Snippets” plugin, I was able to add the code to the <head> section. This successfully activated the automatic popup when a user goes to leave the page (top or bottom of page).

    Now I just need to activate the large CTA button. To do that, I need to add this code somewhere:

    <button class="ml-onclick-form" onclick="ml('show', 'hPKtnC', true)">Get early access</button>

    I have been able to add the CSS class ml-onclick-form. However, only the CSS class, not the javascript snippet.

    I found the Shortcode Block in the Site Editor and tried adding it but it doesn’t seem to have any effect. I tried adding it within the div for the button using the Code Editor. Maybe I messed this up?

    Maybe I need to pay for the Pro version of the WPCode plugin? But the WPCode plugin already supplies the shortcode so it should work with the ShortCode block, right?

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator jordesign

    (@jordesign)

    Hi @darcey1

    Nice work – it seems like you’ve tried a few things there. With that code it’s hard to tell how MailerLite would have things set up to trigger the code. I see your site is in a ‘Coming Soon’ mode so I couldn’t take a look at the actual page to see how the button is inserted.

    As a first step – you could try adding the exact code you mentioned (<button class="ml-onclick-form" onclick="ml('show', 'hPKtnC', true)">Get early access</button>) in an HTML block.

    Custom HTML

    That should give you a button that works, but it may not match the style of the site. It’s a good thing to try first though – to confirm that it actually works.

    Could you please give that a try and let me know how you go?

    Thread Starter Darcey1

    (@darcey1)

    Thanks, I tried it and the button displayed, but no interaction.
    I have given up on Mailer Lite and switched to MailPoet.

    Moderator jordesign

    (@jordesign)

    Hi @darcey1 – to be honest that sounds like a good approach. Best of luck with it!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Adding MailerLite code to a CTA to generate a newsletter popup’ is closed to new replies.