Landing page HTML tags changing advice | Community
Skip to main content
New Participant
March 25, 2022
Solved

Landing page HTML tags changing advice

  • March 25, 2022
  • 1 reply
  • 1697 views

Howdy everyone,

I am looking to move a page off of my website and place in Marketo. On the existing site page we launch our internally built angular form on a modal. When the visitor clicks on the CTA button this launches the modal which takes over the screen. At this time we are not looking to replace this form or process with a Marketo form.

 

When I build the page in Marketo as a template, all of the HTML tags are stored properly. Once I visit the live page though the button that was supposed to use a Boot process once clicked does nothing. This is because the tag is stripped since it is not a regular HTML tag. For example: <example-boot-flow> in our template in Marketo and on our live site becomes <example> on the live page. I asked Marketo support and they said this was because the tag is not standard HTML. 

 

Has anyone experienced this before or have a work-around? 

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by SanfordWhiteman

Yes, the preprocessor is picky. It doesn’t recognize the hyphen that identifies custom elements (although it doesn’t actually validate that a tag name without a hyphen is in a specific list of tags, which is good for other purposes).

 

The only workaround I can see for using custom elements like <example-boot-flow> would be to create non-standard-but-non-hyphenated elements like <examplebootflow>, and then use JS to transform those elements (i.e. clone contents) into real <example-boot-flow> els on the client side before calling Angular.

1 reply

SanfordWhiteman
SanfordWhitemanAccepted solution
New Participant
March 25, 2022

Yes, the preprocessor is picky. It doesn’t recognize the hyphen that identifies custom elements (although it doesn’t actually validate that a tag name without a hyphen is in a specific list of tags, which is good for other purposes).

 

The only workaround I can see for using custom elements like <example-boot-flow> would be to create non-standard-but-non-hyphenated elements like <examplebootflow>, and then use JS to transform those elements (i.e. clone contents) into real <example-boot-flow> els on the client side before calling Angular.

New Participant
March 29, 2022

Thanks Sanford. Taking your thoughts to my engineering team. I will close down this discussion