Embed App in Website - Displays Generic 'Cities of Literature' App

2356
8
Jump to solution
04-21-2021 07:39 AM
Labels (1)
MatthewMcMillan1
New Contributor III

Hello all, 

I recently completed a Web Application (Developer Edition) and am now trying to embed it in a website. I followed the steps, copied the below HTML code, and the app that loads is a 'Cities in Literature'.

MatthewMcMillan1_0-1619015499148.png

```<style>.embed-container {position: relative; padding-bottom: 80%; height: 0; max-width: 100%;} .embed-container iframe, .embed-container object, .embed-container iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%;} small{position: absolute; z-index: 40; bottom: 0; margin-bottom: -15px;}</style><div class="embed-container"><iframe width="500" height="400" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" title="Data Map" src="https://arcgis.com/apps/View/index.html?id=220675e23d3b48e6a8de854b669bf6ea"></iframe></div>```

To generate the app ID, I added the application under My Content and copied the ID from the URL. 

I also tried this through a web app built using the integrated system, i.e. not the developer edition, and I am having the same results. 

Any help would be greatly appreciated!

Thanks!

Tags (3)
0 Kudos
1 Solution

Accepted Solutions
KellyHutchins
Esri Frequent Contributor

The id you generate using the Web App Builder will only work with Web App Builder apps. The app you linked to above is not a Web App Builder app so it doesn't understand the id from a WAB app.  Here's info on how to create a web app builder app in ArcGIS Online: https://doc.arcgis.com/en/web-appbuilder/create-apps/make-first-app.htm

 

For the developer edition I think you'd want to deploy your app using the steps here: https://developers.arcgis.com/web-appbuilder/guide/xt-deploy-app.htm

 

View solution in original post

0 Kudos
8 Replies
KellyHutchins
Esri Frequent Contributor

The issue is the id url param with that particular app.  That application is a configurable app called "Basic Viewer" not Web App Builder.  That app accepts either an application id for a config app or a webmap id. You can configure your app using the version available in ArcGIS Online then use the id in your embed. Or you can pass in the webmap id by setting the url param as follows:

 

Appid example:

https://www.arcgis.com/apps/View/index.html?appid=enter some valid appid here

 

web map:

https://www.arcgis.com/apps/View/index.html?webmap= enter a valid webmap id 

0 Kudos
MatthewMcMillan1
New Contributor III

Thanks for the reply Kelly. I'm a little confused as to the steps required to fix the issue.

Where should I find the correct App ID to input into the code?

 

0 Kudos
KellyHutchins
Esri Frequent Contributor

You can either sign-in to Online and create a new Basic Viewer app via the app config process (Click the "Create a Web App") link here: 

https://www.arcgis.com/home/item.html?id=310f18d4ac5246199976396c933a977f

 

Or just use your webmap id with the webmap url parameter. 

0 Kudos
MatthewMcMillan1
New Contributor III

Okay thanks.

So it's not possible to embed an app created in the Developer Edition of Web App Builder? So I'll have to forgo custom attributes and a custom loading screen?

0 Kudos
KellyHutchins
Esri Frequent Contributor

It is possible to embed using WAB - but the app above isn't the web app builder. You'll need to create a Web App Builder app and then embed the url to that application. 

0 Kudos
MatthewMcMillan1
New Contributor III

I created the app in Web App Builder (Developer Edition). When I launch the app in Web App Builder the link in the address bar is "'mynetworkurl'.3344/webappbuilder/apps/4/"

Through My Content, I then selected 'Add an Application' and inserted the above Url into the 'URL' field, which generated the App ID I posted in my original email. 

MatthewMcMillan1_0-1619026724000.png

Is this the correct way to do this or should I be doing something else to an appID I can embed into a website?

Thanks

 

 

0 Kudos
MatthewMcMillan1
New Contributor III

I don't think I was clear enough in my original question. The 'Cities In Literature App' is not my app, I assume it's someone else's or a generic Esri template. This is one that loads when I input my own App ID.

Perhaps I'm doing something wrong in the steps I outlined above,  to generate a workable App ID

Thanks

Matthew

0 Kudos
KellyHutchins
Esri Frequent Contributor

The id you generate using the Web App Builder will only work with Web App Builder apps. The app you linked to above is not a Web App Builder app so it doesn't understand the id from a WAB app.  Here's info on how to create a web app builder app in ArcGIS Online: https://doc.arcgis.com/en/web-appbuilder/create-apps/make-first-app.htm

 

For the developer edition I think you'd want to deploy your app using the steps here: https://developers.arcgis.com/web-appbuilder/guide/xt-deploy-app.htm

 

0 Kudos