Integration of external websites via iFrames with pwa-builder.io
your pwa – 3 simple steps to insert a web page using the iFrames:
News appear a lot on the Internet & new needs of users are constantly arising, which can also be integrated into the web presence of your company. An effective way to integrate external content is <iFrame>. Existing sites or a radio can be easily integrated into your apps.
Step 1 Content module
- Create a Content module and click on the source code button.
Step 2 Insert source code:
- In the source view, please insert the following code:
<div style="-webkit-overflow-scrolling: touch;overflow-x:hidden;overflow-y: auto; position: absolute; top: 0; left: 0; right: 0; bottom: 0;"><iframe src="https://pwa-builder.io/" style="width:100%;height:100%;border: none;"></iframe></div>
Step 3 Insert desired url:
Replace the URL https://pwa-builder.io/ with a direct link to the page you want to include. Notes on use: Please note that despite the large number of compatible sites, there are some providers that block the use of <iFrames> so that embedding is prevented. Furthermore, the page to be embedded must have an SSL certificate (https://) because it can be embedded but not displayed correctly.
The complete content of the website is embedded by <iFrame> .
- When displaying a iframe, the content of the entire website is taken over.
- It is not possible to show only parts of a website as or to hide various parts of it.
With the pwa-builder you can insert as many iFrames as you like.
pwa builder special tip:
Your website is increasingly visited by smartphone users. In some industries, up to 80 % of visitors are mobile. Therefore, a mobile optimized website is very important for companies today. With pwa-builder.io you create a progressive web app.