Convert homepage Recent Posts and Projects sections to shortcodes wit…

…h the ability to customize the number of results. Those can now be included or excluded from within _index.md. Also add a see more projects link next to projects heading in shortcode.
wjh18 · Aug 7, 2023 · c7df0e1 · c7df0e1
1 parent 90db35b
commit c7df0e1
Show file tree

Hide file tree

Showing 5 changed files with 68 additions and 50 deletions.
diff --git a/assets/scss/pages/_home.scss b/assets/scss/pages/_home.scss
@@ -59,7 +59,6 @@
 }
 
 .home-section-title {
-  margin-bottom: 50px;
 
   &::after {
     background-color: var(--color-contrast-medium);
@@ -96,4 +95,10 @@
 
 .see-more {
   margin-top: 30px;
+}
+
+.see-more-projects {
+  color: var(--color-contrast-medium);
+  font-weight: 300;
+  font-size: var(--font-size-base);
 }
diff --git a/layouts/index.html b/layouts/index.html
@@ -46,54 +46,7 @@ <h1 class="hero-title">{{ .Title }}</h1>
       {{ end }}
     </div>
   </section>
-  <section class="section">
-    <div class="home-title-dropdown">
-      <h2 class="home-section-posts-title">
-        {{- with .Params.posts_section_heading -}}
-          {{- . -}}
-        {{- else -}}
-          Recent Posts
-        {{- end -}}
-      </h2>
-      <select name="choice" id="select-posts">
-        {{ range (where .Sections "Section" "posts") }}
-        <option value="all-{{ .Name | lower }}" selected>All {{ .Name | lower }}</option>
-        {{ range .Sections }}
-        {{ if .CurrentSection.Pages }}
-        <option value="{{ replace .CurrentSection.RelPermalink "/" "" | lower }}">{{ .CurrentSection.Name }}</option>
-        {{ end }}
-        {{ end }}
-        {{ end }}
-      </select>
-    </div>
-    {{ range (where site.RegularPages "Section" "posts" | first 10) }}
-      <div class="post-entry-filter entry--{{ replace .CurrentSection.RelPermalink "/" "" | lower }}">
-        {{ partial "posts/post-entry.html" . }}
-        <div class="post-entry-divider"></div>
-      </div>
-    {{ else }}
-      {{ partial "general/fallback-text.html" . }}
-    {{ end }}
-    <a class="btn-secondary see-more" href="{{ "posts/" | relURL }}">More Posts</a>
-  </section>
-  <section class="section">
-    <h2 class="home-section-title">
-      {{- with .Params.projects_section_heading -}}
-        {{- . -}}
-      {{- else -}}
-        My Projects
-      {{- end -}}
-    </h2>
-    {{ $projects := where site.RegularPages "Section" "projects" | first 6 }}
-    {{ with $projects }}
-      <div class="project-list">
-        {{- range . }}
-          {{ partial "projects/project-entry.html" . }}
-        {{ end }}
-      </div>
-    {{ else }}
-      {{ partial "general/fallback-text.html" . }}
-    {{ end }}
-  </section>
+  {{/*  Shortcodes from page content  */}}
+  {{ .Content }}
 </div>
 {{ end }}
diff --git a/layouts/shortcodes/.keep b/layouts/shortcodes/.keep
diff --git a/layouts/shortcodes/projects.html b/layouts/shortcodes/projects.html
@@ -0,0 +1,26 @@
+<section class="section">
+  <div class="home-title-dropdown">
+    <h2 class="home-section-title">
+      {{- with $.Page.Params.projects_section_heading -}}
+        {{- . -}}
+      {{- else -}}
+        My Projects
+      {{- end -}}
+    </h2>
+    <a class="see-more-projects" href="{{ "projects/" | relURL }}">View all &raquo;</a>
+  </div>
+  {{ $num := .Get 0 }}
+  {{ if not $num }}
+    {{ $num = 6 }}
+  {{ end }}
+  {{ $projects := where site.RegularPages "Section" "projects" | first $num }}
+  {{ with $projects }}
+    <div class="project-list">
+      {{- range . }}
+        {{ partial "projects/project-entry.html" . }}
+      {{ end }}
+    </div>
+  {{ else }}
+    {{ partial "general/fallback-text.html" . }}
+  {{ end }}
+</section>
diff --git a/layouts/shortcodes/recent-posts.html b/layouts/shortcodes/recent-posts.html
@@ -0,0 +1,34 @@
+<section class="section">
+  <div class="home-title-dropdown">
+    <h2 class="home-section-posts-title">
+      {{- with $.Page.Params.posts_section_heading -}}
+        {{- . -}}
+      {{- else -}}
+        Recent Posts
+      {{- end -}}
+    </h2>
+    <select name="choice" id="select-posts">
+      {{ range (where site.Sections "Section" "posts") }}
+      <option value="all-{{ .Name | lower }}" selected>All {{ .Name | lower }}</option>
+      {{ range .Sections }}
+      {{ if .CurrentSection.Pages }}
+      <option value="{{ replace .CurrentSection.RelPermalink "/" "" | lower }}">{{ .CurrentSection.Name }}</option>
+      {{ end }}
+      {{ end }}
+      {{ end }}
+    </select>
+  </div>
+  {{ $num := .Get 0 }}
+  {{ if not $num }}
+    {{ $num = 10 }}
+  {{ end }}
+  {{ range (where site.RegularPages "Section" "posts" | first $num) }}
+    <div class="post-entry-filter entry--{{ replace .CurrentSection.RelPermalink "/" "" | lower }}">
+      {{ partial "posts/post-entry.html" . }}
+      <div class="post-entry-divider"></div>
+    </div>
+  {{ else }}
+    {{ partial "general/fallback-text.html" . }}
+  {{ end }}
+  <a class="btn-secondary see-more" href="{{ "posts/" | relURL }}">More Posts</a>
+</section>