mapanno - doing more with your pictures!
Publishing mashup

Publishing options

Once you have finished authoring - all the files (html, css, javascript) required to publish your mapanno are packaged together as a zip file for you to download onto your computer.

mapanno publishing process

Key Features

  • The files can be uploaded straight to your website / blog ready for viewing.
  • There is a choice of ways you can link the mapanno content into your pages including - transparent overlays and inline pasting see display options.
  • The file contains step by step guides and html snippets for you to 'cut and paste' into your web page.
  • The mapanno has been designed so you can also create slideshows.
  • You can view and modify the files to your complete satisfaction before uploading if required.

What is in the download zip file?

All the files are packaged into a zip1 file. A typical download contains html (structure), css (styling) and javascript (interaction) which are organised into the following folders:
mapanno zip file contents

The files highlighted in green are the key files that will change each time you download a mapanno. The other files are core 'support' files that will only change when mapanno.com is upgraded in some way.

Opening 'start-here.htm' contained in the download zip will display your mapanno in a web browser to be viewed locally on your own computer.

If you have combined multiple mapanno into a 'slideshow' the process is exactly the same. All the 'slideshow' files are compressed into the same zip file.

1A zip file is like a compressed folder containing all your files. When you open it (unzip - uncompress) the contents will appear just like an ordinary desktop folder. windows will do this automatically when the file is clicked on or you can use an application like winzip.

What are the display options?

There are several display options of which you can see examples of on this website - these include:

  • Inline - the mapanno is pasted directly into a web page and apears in the flow of your other content.
  • Inline Frame - very similar to the above except the mapanno html is kept seperate in its own seemless frame.
  • Overlay Ajax - the mapanno is opened via a hyperlink and appears as a page overlay by hiding the content beneath it with a semi transparent mask.
  • Overlay Frame - very similar to the above accept that the mapanno html is kept seperate in its own seemless frame which is placed over the transparent mask.

These options offer the most flexibility for you to craft and integrate mapanno into your website.

Step by Step Guides

Depending on which display option you choose the instructions included in the download provide a step-by-step guide you through cutting and pasting the relevant snippets of html into your web page. The html includes links to the core files (css and javascript) and the mapanno hyperlink or inline html. The steps below are to provide an overview of what is requried.

  • Download your zip file from mapanno.com and unzip it.
  • Open up start-here.htm in a browser and check everything is working as you require.
  • Cut and paste the core file links into your web page2.
  • Cut and paste the hyperlink or inline html into your web page.
  • Upload all the files in the 'mapanno' folder.
  • View your page!

2If your website/blog is template driven then you may only ever need to do this once, likewise, if you have already pasted the core file links into a web page then it will not need to be repeated.