Display a marker

Find these three categories here:

  1. Display a predefined marker without popup
  2. Display a predefined marker with popup
  3. Display a personal marker or company logo
Display a marker with the WP OSM Plugin

Display a marker with the WP OSM Plugin

Display a predefined marker without popup

If the WordPress OpenStreetMap plugin is installed, to display a marker needs basically 5 actions when you create an article / page:

  1. select OSM shortcode
  2. select one of the OSM control theme
  3. select a marker
  4. adjust the map and click in to the map where you want your marker to be placed
  5. copy the generated shortcode and paste it into your article
[*osm_map lat="47.071" lon="15.411" zoom="15" width="100%" height="300" marker="47.069,15.41" map_border="thin solid blue" theme="ol" control="mouseposition,scaleline" marker_name="styria_linux.png"]

* <= remove the asterisk

Display a predefined marker with popup

If you want your marker with a text, you have to add a custom field with the name OSM_marker_text to your post and add some arguments to the generated shortcode with these steps:

  1. select OSM shortcode
  2. select one of the OSM control theme
  3. select a marker
  4. adjust the map and click in to the map where you want your marker to be placed
  5. copy the generated shortcode and paste it into your article
  6. Add a Custom Field OSM_marker_text to your post page
  7. Add OSM_marker_text at the marker argument in the shortcode and insert it into your post/page

Add a Custom Field to your post page, plain text or html:

custom field to add popup marker text

custom field to add popup marker text

Insert the Custom Field Name: marker=”47.069,15.41,OSM_marker_text
Choose your Marker Icon: marker_name=”styria_linux.png

Display a marker with popup and link to a routing service

OSRM or Your Navigation

[*osm_map lat="47.071" lon="15.411" zoom="15" width="450" height="300" marker="47.069,15.41,OSM_marker_text" map_border="thin solid blue" theme="ol" control="mouseposition,scaleline" marker_name="styria_linux.png" marker_routing="osrm"]

* <= remove the asterisk

[*osm_map lat="47.071" lon="15.411" zoom="15" width="450" height="300" marker="47.069,15.41,OSM_marker_text" map_border="thin solid blue" theme="ol" control="mouseposition,scaleline" marker_name="styria_linux.png" marker_routing="yn"]

* <= remove the asterisk

Display a personal marker or company logo

If you want to choose your own marker simple copy it to uploads folder and add information about the marker in the shortcode:

  • Location relative to the plugin: marker_name=”../../../uploads/sites/2/2013/11/mic_shark_icon.png”
    Note: Do not copy any data to osm-plugin folder since this folder will be deleted at update!
  • hight of the icon/marker: marker_height=”37″
  • width of the icon/marker: marker_width=”32″
  • center of the icon/marker: marker_focus=”5″
[*osm_map lat="47.071" lon="15.411" zoom="15" width="450" height="300" marker="47.069,15.41" map_border="thin solid blue" theme="ol" control="mouseposition,scaleline" marker_name="../../../uploads/sites/2/2013/11/mic_shark_icon.png" marker_height="37" marker_width="32" marker_focus="5"]

* <= remove the asterisk and modify the marker_name argument