Landing page HTML tags changing advice

[Jason-Krall]

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? 

[SanfordWhiteman · Accepted solution]

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.

[Jason-Krall]

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