Shortlist prepared but How and Where to install?

[FrankRomo]

Hello I have been attempting to produce a shortlist map for quite a while not but have had minimal success. I have prepared the map layers on a web map using the shortlist template provided online. However, since I do not have any coding or experience with hosting my maps since I am a student without access to a larger server, I was wondering if someone could explain how to proceed with the installation process.

I have followed the tutorials and done much research but am still confused by the installation step.

How do I handle the contents in the zipped file after replacing the sample data with my own data?

Where do I install these contents?

I don't understand what the "inetpub\wwroot folder" is for or how I am supposed to have access to a server to perform the installation stage.

I am not sure if my questions even make sense but if someone could please help clarify the installation step and the process of packaging, renaming and uploading the folder contents onto a server that would be greatly appreciated. The tutorials really glaze over this step and make some assumptions about hosting webmaps. I think I just need a more detailed information about this step and how to proceed with the packaged contents. Please help, I really want to learn how to make this shortlist map.

Thank You.

[RupertEssinger · Accepted solution]

Hi Frank

You need to install the contents of the Shortlist application template onto a publicly accessible web server or website. The location of the Shortlist's index.html file becomes the URL of your Shortlist.

In other words, installing a downloadable story map app, like the Shortlist, is similar to adding a new web page or new content into an existing website: it is really just a set of files you put onto the server on which that website is hosted so that they can be accessed over the web. Depending on what your situation is, you may have direct access to the server, or you may give the files to a system administrator or web master, or you may log in to the service that hosts your website. For example if your organization or business hosts its website on a popular hosting service like iPage, you or whoever has access to the iPage account, would log in to iPage, create a new folder for the Shortlist in the file structure of your website, and upload the Shortlist files into that folder. If you are working in a large enterprise you will often work with a system administator to add new files onto the web into a folder on the one of the enterprise's servers.

Alternately, if you don't have access to anything like what I described above, you could use a file-sharing service like Dropbox to deploy your story map.

If you like, you could paste a link to your web map here (the one you've prepared for your Shortlist). I can show you a way to run your Shortlist without installing the Shortlist application template on a web server or website. It involves sending your web map's ID to a generic installation of the Shortlist that we maintain, although this method won't let you do customizations like changing the logo, and is mainly intended for demos and testing).

[FrankRomo]

Thank you very much for the response! I do have a website that I upload my portfolio work to but do not have  a place where my story map can be hosted. If I were to try to place it on my website would I have to re-zip the download template with my own csvs? IN what format must the files be packaged or assembled in order to place them on my website?

I am a little confused about the steps after I create and publish my webmap. I have used the downloaded shortlist template to create csv files that I then uploaded as separate layers on a webmap. What comes next? Do I package the remaining folders into one document with the new csv files and upload that to my website?

Thank you for the quick response. Please help!

Sincerely,

Frank

[RupertEssinger]

Hi Frank.

Where to put the Shortlist template?

You can totally put the Shortlist application from the zip file onto the website where you have your portfolio. The downloadable story map templates, like the Shortlist, are just a bunch of files pretty much like any other so stick them into a folder on that website and you'll be good.

Where to put the photos that the features in your Shortlist will reference?

Your features can reference images at any URL but the easiest thing is to put them into a folder on your website. It can be any folder and doesn't have to be the same folder that the Shortlist template is installed in.

Where to put the CSV files defining the features in your Shortlist tabs?

You upload these CSV files into the ArcGIS Online web map that your Shortlist will display. Create a new web map in ArcGIS Online, open it up, and then in the web map choose Add > Add Layer from File and browse to your CSV file(s). So your CSV files are uploaded into the web map. The web map and all the data it contains is stored for you automatically in the ArcGIS cloud.

The final step is to edit the line in the config section of the Index.html file in your Shortlist installation to point at the ID of your web map.

Rupert

[JerryCarey]

Rupert,
I to am having a difficult time trying to figure how to share my shortlist application with others. I have configured it on my machine, and can run it via directing my browser to http://localhost/*.html. It runs and looks good. Now I would like to share it within my organization via dropbox. We are planning on hosting it on our website, but I am not quite ready for that. I can't seem to get this to run in dropbox. Could you explain the procedures to go about this.

Thanks,
Jerry

[RupertEssinger]

Hi Jerry
Just make a folder on Dropbox and copy all the files that you downloaded onto your local host into that folder. In other words, all the files that are in the Shortlist application download that you put onto your localhost now, along with your edits to the Index.html file and any other files you might have tweaked, need to be put onto Dropbox, or any other website or web server in order to make them publicly available via the web. (The web map that you've created to use in your app, including the spatial data you uploaded into the web map to provide your Shortlist layers, is hosted in ArcGIS Online already). The images that your Shortlist layers point at via URLs can be put anywhere on the web: they don't need to be put on Dropbox with the Shortlist application files if they are already located somewhere else.

Actually, if you are planning on hosting the application on your website. why not just put it there now? You can do your testing, etc but other people won't be able to access it until you publicize or link to your app's URL.

Alternatively if you want to do some quick testing of your Shortlist you could edit the following URL to insert your web map's ID. The other parameters just mirror the settings in the config section of the Index.html file that you've edited, so you can edit them too. This URL accessed our generic hosted testing and review instance of the Shortlist so it won't reflect customizations you have done like switching out the Esri logo for your own, etc, but it a useful way to test your content:

http://storymaps.esri.com/templates/shortlist/?webmap=8504932f183c4b8699dc6ba28235e398&DETAILS_PANEL...

Or to just use all the Shortlist defaults and have it display your web map, use edit this shorter URL to put your web map ID in there instead of the ID of my Phoenix Shortlist web map which the URL is currently using:

http://storymaps.esri.com/templates/shortlist/?webmap=8504932f183c4b8699dc6ba28235e398

[JerryCarey]

Thanks. I did all that. The files have been copied into dropbox. So now what command do I enter in the browser to run the app in dropbox? ie; in order to run the app off my c: drive I enter http://localhost/*.html.

We are currently redoing our website, so our web-developers are busy with that, and don't want to be bothered with this at the moment. That's why I can't put it there yet. This is kind of a side project I'm doing to show the capabilities of Arc-Online. In this industry there seems to be a constant struggle to prove the power and diversity that GIS has; showing that is more than "making maps".

[RupertEssinger]

Now you've copied your files to Dropbox, to launch your Shortlist you'll need to enter the complete URL to the index.html file on Dropbox into your web browser in order to launch it. I couldn't find a Shortlist deployed on Dropbox just now when I had a quick look but this URL to an ArcGIS Online app that a colleague made for his local preschool 🙂 shows you what the URL looks like (click the URL below to view it in your web browser):

http://dl.dropboxusercontent.com/u/44841828/Turkeys2013/index.html

But have you tried just using the URLs I posted above? That's the simplest way to test a Shortlist before deploying it. Or if you want post the URL of your web map here and I'll post back a URL that launches it in our generic test/review instance.

[JerryCarey]

Still not working for me.

So here is the link for the html file in dropbox. (i renamed it sesp.html because i am working on a number of maps right now, and its easier to keep up with which file I'm editing) https://www.dropbox.com/s/5t6dw6dot3icpip/sesp.html

and here is the web map's ID f62b7a3ce8584d4b95e2a3b9491acd74

[RupertEssinger]

Here's your Shortlist in our generic hosted template with the default settings:

http://storymaps.esri.com/templates/shortlist/?webmap=f62b7a3ce8584d4b95e2a3b9491acd74

If you want your popups to have a Details panel, try this URL. I also threw in a parameter that turns the Locate Me button on:

http://storymaps.esri.com/templates/shortlist/?webmap=f62b7a3ce8584d4b95e2a3b9491acd74&DETAILS_PANEL...

Your tabs have more than 99 places, which unfortunately isn't currently supported out of the box, so that is why you are seeing some broken point symbols on the map for some of the tabs. We've put a set of numbered marker symbols going beyond the number 99 for use in Story Maps and other apps in a zip file here: http://downloads.esri.com/blogs/places/Numbered_marker_symbol_sets.zip

(In your file set don't rename Index.html. That file name has to remain the same because it is the default HTML file that gets launched by URLs that just reference a folder location)