Skip to main content
Solved

woocommerce newsletter form embed


Forum|alt.badge.img

Hi I have WP form setup on our websites newsletter signup. 

Happy to replace this with Klaviyo code, however when I go to create an email embed I am  unable to delete the block “No, thanks” even though it isnt needed as this isnt a popup and will be scrolled past and ignored if no interest.

I am also unsure of how I can set this up so that styling and layout is picked up from current site.
In essence all I want is the form and function from Klaviyo minus styling.

 

Thanks

Best answer by bluesnapper

Oooh so close @electro !

Below in Klaviyo form editor. Just dragging blocks, adjusting padding, colours etc

What can’t be achieved in the editor is to have box rounding on one side only.

Another consideration is how it will appear on mobile (not good) so desktop + mobile versions

Regards

Andy

 

 

View original
Did this topic or the replies in the thread help you find an answer to your question?

8 replies

bluesnapper
Partner
Forum|alt.badge.img+45
  • Champion & Partner
  • 737 replies
  • May 15, 2024

Welcome to the community @electro 

Can you share the Klaviyo form where “no thanks” is being presented?

Regards

Andy


Forum|alt.badge.img
  • Author
  • Contributor I
  • 4 replies
  • May 15, 2024

thanks its in the Klaviyo wizard for embeds


bluesnapper
Partner
Forum|alt.badge.img+45
  • Champion & Partner
  • 737 replies
  • May 15, 2024

Thanks @electro 

This will work unless there’s some technical issue: select the ‘No thanks’ block. A delete ‘trash can’ icon will appear top left. Select that and the block will be deleted. See below

Let me know if that works for you

Regards

Andy

 


Forum|alt.badge.img
  • Author
  • Contributor I
  • 4 replies
  • May 15, 2024

Thanks yes pretty straight forward you would as the first thing I tried in trying to minimise whats embeded, but no…

 

Something went wrong

Give it another try. If that doesn't work, check back in a few minutes.

 

Tried a ton of times over 30 min window. Just tried again a few times and it finally deleted the block even after an error. Strange but I’ll take the win.

 

Do I just embed it and then right click and view rendered code and apply my existing CSS to those styles?


bluesnapper
Partner
Forum|alt.badge.img+45
  • Champion & Partner
  • 737 replies
  • May 15, 2024

Sorry @electro, I didn’t realise you’d already attempted to delete the block! Glad it’s now gone.

As to styling, I’d do that within the form editor.

If there’s some styling you can’t do in the editor, then you should be able to use right-click ‘inspect’ from your browser to look for the Klaviyo form classes and apply CSS to those in your site CSS. I’d add !important to those CSS styles to force their priority. You’d need to check that doesn’t affect any other Klaviyo forms on your site.

It should work, but I’ve never had to do this with an embedded form.

Hope that helps

Andy


Forum|alt.badge.img
  • Author
  • Contributor I
  • 4 replies
  • May 15, 2024

thanks, I need to try and get this

to look like this once embeded

currently using WPForms


bluesnapper
Partner
Forum|alt.badge.img+45
  • Champion & Partner
  • 737 replies
  • Answer
  • May 15, 2024

Oooh so close @electro !

Below in Klaviyo form editor. Just dragging blocks, adjusting padding, colours etc

What can’t be achieved in the editor is to have box rounding on one side only.

Another consideration is how it will appear on mobile (not good) so desktop + mobile versions

Regards

Andy

 

 


Forum|alt.badge.img
  • Author
  • Contributor I
  • 4 replies
  • May 15, 2024

thanks, I can see all the style options but cant figure out how to get the submit button on the same line. have shrunk and aligned sign up button to right - but thats as best as I can get it in Klaviyo. Could you give me some pointers please? size wise have set to 100% and will need to check how that scales in its div on mobile vs desktop :-)