The topos on wikitopo can easily be incorporated into external web pages by copying images directly from the wikitopo pages or setting the source of an image tag to be the URL of the wikitopo image generator.

Anyone publishing online route information can take advantage of this feature by creating and maintaining topo images on wikitopo to show alongside the route information on their own sites

Routes in the topos can be manually ordered to conform to the order in which they are described on the external site.

It is possible to show all the routes in a topo or just one; so a single topo on wikitopo can be used to illustrate each route description individually on seperate pages of an external site. This is particularly useful when targeting mobile devices whith small screen sizes.

By setting the default link in their profiles, publishers can link all their content on wikitopo to their own websites

Setting up the image tags

(The following instructions assume that you are familiar with URLs and query string parameters)

There are two ways to use the topo images on external sites. The first (on the right) is take a copy of the image of the topo you want and use that in the normal way:

<img src="http://yourwebsite.com/topo.jpg" />


This approach works fine if you want a one off snapshot of the topo.

EDIT TOPO

what if you want to always show the latest version of the topo?

In that case, set the source of your image tag to be the URL of the dynamically generated topo on wikitopo.

The following code will display the up to date version of the image on the left.
<IMG SRC="http://www.wikitopo.com/topoImage.php?topoId=1557"/>

you just need to replace topoId parameter with the id of the topo you want.

The easiest way to to get the id of a topo is to look at its settings. To see the settings for topo, first select it (from the list on the relevant crag page) then click the little spanner icon that appears next to it.
(You need to be logged in to see the settings)

To link back to the topo editor:
<A HREF="http:\wikitopo.com/topoViewer.php?topoId=1557" target="BLANK">EDIT TOPO</A>

---

Embedding an entire topo

You can also embed an entire topo with route descriptions in an external web page by using an iframe like this:

<iframe width="650px" frameborder="0" style="overflow:visible; height:1200px; border:none;" src="http://wikitopo.com/getTopo.php?topoId=1557&externalClient=YES></iframe>;
(Note that you may need to adjust the hight of the iframe for each individual topo.)

---

By (in reply to Normal12b)

2010-07-26 12:45:00

reply

This might be useful but why not generate the urls automatically for each topo instead of giving these instructions. It would be simpler and less error prone and can't be that hard to do?

---