diff options
author | Emir Ribic <ribice@gmail.com> | 2018-11-02 11:47:48 +0300 |
---|---|---|
committer | Emir Ribic <ribice@gmail.com> | 2018-11-02 11:47:48 +0300 |
commit | fc998f7c81afe9b4983d9b48f20a12c1e5169e45 (patch) | |
tree | 98dca94ea1fa5bd5e1bc6bf171366d320f6e365c | |
parent | 893a13291ca83770dfb80a1c30e26ea470432010 (diff) |
Add sorting for social iconsv2.0.0
-rw-r--r-- | README.md | 25 | ||||
-rw-r--r-- | exampleSite/config.toml | 6 | ||||
-rw-r--r-- | layouts/partials/nav.html | 50 |
3 files changed, 49 insertions, 32 deletions
@@ -102,12 +102,21 @@ To align images, add #c for center, #r/l for right/left. ![](/img/1/image.jpg#c) ``` +#### Changing Social Menu Icons Order + + If you want to change the order of the social menu icons, modify the `[params.social.config]` section of your `config.toml` file: + + ```toml +[params.social.config] +platforms = ["github","facebook","twitter","instagram","email","codepen","linkedin"] +``` + + The social menu icons will appear in the order you specify in the `platforms` array. ## Add sections Links can be added to the navbar (below the blog name and social links). There are two positions: - - `[params.sections_left]` that will add links in the left side (under the blog title) - `[params.sections_right]` that will add links in the right side (under the social links) @@ -124,14 +133,14 @@ There are two positions: It is recommended to put your own favicons -* `apple-touch-icon.png` (180x180) -* `favicon-32x32.png` (32x32) -* `favicon-16x16.png` (16x16) -* `mstile-150x150.png` (150x150) -* `android-chrome-192x192.png` (192x192) -* `android-chrome-512x512.png` (512x512) +- `apple-touch-icon.png` (180x180) +- `favicon-32x32.png` (32x32) +- `favicon-16x16.png` (16x16) +- `mstile-150x150.png` (150x150) +- `android-chrome-192x192.png` (192x192) +- `android-chrome-512x512.png` (512x512) -into `/static`. They're easily created via https://realfavicongenerator.net/. +in `/static` directory. They're easily created via [Favicon Generator](https://realfavicongenerator.net/). Customize `browserconfig.xml` and `site.webmanifest` to set `theme-color` and `background-color` for example. diff --git a/exampleSite/config.toml b/exampleSite/config.toml index c7695c0..99b64e2 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -40,9 +40,13 @@ twitter = "ribicemir" github = "ribice" email = "ribice@gmail.com" linkedin = "ribice" -facebook = "ribice" +gitlab = "ribice" instagram = "" codepen = "" +facebook = "" + +[params.social.config] +platforms = ["twitter","github","email","email","linkedin","gitlab"] [params.matomoAnalytics] siteID = 1 diff --git a/layouts/partials/nav.html b/layouts/partials/nav.html index 08fd79b..96993e4 100644 --- a/layouts/partials/nav.html +++ b/layouts/partials/nav.html @@ -2,13 +2,17 @@ <div class="container"> <nav class="nav"> <div class="nav-left"> - <a class="nav-item" href="{{ .Site.BaseURL }}"><h1 class="title is-4">{{ .Site.Title }}</h1></a> + <a class="nav-item" href="{{ .Site.BaseURL }}"> + <h1 class="title is-4">{{ .Site.Title }}</h1> + </a> </div> <div class="nav-right"> <nav class="nav-item level is-mobile"> - {{- range $platform, $username := .Site.Params.social -}} - {{- if $username -}} - <a class="level-item" aria-label="{{ $platform }}" href='{{ print ( index $.Site.Data.theme.social.base $platform ) $username }}' target='_blank' rel='noopener'> + {{- $social := ( .Site.Params.social ) -}} + {{- range $platform := $social.config.platforms -}} + {{- with $username := ( index $social $platform ) -}} + <a class="level-item" aria-label="{{ $platform }}" href='{{ print ( index $.Site.Data.theme.social.base $platform ) $username }}' + target='_blank' rel='noopener'> <span class="icon"> <i class> {{- partial "svg/icons" $platform -}} @@ -23,29 +27,29 @@ <nav class="nav"> {{ if (isset .Site.Params "sections_left" ) }} - <div class="nav-left"> - {{- range $section, $printable := .Site.Params.sections_left -}} - {{- if $printable -}} - <a class="nav-item" href="{{$section}}"> - <h2 class="title is-5">{{$printable}}</h2> - </a> - {{- end -}} - {{- end -}} - </div> + <div class="nav-left"> + {{- range $section, $printable := .Site.Params.sections_left -}} + {{- if $printable -}} + <a class="nav-item" href="{{$section}}"> + <h2 class="title is-5">{{$printable}}</h2> + </a> + {{- end -}} + {{- end -}} + </div> {{ end }} {{ if (isset .Site.Params "sections_right" ) }} - <div class="nav-right"> - {{- range $section, $printable := .Site.Params.sections_right -}} - {{- if $printable -}} - <a class="nav-item" href="{{$section}}"> - <h2 class="title is-5">{{$printable}}</h2> - </a> - {{- end -}} - {{- end -}} - </div> + <div class="nav-right"> + {{- range $section, $printable := .Site.Params.sections_right -}} + {{- if $printable -}} + <a class="nav-item" href="{{$section}}"> + <h2 class="title is-5">{{$printable}}</h2> + </a> + {{- end -}} + {{- end -}} + </div> {{ end }} </nav> </div> -</section> +</section>
\ No newline at end of file |