hazza/hugo-mod-leaflet
1
0
Fork 0
mirror of https://gitlab.com/mrubli/hugo-mod-leaflet.git synced 2025-10-07 18:14:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

README.md: Add instructions for getting started

Browse Source
This commit is contained in:
Martin Rubli
2025-04-09 22:27:03 +02:00
parent 891cef7a8b
commit 3fb5f2015b
1 changed files with 24 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
README.md
View File

@@ -30,9 +30,26 @@ And below is how this might render:
## Documentation ## Documentation
### Getting started
An [example website is available](https://gitlab.com/mrubli/hugo-mod-leaflet-example/) that illustrates how to use hugo-mod-leaflet in your own Hugo website.
In a nutshell:
1. Add a dependency to `gitlab.com/mrubli/hugo-mod-leaflet.git` in your configuration (typically `hugo.toml` or `hugo.yaml`).
2. Find out how the theme of your choice lets you add code to the site's `<head>` section. A good candidate to look is `layouts/_default/baseof.html` or other files in the same directory. (The example website [uses](https://gitlab.com/mrubli/hugo-mod-leaflet-example/-/blob/master/layouts/partials/site-scripts.html) the `layouts/partials/site-scripts.html` customization point of the [Ananke theme](https://github.com/theNewDynamic/gohugo-theme-ananke).)
3. Invoke the `leaflet-loader` shortcode from the `<head>` section. Typically, you'd do this with a snippet like this one:
```
{{ if .HasShortcode "leaflet-map" }}
{{ partial "leaflet-loader" . }}
{{ end }}
```
4. Now you can use the shortcodes provided by hugo-mod-leaflet in your content files.
### Shortcodes
The current shortcode documentation is contained at the top of [leaflet-map.html](layouts/shortcodes/leaflet-map.html) but is reproduced here for convenience: The current shortcode documentation is contained at the top of [leaflet-map.html](layouts/shortcodes/leaflet-map.html) but is reproduced here for convenience:
### Syntax summary #### Syntax summary
```go-html-template ```go-html-template
{{< leaflet-map centerLat=FLOAT centerLon=FLOAT zoom=INT width="STRING" height="STRING" resizable=BOOL maximizable=BOOL freezable=BOOL freezeOptions="STRING" >}} {{< leaflet-map centerLat=FLOAT centerLon=FLOAT zoom=INT width="STRING" height="STRING" resizable=BOOL maximizable=BOOL freezable=BOOL freezeOptions="STRING" >}}
@@ -44,7 +61,7 @@ The current shortcode documentation is contained at the top of [leaflet-map.html
{{< /leaflet-map >}} {{< /leaflet-map >}}
``` ```
### Map options #### Map options
``` ```
centerLat/centerLon: centerLat/centerLon:
@@ -74,7 +91,7 @@ freezeOptions:
Example: freezeOptions=" " (to avoid the hugo-mod-leaflet default and use Leaflet.Freezy's defaults instead) Example: freezeOptions=" " (to avoid the hugo-mod-leaflet default and use Leaflet.Freezy's defaults instead)
``` ```
### Layer options #### Layer options
``` ```
id: id:
@@ -112,14 +129,14 @@ selectorPosition:
Optional, defaults to "bottomleft". If specified for more than one layer, the last one wins. Optional, defaults to "bottomleft". If specified for more than one layer, the last one wins.
``` ```
### Marker options #### Marker options
``` ```
lat/lon: lat/lon:
Coordinates of the marker as decimal values. Coordinates of the marker as decimal values.
``` ```
### Track options #### Track options
``` ```
path: path:
@@ -137,7 +154,7 @@ downloadable:
Optional, defaults to true. Optional, defaults to true.
``` ```
### Scale options #### Scale options
``` ```
position: position:
@@ -145,7 +162,7 @@ position:
Optional, defaults to "bottomright". Optional, defaults to "bottomright".
``` ```
### Elevation profile options #### Elevation profile options
``` ```
resizable: resizable: