← hugo-clarity

Add pinning featured posts option

e1d52af448aba8d8f6b5ed6c7f47085740487d7e · Luke Hong · Jul 26, 2022 01:22

Signed-off-by: Luke Hong <luke0724@hotmail.com>

+25 −4 · 3 files changed

  • README.md +10 −2
  • exampleSite/config/_default/params.toml +8 −2
  • layouts/partials/archive.html +7 −0
diff --git a/README.md b/README.md
index c938961..9c29d78 100644
--- a/README.md
+++ b/README.md
@@ -235,6 +235,8 @@ These options set global values that some pages or all pages in the site use by
 | comments                   | boolean                     | yes                 |
 | numberOfRecentPosts        | integer                     | no                  |
 | numberOfFeaturedPosts      | integer                     | no                  |
+| pinFeatured                | boolean                     | no                  |
+| numberOfPinnedPosts        | integer                     | no                  |
 | dateFormat                 | string                      | no                  |
 | enableMathNotation         | boolean                     | yes                 |
 | customFonts                | boolean                     | no                  |
@@ -798,13 +800,13 @@ You can override these setting from each post individually. For example, you may
 
  If you wish use [Utterances](https://github.com/utterance/utterances) comments on your site, you'll need to perform the following:
 
- * Ensure you have a GitHub public repository, which you've granted permissions to the [Utterances GitHub App](https://github.com/apps/utterances). 
+ * Ensure you have a GitHub public repository, which you've granted permissions to the [Utterances GitHub App](https://github.com/apps/utterances).
  * Comment out the line for `disqusShortname = ""` in the `/config/_default/config.toml` file.
  * Set `comments = true` in the `/config/_default/params.toml` file.
  * Configure the utterances parameters in the `/config/_default/params.toml` file.
 
  Utterances is loaded in the `comments.html` partial by referring to the `utterances.html` partial.   Since `single.html` layout loads comments if comments are enabled, you must ensure *both* the `comments` and `utterances` parameters are configured.
- 
+
 
 
 
@@ -925,3 +927,9 @@ __Search Scope__
 - Searching outside a section will search the entire site.
 
      For example, with the above setup, searching from the homepage will produce results from the entire site.
+
+### Pinning Featured Posts
+
+This allows you to show the featured posts at the top of the post list.
+
+Using the site configuration option `pinFeatured` to enable/disable it, and the option `numberOfPinnedPosts` to control how many posts to be pinned.
\ No newline at end of file
diff --git a/exampleSite/config/_default/params.toml b/exampleSite/config/_default/params.toml
index 2ba2b67..8e02001 100644
--- a/exampleSite/config/_default/params.toml
+++ b/exampleSite/config/_default/params.toml
@@ -105,12 +105,18 @@ languageMenuName = "🌐"
 # utterancesTheme = "github-light" # Default: github-dark
 # utterancesIssueTerm = "pathname" # Default: pathname
 
-# Maximum number of recent posts.
+# Maximum number of recent posts. (default: 8)
 # numberOfRecentPosts = 8
 
-# Maximum number of featured posts.
+# Maximum number of featured posts. (default: 8)
 # numberOfFeaturedPosts = 8
 
+# Pin featured posts in list.
+# pinFeatured = true
+
+# Maximum number of pinned featured posts. (default: 8)
+# numberOfPinnedPosts = 8
+
 # Date format. Checkout https://gohugo.io/functions/format/#hugo-date-and-time-templating-reference for details.
 # dateFormat = "2006-01-02" # Default to "Jan 2, 2006".
 # customFonts = false # toggle to true if you want to use custom fonts only.
diff --git a/layouts/partials/archive.html b/layouts/partials/archive.html
index 2ba56e4..9f02449 100644
--- a/layouts/partials/archive.html
+++ b/layouts/partials/archive.html
@@ -2,6 +2,13 @@
 {{ if .IsHome }}
   {{ $pages = where site.RegularPages "Type" "in" site.Params.mainSections }}
 {{ end }}
+
+{{ if eq site.Params.pinFeatured true }}
+  {{ $featured := default 8 site.Params.numberOfPinnedPosts }}
+  {{ $featuredPosts := first $featured (where $pages "Params.featured" true)}}
+  {{ $normalPosts := $pages | symdiff $featuredPosts }}
+  {{ $pages = $featuredPosts | append $normalPosts }}
+{{ end }}
 <div class="grid-inverse wrap content">
   <div>
     <ul class="posts" id="posts">