Merge pull request #166 from chrisrhymes/feature/follow-icons

Feature/follow icons
chrisrhymes · Sep 1, 2024 · c644b9c · c644b9c
2 parents 52b45c4 + 6fb7f53
commit c644b9c
Show file tree

Hide file tree

Showing 9 changed files with 97 additions and 4 deletions.
diff --git a/_config.yml b/_config.yml
@@ -84,3 +84,12 @@ collections:
     layout: product
     image: https://via.placeholder.com/800x600
     show_sidebar: false
+
+social:
+  facebook: https://www.facebook.com/
+  instagram: https://www.instagram.com/
+  threads: https://www.threads.net/
+  tiktok: https://www.tiktok.com/
+  x: https://www.x.com/
+  youtube: https://www.youtube.com/
+
diff --git a/_includes/follow.html b/_includes/follow.html
@@ -0,0 +1,52 @@
+{% if site.social %}
+    <div class="buttons is-centered mt-6 mb-6">
+        {% if site.social.facebook %}
+            <a href="{{ site.social.facebook }}" class="button is-medium">
+                <span class="icon is-medium">
+                    <i class="fa-brands fa-facebook fa-xl"></i>
+                    <span class="is-sr-only">Facebook</span>
+                </span>
+            </a>
+        {% endif %}
+        {% if site.social.instagram %}
+            <a href="{{ site.social.instagram }}" class="button is-medium">
+                <span class="icon is-medium">
+                    <i class="fa-brands fa-instagram fa-xl"></i>
+                    <span class="is-sr-only">Instagram</span>
+                </span>
+            </a>
+        {% endif %}
+        {% if site.social.threads %}
+            <a href="{{ site.social.threads }}" class="button is-medium">
+                <span class="icon is-medium">
+                    <i class="fa-brands fa-threads fa-xl"></i>
+                    <span class="is-sr-only">Threads</span>
+                </span>
+            </a>
+        {% endif %}
+        {% if site.social.tiktok %}
+            <a href="{{ site.social.tiktok }}" class="button is-medium">
+                <span class="icon is-medium">
+                    <i class="fa-brands fa-tiktok fa-xl"></i>
+                    <span class="is-sr-only">TikTok</span>
+                </span>
+            </a>
+        {% endif %}
+        {% if site.social.x %}
+            <a href="{{ site.social.x }}" class="button is-medium">
+                <span class="icon is-medium">
+                    <i class="fa-brands fa-x-twitter fa-xl"></i>
+                    <span class="is-sr-only">X/Twitter</span>
+                </span>
+            </a>
+        {% endif %}
+        {% if site.social.youtube %}
+            <a href="{{ site.social.youtube }}" class="button is-medium">
+                <span class="icon is-medium">
+                    <i class="fa-brands fa-youtube fa-xl"></i>
+                    <span class="is-sr-only">YouTube</span>
+                </span>
+            </a>
+        {% endif %}
+    </div>
+{% endif %}
diff --git a/_includes/footer.html b/_includes/footer.html
@@ -12,6 +12,8 @@
             </div>
         {% endif %}
 
+        {% include follow.html %}
+
         <div class="content is-small has-text-centered">
             <p class="">Theme built by <a href="https://www.csrhymes.com">C.S. Rhymes</a></p>
         </div>

diff --git a/_includes/head.html b/_includes/head.html
@@ -16,7 +16,13 @@
     <script
         src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js.cookie.min.js"
     ></script>
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5/css/all.min.css">
+    <link
+        rel="stylesheet"
+        href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css"
+        integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg=="
+        crossorigin="anonymous"
+        referrerpolicy="no-referrer"
+    >
     {% unless site.hide_share_buttons %}
         <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma-social@1/bin/bulma-social.min.css">
     {% endunless %}

diff --git a/bulma-clean-theme.gemspec b/bulma-clean-theme.gemspec
@@ -2,7 +2,7 @@
 
 Gem::Specification.new do |spec|
   spec.name          = "bulma-clean-theme"
-  spec.version       = "1.0.4"
+  spec.version       = "1.1.0"
   spec.authors       = ["chrisrhymes"]
   spec.email         = ["[email protected]"]
 

diff --git a/changelog.txt b/changelog.txt
@@ -1,8 +1,12 @@
+# 1.1.0
+* Update FontAwesome to v6.6
+* Add social links to the footer
+
 # 1.0.4
 * Update Bulma to 1.0.2
 * Add TikTok video include
 * Allow customising product collection name
-* Increse cookie expiry time in cookie banner
+* Increase cookie expiry time in cookie banner
 
 # 1.0.3
 * Update Bulma to 1.0.1

diff --git a/docs/navigation/footer-navigation.md b/docs/navigation/footer-navigation.md
@@ -30,4 +30,20 @@ footer_menu: example_footer_menu
 
 ## Hiding the footer
 
-If you would like to hide the footer on a particular page then set `hide_footer: true` in the page's front matter.
+If you would like to hide the footer on a particular page then set `hide_footer: true` in the page's front matter.
+
+## Footer social links
+
+**Added in v1.1.0**
+
+You can add social links to your footer by setting the links to your social profiles in the `_config.yml` file. 
+
+```yaml
+social:
+  facebook: https://www.facebook.com/
+  instagram: https://www.instagram.com/
+  threads: https://www.threads.net/
+  tiktok: https://www.tiktok.com/
+  x: https://www.x.com/
+  youtube: https://www.youtube.com/
+```
diff --git a/docs/products/category-page.md b/docs/products/category-page.md
@@ -25,6 +25,8 @@ sort: title
 
 ## Customising the collection
 
+**Added in v1.0.4**
+
 To use a different collection than `products`, set the collection name in the category page's front matter. 
 
 The below example uses a collection called `books`. 

diff --git a/docs/products/product-pages.md b/docs/products/product-pages.md
@@ -13,6 +13,8 @@ The default collection name for products is `products`, so create a `_products`
 
 ## Custom Collection Directory
 
+**Added in v1.0.4**
+
 You can override the default and create a folder with your own collection name. For example, using a collection of `books` would require you to create a folder called `_books`.
 
 ## Product Pages