Map of coordinates

A square or 16:9 map with of chosen coordinates and a textfield on either side.

Item-IDs: 06-009 | 06-010 | 06-011 | 06-012

Sample views  Manual  Screen adaptation  Get a Google API Key


Sample views

16:9

This is a map element designed for location coordinates and this text. There are no restrictions for the nature of the content. So feel free to list the type of information as text or in the form of an address. 

Stadtpark Fürth
90762 Fürth


Square

This is a map element designed for location coordinates and this text. There are no restrictions for the nature of the content. So feel free to list the type of information as text or in the form of an address. 

Stadtpark Fürth
90762 Fürth


Manual

Create new element

  • Click on the + Content button to create any map element.
  • In the Map Elements tab, select the map of coordinates element of your choice that is named accordingly.

Insert coordinates

  • In the Enter Location tab, enter the data into the Latitude and Longitude fields in the form of decimal degrees (for example: 12.34567) without any degree symbol (°).

Insert and format text

  • Paste your text into the editor.
  • If you copy the text from another file, pay attention to possibly copied formatting.
  • The text can be formatted directly within the rich text editor, with the help of the menu above the editor.

Add social media buttons

  • In the Social Media tab, you can create links for various social media channels.
  • Insert the entire link to the profile for the respective medium.

Screen adaptation

A map of coordinates shows the inserted coordinates within a Google map with either a fixed square or 16:9 aspect ratio with a textfield and social media buttons.

Responsive behaviour: If there is not enough space to display map and the text field next to each other, all maps will show the information directly below. This ensures the consistent appearance of all maps on small devices, regardless of the original orientation.

Worth noting:

  • The use of this element is suitable for places that can’t be represented by an address and maybe can only be reached on foot. Because of this, there is a text area to provide further information.
  • To display an address correctly, you need a Google API key from the Google Cloud Platform.

Linked topics

toujou set-ups & TYPO3 tutorials related to this element description.

Text editing