Fix Issues #14 & #4, Add .gitignore, Edit _config.xml

.gitignore

@@ -0,0 +1,6 @@
+# Jekyll Generated Files
+_site/
+.jekyll-cache
+
+# Mac
+.DS_Store

README.md

@@ -1,6 +1,6 @@
 # Windows 95 Theme for Jekyll
 
-![ss](https://github.com/h01000110/windows-95/raw/gh-pages/screenshot_2.png)
+![Screen shot of website](assets/img/ScreenshotWithIcons.png)
 
 Homepage: [Windows 95](https://h01000110.github.io/20170917/windows-95)
 

_config.yml

@@ -1,13 +1,14 @@
 permalink: /:year:month:day/:title
-url: #Your url here
-baseurl: /project
+# When testing locally, leave "url:" blank or use http://localhost:4000
+url: # Your URL Here
+# When testing locally, leave "baseurl:" blank
+baseurl:
 
-# variables
+# Variables
 name: Your Site Name
 description: Your description here
 google_verification: null
 
-
 # File management
 include: [".htaccess"]
 exclude: ["README.md", "LICENSE"]
@@ -20,6 +21,8 @@ sass:
 # Markdown
 markdown: kramdown
 kramdown:
-  input: GFM
+  #  Defaults to GFM according to the docs:
+  #    https://jekyllrb.com/docs/configuration/markdown/
+  #  input: GFM
   syntax_highlighter_opts:
-    disable : true
+    disable : true

_data/tags.yml

@@ -9,3 +9,6 @@ tag3:
 
 tag4:
   name: tag4
+
+icons:
+  name: icons

_includes/post-type-ico-file.html

@@ -0,0 +1,16 @@
+{% comment %}
+  (*.ico is large icon in top window)
+  DEFAULT ASSIGN FILE ICON IF NONE ASSIGNED.
+  IF STATEMENT FOR EACH TYPE OTHER THAN DEFAULT "FILE.ICO"
+{% endcomment %}
+
+{% assign img_src = "/assets/img/file.ico" %}
+{% if post.filetype == "image" %}
+  {% assign img_src = "/assets/img/image.ico" %}
+{% elsif post.filetype == "image2" %}
+  {% assign img_src = "/assets/img/image2.ico" %}
+{% elsif post.filetype == "creation" %}
+  {% assign img_src = "/assets/img/creation.ico" %}
+{% elsif post.filetype == "music" %}
+  {% assign img_src = "/assets/img/music.ico" %}
+{% endif %}

_includes/post-type-png-file.html

@@ -0,0 +1,17 @@
+{% comment %}
+  (*.png is small icon in the bottom window title bar)
+  DEFAULT ASSIGN FILE ICON IF NONE ASSIGNED.
+  IF STATEMENT FOR EACH TYPE OTHER THAN DEFAULT "FILE.PNG"
+{% endcomment %}
+
+{% assign img_src = "/assets/img/file.png" %}
+{% if page.filetype == "image" %}
+  {% assign img_src = "/assets/img/image.png" %}
+{% elsif page.filetype == "image2" %}
+  {% assign img_src = "/assets/img/image2.png" %}
+{% elsif page.filetype == "creation" %}
+  {% assign img_src = "/assets/img/creation.png" %}
+{% elsif page.filetype == "music" %}
+  {% assign img_src = "/assets/img/music.png" %}
+{% endif %}
+<img src="{{ img_src }}" />

_includes/show-all-posts.html

@@ -0,0 +1,9 @@
+<ul>
+  {% for post in site.posts %}
+    {% include post-type-ico-file.html %}
+    <li>
+      <a href="{{ post.url }}" title="{{ post.title }}">
+        <img src="{{ img_src }}" title="{{ post.title }}" />{{ post.title }}</a>
+    </li>
+  {% endfor %}
+</ul>

_includes/show-only-posts-based-on-tag.html

@@ -0,0 +1,16 @@
+<ul>
+  {% comment %}
+    TO ONLY SHOW TAGS WHEN A PAGE IS SELECTED:
+      { for post in site.tags[page.tag] }
+    TO SHOW ALL WHEN A PAGE IS SELECTED:
+      { for post in site.posts }
+
+      NOTE THAT THIS ONLY WORKS WHEN EACH POST ONLY HAS ONE TAG
+      DOES NOT WORK WITH `tags: <TAG> <TAG>` IN FRONTMATTER
+  {% endcomment %}
+
+  {% for post in site.tags[page.tag] %}
+    {% include post-type-ico-file.html %}
+    <li><a href="{{  post.url }}" title="{{ post.title }}"><img src="{{ img_src }}" title="{{ post.title }}" />{{ post.title }}</a></li>
+  {% endfor %}
+</ul>

_layouts/default.html

@@ -32,32 +32,24 @@ <h1>{{ site.name }}</h1>
 		<div class="tag_list">
 			<ul id="tag-list">
 				<li><a href="/" ><img src="/assets/img/disk.png" />(C:)</a>
-			<ul>
-				{% assign tags = site.tags | sort %}
-				{% for tag in tags %}
-				<li><a href="/tag/{{ tag | first | slugify }}/" title="{{ tag[0] | replace:'-', ' ' }}"><img src="/assets/img/folder.ico" />{{ tag[0] | replace:'-', ' ' }}</a></li>
-				{% endfor %}
-			</ul>
+					<ul>
+						{% assign tags = site.tags | sort %}
+						{% for tag in tags %}
+							<li><a href="/tag/{{ tag | first | slugify }}/" title="{{ tag[0] | replace:'-', ' ' }}"><img src="/assets/img/folder.ico" />{{ tag[0] | replace:'-', ' ' }}</a></li>
+						{% endfor %}
+					</ul>
 				</li>
 			</ul>
 		</div>
 		<div class="post_list">
 			{% unless page.date%}
 				{% if page.title == 'me' or page.title == '404...' %}
-					<ul>
-						{% for post in site.posts %}
-						<li><a href="{{  post.url }}" title="{{ post.title }}"><img src="/assets/img/file.ico" title="{{ post.title }}" />{{ post.title }}</a></li>
-						{% endfor %}
-					</ul>
+					{% include show-all-posts.html %}
 				{% else %}
 					{{ content }}
 				{% endif %}
 			{% else %}
-				<ul>
-					{% for post in site.posts %}
-					<li><a href="{{  post.url }}" title="{{ post.title }}"><img src="/assets/img/file.ico" title="{{ post.title }}" />{{ post.title }}</a></li>
-					{% endfor %}
-				</ul>
+				{% include show-only-posts-based-on-tag.html %}
 			{% endunless %}
 		</div>
 		<div class="post_total">
@@ -70,9 +62,9 @@ <h1>{{ site.name }}</h1>
 		</div>
 	</div>
 	{% if page.title %}
-        <div class="content">
+		<div class="content">
 			<div class="post_title">
-				<img src="/assets/img/file.png" />
+				{% include post-type-png-file.html %}
 				<h1>{{  page.title  }}</h1>
 				<a href="/"><div class="btn"><span class="fa fa-times"></span></div></a>
 				<div class="btn btn_max"><span class="fa fa-window-maximize"></span></div>
@@ -82,17 +74,17 @@ <h1>{{  page.title  }}</h1>
 				<li>{{ page.date | date: '%B %-d, %Y' }}</li>
 			</ul>
 			<div class="post_content">
-        		{{ content }}
+					{{ content }}
 				{% if page.title %}
 					{% include donate.html %}
 				{% endif %}
 			</div>
 		</div>
-    {% endif %}
+  {% endif %}
 	<script src="/assets/js/001.js"></script>
 	<script src="/assets/js/002.js"></script>
 	<div class="footer">
 		<p>Created by <a href="http://github.com/h01000110" target="_blank">h01000110 (hi)</a> | Code licensed under <a href="https://github.com/h01000110/h01000110.github.io/blob/master/LICENSE" target="_blank">MIT License</a></p>
 	</div>
 </body>
-</html>
+</html>

_layouts/tag.html

@@ -3,6 +3,7 @@
 ---
 <ul>
 	{% for post in site.tags[page.tag] %}
-		<li><a href="{{  post.url }}" title="{{ post.title }}"><img src="/assets/img/file.ico" title="{{ post.title }}" />{{ post.title }}</a></li>
+		{% include post-type-ico-file.html %}
+		<li><a href="{{ post.url }}" title="{{ post.title }}"><img src="{{ img_src }}" title="{{ post.title }}" />{{ post.title }}</a></li>
 	{% endfor %}
-</ul>
+</ul>

_posts/2017-08-31-lorem-ipsum.md

@@ -1,11 +1,11 @@
 ---
 layout: default
 title: "Lorem Ipsum"
-tags: tag1 tag2 tag3 tag4
+tag: tag1
 ---
 
 ## Lorem Ipsum
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin enim nibh, suscipit sed rhoncus quis, blandit quis sapien. Ut congue pharetra rhoncus. Praesent finibus vitae urna quis cursus. Proin mollis elementum sapien, vitae viverra magna tincidunt a. Nullam tincidunt interdum dui ut ultricies. Maecenas pellentesque tellus ac mauris faucibus elementum. Nulla quis risus aliquam, pharetra neque non, dapibus augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Cras ullamcorper lacinia augue in placerat. Suspendisse lacinia massa id blandit varius. Mauris ultricies ultricies bibendum.  
 
-Mauris eu lectus fermentum leo dictum hendrerit. Maecenas vel leo sit amet quam laoreet consequat vitae nec eros. Curabitur eleifend eu orci quis consectetur. Sed pretium tortor at consequat tincidunt. Nullam a tellus faucibus, dapibus tortor eget, ullamcorper metus. Aenean at aliquet metus. Aenean molestie metus rutrum, tincidunt nulla quis, tincidunt lorem. Morbi diam sem, rutrum vitae convallis eget, dignissim semper lacus. Curabitur ipsum diam, tincidunt in hendrerit sit amet, luctus vitae dui. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+Mauris eu lectus fermentum leo dictum hendrerit. Maecenas vel leo sit amet quam laoreet consequat vitae nec eros. Curabitur eleifend eu orci quis consectetur. Sed pretium tortor at consequat tincidunt. Nullam a tellus faucibus, dapibus tortor eget, ullamcorper metus. Aenean at aliquet metus. Aenean molestie metus rutrum, tincidunt nulla quis, tincidunt lorem. Morbi diam sem, rutrum vitae convallis eget, dignissim semper lacus. Curabitur ipsum diam, tincidunt in hendrerit sit amet, luctus vitae dui. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

_posts/2017-09-16-markdown-test-page.md

@@ -1,7 +1,7 @@
 ---
 layout: default
 title: "Markdown Test Page"
-tags: tag1 tag3
+tag: tag1
 ---
 
 ## Source: [Markdown Test Page](https://github.com/fullpipe/markdown-test-page)
@@ -176,4 +176,4 @@ Incididunt in culpa cupidatat mollit cillum qui proident sit. In cillum aliquip
 
 [![Box](http://img.youtube.com/vi/qEuD6v1Y9fg/0.jpg)](http://www.youtube.com/watch?v=qEuD6v1Y9fg)
 
-Reprehenderit non eu quis in ad elit esse qui aute id [incididunt](#!) dolore cillum. Esse laboris consequat dolor anim exercitation tempor aliqua deserunt velit magna laboris. Culpa culpa minim duis amet mollit do quis amet commodo nulla irure.
+Reprehenderit non eu quis in ad elit esse qui aute id [incididunt](#!) dolore cillum. Esse laboris consequat dolor anim exercitation tempor aliqua deserunt velit magna laboris. Culpa culpa minim duis amet mollit do quis amet commodo nulla irure.

_posts/2021-08-16-image-example.md

@@ -0,0 +1,22 @@
+---
+layout: default
+title: "Image Example"
+tag: icons
+filetype: image
+---
+
+# This is an example of a post with the "image2" icon
+
+To use this, add `filetype: image` to the top in the [front matter](https://jekyllrb.com/docs/front-matter/) section.
+
+It will appear as this image in the post list:
+
+![large image icon](/assets/img/image.ico)
+
+And it will have this image in the topbar of the window:
+
+![small image icon](/assets/img/image.png)
+
+# Image Types
+
+The `<FILENAME>.png` is used for the small icons in the topbar. The `<FILENAME>.ico` image filetype is used for the larger icon that shows up in the post list.

_posts/2021-08-17-image2-example.md

@@ -0,0 +1,22 @@
+---
+layout: default
+title: "Image2 Example"
+tag: icons
+filetype: image2
+---
+
+# This is an example of a post with the "image2" icon
+
+To use this, add `filetype: image2` to the top in the [front matter](https://jekyllrb.com/docs/front-matter/) section.
+
+It will appear as this image in the post list:
+
+![large image icon](/assets/img/image2.ico)
+
+And it will have this image in the topbar of the window:
+
+![small image icon](/assets/img/image2.png)
+
+# Image Types
+
+The `<FILENAME>.png` is used for the small icons in the topbar. The `<FILENAME>.ico` image filetype is used for the larger icon that shows up in the post list.

_posts/2021-08-18-creation-example.md

@@ -0,0 +1,22 @@
+---
+layout: default
+title: "Creation Example"
+tag: icons
+filetype: creation
+---
+
+# This is an example of a post with the "creation" icon
+
+To use this, add `filetype: creation` to the top in the [front matter](https://jekyllrb.com/docs/front-matter/) section.
+
+It will appear as this image in the post list:
+
+![large image icon](/assets/img/creation.ico)
+
+And it will have this image in the topbar of the window:
+
+![small image icon](/assets/img/creation.png)
+
+# Image Types
+
+The `<FILENAME>.png` is used for the small icons in the topbar. The `<FILENAME>.ico` image filetype is used for the larger icon that shows up in the post list.

_posts/2021-08-19-music-example.md

@@ -0,0 +1,22 @@
+---
+layout: default
+title: "Music Example"
+tag: icons
+filetype: music
+---
+
+# How to use Icons
+
+To use this, add `filetype: music` to the top in the [front matter](https://jekyllrb.com/docs/front-matter/) section.
+
+It will appear as this image in the post list:
+
+![large image icon](/assets/img/music.ico)
+
+And it will have this image in the topbar of the window:
+
+![small image icon](/assets/img/music.png)
+
+# Image Types
+
+The `<FILENAME>.png` is used for the small icons in the topbar. The `<FILENAME>.ico` image filetype is used for the larger icon that shows up in the post list.