I want to embed a web application created with HTML, CSS, and Javascript into PowerPages, but for some reason the HTML content gets changed without permission and the app doesn't work properly.
How it is changed is that all id elements that exist in the HTML disappear (for example, <div id="aaa" style="margin: 10px 0;"></div> becomes <div style=" margin: 24px 0;"></div>)
Here I will explain how I incorporate web applications into PowerPages.
1. Create a site without using a template
2. Then go to PowerPagesManagement's WebPage, go to the page where you want to embed the application, and paste the HTML of the web application you created in Copy (HTML) (the contents here will be changed automatically).
3. Then add the js and css files used in the web application to the same page as web files. When adding a js file, delete the file extension and select the file (you cannot select it if it has an extension)
4.When I synchronize in DesignStudio and display the site in Preview, it doesn't work properly, and when I check it in DevTools, all the HTML id elements have disappeared. (The first attached image is the input HTML, the second is the HTML after it has been changed without permission)
Please let me know if you know anything about this. Thanks
I didn't solve this problem, but I found a workaround.
It seems that syncing and previewing in Pages in the design studio was not a good idea.
It works normally if you sync or preview with Styling, Data, or Set up.
Sorry for the late reply again.
I tried to find out how to do it, but it seems like my question was poorly written and I couldn't convey it properly.
I've found a workaround, so I'll close this post.
I'm really thankful to you.
Hi @Anonymous
To embed the Power Pages. There is a key ground rule. Adding it below. You can see why your ids are being replaced.
Note: Don't forget the site settings HTTP/Content-Security-Policy.
Hope it helps.
------------
If you like this post, give it a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users to find it.
Thank you for your question Lucas001 and I apologize for my reply being so late.
I added a new id to one of the <div>s, but it was not displayed in DevTools
Hi @Anonymous,
that sounds really strange.
When you add another id manually to one of your <div>s is that id than visible in the DevTools?