Added news page to act as a blog feed, homepage becomes instafeed.

Updated avatar.jpg and social.jpg images.

_config.yml

@@ -10,6 +10,9 @@ collections:
   posts:
     output: true
     permalink: /blog/:slug
+  news:
+    output: true
+    permalink: /news/:slug
 
 defaults:
   -
@@ -32,9 +35,9 @@ defaults:
   -
     scope:
       path: ""
-      type: "projects"
+      type: "news"
     values:
-      layout: "project"
+      layout: "news"
 
 markdown: kramdown
 

_data/settings.yml

@@ -10,8 +10,10 @@ header_settings:
 
 menu_settings:
   menu_items:
-    - title: 'Home'
+    - title: 'Feed'
       url: '/'
+    - title: 'News'
+      url: '/news/'
     - title: 'About'
       url: '/about'
     - title: 'Contact'

_layouts/default.html

@@ -95,6 +95,7 @@
 	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 	<script src="{{ '/js/plugins-min.js' | relative_url }}"></script>
 	<script src="{{ '/js/simples-min.js' | relative_url }}"></script>
+	<script type="text/javascript" src="https://cdn.boomcdn.com/libs/instafeed-js/1.4.1/instafeed.min.js"></script>
 
 	{% if site.data.settings.advanced_settings.footer_js %}
 	<!-- Extra Footer JS Code -->

_layouts/news.html

@@ -0,0 +1,16 @@
+---
+layout: default
+---
+
+<section class="single">
+
+	<div class="wrap">
+
+		<h1>{{ page.title }}</h1>
+		<p class="subtitle">{{ page.subtitle }}</p>
+
+		{{ page.content }}
+
+	</div>
+
+</section>

_news/2021-08-15-work-in-progress.md

@@ -0,0 +1,12 @@
+---
+title: 'Work in Progress'
+date: 2021-08-15 00:00:00
+featured_image: '/images/pittville.jpeg'
+excerpt: We're working on a refreshed CheltBMX right now. Check back soon for more updates.
+---
+
+![](/images/pittville.jpeg)
+
+## An update
+
+We're working on a refreshed CheltBMX right now. Check back soon for more updates.

_pages/about.md

@@ -1,7 +1,7 @@
 ---
 title: About
 description: CheltBMX is a community of riders.
-subtitle: Setup in 2004, CheltBMX is the home of riders of BMX in Cheltenham.
+subtitle: Setup in 2004, CheltBMX is the home of BMX riders in Cheltenham.
 featured_image: /images/social.jpg
 ---
 

_sass/_includes/_listing.scss

@@ -29,9 +29,10 @@
 }
 
 .listing-post__image {
-	margin-top: 20px;
+	margin-top: 30px;
 	display: block;
-	width: 100%;
+	margin: auto;
+	max-width: 1080px;
 	height: 0;
 	padding-bottom: 56.25%;
 	background-size: cover;

index.html

@@ -9,7 +9,29 @@
 
 	<div class="wrap">
 
-		{% for post in paginator.posts %}
+		<script src="https://cdn.jsdelivr.net/gh/stevenschobert/instafeed.js@2.0.0rc1/src/instafeed.min.js"></script>
+
+		<article class="listing-post">
+			<div id="instafeed"></div>
+		</article>
+
+		<script type="text/javascript">
+				fetch('${{ secrets.INSTANT_TOKENS_URL }}')
+				.then(resp => resp.json())
+				.then(data => {
+					const feed = new Instafeed({
+					accessToken: data.Token, // Access token from json response
+					//template: '<a class="listing-post__image" href="\{\{link\}\}"><img src="\{\{image\}\}" /></a>',
+					template: '<a href="\{\{link\}\}" class="listing-post__image" style="background-image: url(\{\{image\}\});"></a>',
+					});
+					feed.run();
+				})
+				.catch((error) => {
+					console.log(error)
+				});
+		</script>
+
+		<!-- {% for post in paginator.posts %}
 
 		<article class="listing-post">
 
@@ -29,13 +51,13 @@ <h2 class="listing-post__title"><a href="{{ post.url | relative_url }}">{{ post.
 
 		</article>
 
-		{% endfor %}
+		{% endfor %} -->
 
 	</div>
 
 </section>
 
-{% if paginator.total_pages > 1 %}
+<!-- {% if paginator.total_pages > 1 %}
 
 <section class="pagination">
 
@@ -52,4 +74,4 @@ <h2 class="listing-post__title"><a href="{{ post.url | relative_url }}">{{ post.
 
 </section>
 
-{% endif %}
+{% endif %} -->

news/index.html

@@ -0,0 +1,36 @@
+---
+layout: default
+title: News
+description: Simples is a super simple blogging theme for Jekyll.
+featured_image: /images/social.jpg
+---
+
+<section class="listing single">
+
+	<div class="wrap">
+
+		{% for news in site.news reversed %}
+
+		<article class="listing-post">
+
+			<div class="listing-post__header">
+				<h2 class="listing-post__title"><a href="{{ news.url | relative_url }}">{{ news.title }}</a></h2>
+				<p class="listing-post__subtitle">{{ news.subtitle }}</p>
+			</div>
+
+			{% if news.featured_image %}
+			<a href="{{ news.url | relative_url }}" class="listing-post__image" style="max-width: 1080px; background-image: url({{ news.featured_image | relative_url }});"></a>
+			{% endif %}
+
+			<div class="listing-post__content">
+				<p>{{ news.excerpt }}</p>
+				<p><a href="{{ news.url | relative_url }}" class="button">View news</a>
+			</div>
+
+		</article>
+
+		{% endfor %}
+
+	</div>
+
+</section>