cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Highlighted
Frequent Visitor

Can't insert 2 iframes of PowerApps on one html page

 Hello  everyone, this is my first post in community. I  really need your help

I have a problem with PowerApps import in to website page, currently I have 2 PowerApps and I want to import them on one

website page, side by side. but I can only show one , I have tried to write different css methods to let these 2 show together , but 

doesn't work

 

 

Thanks for your help in advance ! 

HtmlCode.jpg

 

Result.jpg

 

 

 

1 ACCEPTED SOLUTION

Accepted Solutions
Highlighted
Community Support
Community Support

Re: Can't insert 2 iframes of PowerApps on one html page

Hi @alpha,

 

I have made a test on my side and don't have the issue that you mentioned. My embed PowerApps apps work well as below:6.JPGMy HTML code read as below:

<!DOCTYPE html>
<html>
<head>
	<title>PowerApps app Intergrate with Website</title>
</head>
<body>
	
<style>
	.box{
	float: left;
	margin-right: 20px;
	}
</style>

<div class="box">
	<iframe width="400" height="720" src="https://web.powerapps.com/webplayer/iframeapp?source=website&screenColor=rgba(165,34,55,1)&appId=/providers/Microsoft.PowerApps/apps/xxxxxxxx-6519-4a6f-xxxx-66a0d31efcb8" allow="geolocation; microphone; camera"></iframe>
</div>

<div>
	<iframe width="400" height="720" src="https://web.powerapps.com/webplayer/iframeapp?source=website&screenColor=rgba(165,34,55,1)&appId=/providers/Microsoft.PowerApps/apps/xxxxxxxx-c529-492d-xxxx-99702f44b7d9" allow="geolocation; microphone; camera"></iframe>
</div>

</body>
</html>

Please take a try to use the </iframe> closing tag as above within your HTML code, the Self-closing tag (/>) doesn't work. Please check and see if the following article would help in your scenario:

https://stackoverflow.com/questions/8068578/how-do-i-use-multiple-iframes-in-my-html-page

 

More details aboout embeding PowerApps app in a website, please check the following article:

Embed PowerApps app in a websitre

 

 

Best regards,

Kris

Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

View solution in original post

4 REPLIES 4
Highlighted
Community Support
Community Support

Re: Can't insert 2 iframes of PowerApps on one html page

Hi @alpha,

 

I have made a test on my side and don't have the issue that you mentioned. My embed PowerApps apps work well as below:6.JPGMy HTML code read as below:

<!DOCTYPE html>
<html>
<head>
	<title>PowerApps app Intergrate with Website</title>
</head>
<body>
	
<style>
	.box{
	float: left;
	margin-right: 20px;
	}
</style>

<div class="box">
	<iframe width="400" height="720" src="https://web.powerapps.com/webplayer/iframeapp?source=website&screenColor=rgba(165,34,55,1)&appId=/providers/Microsoft.PowerApps/apps/xxxxxxxx-6519-4a6f-xxxx-66a0d31efcb8" allow="geolocation; microphone; camera"></iframe>
</div>

<div>
	<iframe width="400" height="720" src="https://web.powerapps.com/webplayer/iframeapp?source=website&screenColor=rgba(165,34,55,1)&appId=/providers/Microsoft.PowerApps/apps/xxxxxxxx-c529-492d-xxxx-99702f44b7d9" allow="geolocation; microphone; camera"></iframe>
</div>

</body>
</html>

Please take a try to use the </iframe> closing tag as above within your HTML code, the Self-closing tag (/>) doesn't work. Please check and see if the following article would help in your scenario:

https://stackoverflow.com/questions/8068578/how-do-i-use-multiple-iframes-in-my-html-page

 

More details aboout embeding PowerApps app in a website, please check the following article:

Embed PowerApps app in a websitre

 

 

Best regards,

Kris

Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

View solution in original post

Highlighted
Responsive Resident
Responsive Resident

Re: Can't insert 2 iframes of PowerApps on one html page

In your second iframe you have your closing "/" before 'frameborder" instead of before the closing ">"

Highlighted
Frequent Visitor

Re: Can't insert 2 iframes of PowerApps on one html page

Thanks ! you are right ,but even I remove "/" , it doesn't work ,  it's the problem of  missing </iframe > tag!

 

Thanks again !

Highlighted
Frequent Visitor

Re: Can't insert 2 iframes of PowerApps on one html page

Thanks so much Kirs, you are right , I missed the </iframe> tag to close when there are many iframes to insert 

Problem solved ,

Thanks all guys

Helpful resources

Announcements
Community Conference

Power Platform Community Conference

Check out the on demand sessions that are available now!

Power Platform ISV Studio

Power Platform ISV Studio

ISV Studio is designed to become the go-to Power Platform destination for ISV’s to monitor & manage published applications.

secondImage

Power Platform 2020 release wave 2 plan

Features releasing from October 2020 through March 2021

Tech Marathon

Maratón de Soluciones de Negocio Microsoft

Una semana de contenido con +100 sesiones educativas, consultorios, +10 workshops Premium, Hackaton, EXPO, Networking Hall y mucho más!

Top Solution Authors
Top Kudoed Authors
Users online (6,269)