Merged initial_site into master
This commit is contained in:
4
.gitignore
vendored
Normal file
4
.gitignore
vendored
Normal file
@@ -0,0 +1,4 @@
|
||||
themes/*
|
||||
test.md
|
||||
public/*
|
||||
static/*
|
||||
197
config.toml
197
config.toml
@@ -1,3 +1,196 @@
|
||||
baseURL = "http://example.org/"
|
||||
# Tranquilpeak
|
||||
baseURL = "http://bdebylnet-cdn.s3-website-us-east-1.amazonaws.com"
|
||||
languageCode = "en-us"
|
||||
title = "My New Hugo Site"
|
||||
defaultContentLanguage = "en-us"
|
||||
title = "basdb"
|
||||
theme = "hugo-tranquilpeak-theme"
|
||||
# disqusShortname = "basdb-site"
|
||||
# googleAnalytics = "UA-123-45"
|
||||
paginate = 7
|
||||
canonifyurls = true
|
||||
|
||||
[permalinks]
|
||||
post = "/:year/:month/:slug/"
|
||||
|
||||
[taxonomies]
|
||||
tag = "tags"
|
||||
category = "categories"
|
||||
archive = "archives"
|
||||
|
||||
[author]
|
||||
name = "Bastian de Byl"
|
||||
bio = "This site serves both as my portfolio and collections of personal projects."
|
||||
job = "Software Engineer"
|
||||
location = "New England"
|
||||
# Your profile picture
|
||||
gravatarEmail = "bastiandebyl@gmail.com"
|
||||
# picture = "https://cdn1.iconfinder.com/data/icons/ninja-things-1/1772/ninja-simple-512.png"
|
||||
|
||||
# Menu Configuration
|
||||
[[menu.main]]
|
||||
weight = 1
|
||||
identifier = "home"
|
||||
name = "Home"
|
||||
pre = "<i class=\"sidebar-button-icon fa fa-lg fa-home\"></i>"
|
||||
url = "/"
|
||||
[[menu.main]]
|
||||
weight = 2
|
||||
identifier = "categories"
|
||||
name = "Categories"
|
||||
pre = "<i class=\"sidebar-button-icon fa fa-lg fa-bookmark\"></i>"
|
||||
url = "/categories"
|
||||
[[menu.main]]
|
||||
weight = 3
|
||||
identifier = "tags"
|
||||
name = "Tags"
|
||||
pre = "<i class=\"sidebar-button-icon fa fa-lg fa-tags\"></i>"
|
||||
url = "/tags"
|
||||
[[menu.main]]
|
||||
weight = 4
|
||||
identifier = "archives"
|
||||
name = "Archives"
|
||||
pre = "<i class=\"sidebar-button-icon fa fa-lg fa-archive\"></i>"
|
||||
url = "/archives"
|
||||
[[menu.main]]
|
||||
weight = 5
|
||||
identifier = "about"
|
||||
name = "About"
|
||||
pre = "<i class=\"sidebar-button-icon fa fa-lg fa-question\"></i>"
|
||||
url = "/#about"
|
||||
|
||||
[[menu.links]]
|
||||
weight = 1
|
||||
identifier = "github"
|
||||
name = "GitHub"
|
||||
pre = "<i class=\"sidebar-button-icon fa fa-lg fa-github\"></i>"
|
||||
url = "https://github.com/bdebyl"
|
||||
# [[menu.links]]
|
||||
# weight = 2
|
||||
# identifier = "stackoverflow"
|
||||
# name = "Stack Overflow"
|
||||
# pre = "<i class=\"sidebar-button-icon fa fa-lg fa-stack-overflow\"></i>"
|
||||
# url = "https://stackoverflow.com/users/636472/kakawait"
|
||||
|
||||
# [[menu.misc]]
|
||||
# weight = 1
|
||||
# identifier = "rss"
|
||||
# name = "RSS"
|
||||
# pre = "<i class=\"sidebar-button-icon fa fa-lg fa-rss\"></i>"
|
||||
# url = "/index.xml"
|
||||
|
||||
[params]
|
||||
# Customize date format use to render blog post date, categories and other
|
||||
# You must use date format used by Go Time package https://golang.org/pkg/time/
|
||||
# Months (not work with short month like "jan", "feb", etc) are translated if translation exists on i18n folders
|
||||
# Default format is: January 2, 2006
|
||||
dateFormat = "2 January 2006"
|
||||
|
||||
# Global keywords configuration. Following keywords will be add to every pages
|
||||
# keywords = ["development", "next-gen"]
|
||||
|
||||
# Syntax highlighter, possible choice between: "highlight.js" (recommanded) and "prism.js" (experimental)
|
||||
# You can comment it to disable syntax highlighting
|
||||
syntaxHighlighter = "highlight.js"
|
||||
|
||||
# Hide sidebar on all article page to let article take full width to improve reading, and enjoy wide images and cover images. (true: enable, false: disable)
|
||||
clearReading = true
|
||||
|
||||
# Define categories will create hierarchy between parents: `categories = ["foo", "bar"]` will consider "bar" a sub-category of "foo".
|
||||
# If false it will flat categories.
|
||||
hierarchicalCategories = true
|
||||
|
||||
description = "Hugo tranquilpeak theme demo"
|
||||
|
||||
# Customization
|
||||
# Define the behavior of the sidebar
|
||||
# 1: Display extra large sidebar on extra large screen, large sidebar on large screen,
|
||||
# medium sidebar on medium screen and header bar on small screen and
|
||||
# extra large sidebar is swiped on extra large screen and large sidebar on all lower screen (default)
|
||||
# 2: Display large sidebar on large screen, medium sidebar on medium screen and
|
||||
# header bar on small screen and large sidebar is swiped
|
||||
# 3: Display medium sidebar on large and medium screen and header bar on small screen and
|
||||
# medium sidebar is swiped
|
||||
# 4: Display header bar on all screens, extra large sidebar is swiped on extra large screen and
|
||||
# large sidebar is swiped on all lower screens
|
||||
# 5: Display header bar on all screens and large sidebar is swiped on large screen
|
||||
# 6: Display header bar on all screens and medium sidebar is swiped
|
||||
sidebarBehavior = 1
|
||||
|
||||
# Your blog cover picture. I STRONGLY recommend you to use a CDN to speed up loading of pages.
|
||||
# There is many free CDN like Cloudinary or you can also use indirectly
|
||||
# by using services like Google Photos.
|
||||
# Current image is on AWS S3 and delivered by AWS CloudFront.
|
||||
# Otherwise put your image in folder `static/_images/` (development) or in `source/assets/images/` if you can't or don't want to build the theme,
|
||||
# and use relative url : `your-image.png`
|
||||
coverImage = "https://s3.us-west-2.amazonaws.com/basdb-static-content/site-static/img/cover.png"
|
||||
|
||||
# Display an image gallery at the end of a post which have photos variables (false: disabled, true: enabled)
|
||||
imageGallery = true
|
||||
|
||||
# Display thumbnail image of each post on index pages (false: disabled, true: enabled)
|
||||
thumbnailImage = true
|
||||
# Display thumbnail image at the right of title in index pages (`right`, `left` or `bottom`)
|
||||
# Set this value to `right` if you have old posts to keep the old style on them
|
||||
# and define `thumbnailImagePosition` on a post to overwrite this setting
|
||||
thumbnailImagePosition = "bottom"
|
||||
# Automatically select the cover image or the first photo from the gallery of a post if there is no thumbnail image as the thumbnail image
|
||||
# Set this value to `true` if you have old posts that use the cover image or the first photo as the thumbnail image
|
||||
# and set `autoThumbnailImage` to `false` on a post to overwrite this setting
|
||||
autoThumbnailImage = true
|
||||
|
||||
# Your favicon path, default is "/favicon.png"
|
||||
# favicon = "/favicon.png"
|
||||
|
||||
# Header configuration
|
||||
# The link at the right of the header is customizable
|
||||
# You can add a link (as an icon) at the right of the header instead of the author's gravatar image or author's picture.
|
||||
# By default, author's gravatar or author's picture is displayed.
|
||||
# url: /#search
|
||||
# icon: search
|
||||
# class: st-search-show-outputs
|
||||
|
||||
# Custom CSS. Put here your custom CSS files. They are loaded after the theme CSS;
|
||||
# they have to be referred from static root. Example
|
||||
# [[params.customCSS]]
|
||||
# href = "css/mystyle.css"
|
||||
|
||||
# Custom JS. Put here your custom JS files. They are loaded after the theme JS;
|
||||
# they have to be referred from static root. Example
|
||||
# [[params.customJS]]
|
||||
# src = "js/myscript.js"
|
||||
|
||||
# Display `Next` on left side of the pagination, and `Prev` on right side one.
|
||||
# If you set this value to `true`, these positions swap.
|
||||
# swapPaginator = true
|
||||
|
||||
# Sharing options
|
||||
# Comment and uncomment to enable or disable sharing options
|
||||
# If you wanna add a sharing option, read user documentation :
|
||||
# Tranquilpeak configuration > Theme configuration > sharing-options
|
||||
# [[params.sharingOptions]]
|
||||
# name = "Facebook"
|
||||
# icon = "fa-facebook-official"
|
||||
# url = "https://www.facebook.com/sharer/sharer.php?u=%s"
|
||||
|
||||
# [[params.sharingOptions]]
|
||||
# name = "Twitter"
|
||||
# icon = "fa-twitter"
|
||||
# url = "https://twitter.com/intent/tweet?text=%s"
|
||||
|
||||
# [[params.sharingOptions]]
|
||||
# name = "Google+"
|
||||
# icon = "fa-google-plus"
|
||||
# url = "https://plus.google.com/share?url=%s"
|
||||
|
||||
# [params.header.rightLink]
|
||||
# class = ""
|
||||
# icon = ""
|
||||
# url = "/#about"
|
||||
|
||||
# Customize link of author avatar in sidebar
|
||||
# [params.sidebar.profile]
|
||||
# url = "/#about"
|
||||
|
||||
# Customize copyright value "© 2017 <CUSTOMIZATION>. All Rights Reserved"
|
||||
# [params.footer]
|
||||
# copyright = "<a href=\"https://github.com/kakawait\">kakawait</a>"
|
||||
|
||||
69
content/post/humble-beginnings.md
Normal file
69
content/post/humble-beginnings.md
Normal file
@@ -0,0 +1,69 @@
|
||||
---
|
||||
title: "Humble Beginnings"
|
||||
date: 2017-12-21T01:42:57-05:00
|
||||
categories: ["Blog"]
|
||||
tags: ["code"]
|
||||
thumbnailImagePosition: top
|
||||
thumbnailImage: "/img/humble-beginnings/main.png"
|
||||
---
|
||||
After much deliberation I've finally decided to go with the [**Tranquilpeak**](https://github.com/kakawait/hugo-tranquilpeak-theme) theme. However, before this I ran into a slew of issues with the badly ported [**Tracks**](https://github.com/ageekymonk/hugo-tracks-theme) theme from WordPress
|
||||
<!--more-->
|
||||
|
||||
If you want a general overview, feel free to check out the relevant [commit](https://github.com/bdebyl/hugo-tracks-theme/commit/86ca4963c4d0a67ddb1560197c91617e7d3e3754) on my GitHub fork.
|
||||
|
||||
<!-- toc -->
|
||||
|
||||
# Rough Start
|
||||
The first thing I noticed was that the navigation bar seemed a bit off.
|
||||
|
||||
|
||||
{{< image classes="center" src="/img/humble-beginnings/header-problem.png" title="Navbar Issue" >}}
|
||||
|
||||
The links show as numbers and attempt to link to `/0`, `/1`, and `/2` which lead to 404s. This didn't seem like the intended functionality. It turned out to be a problem with the usage of the following variable: `.Site.Sections`
|
||||
|
||||
As I'm still learning the ins and outs of Hugo, I'm not familiar with what a section *should* be, but I did know the `sidebar.html` layout file didn't seem to do anything nor exist anywhere on the site (even on mobile screen sizes). I did attempt to find out how sections work by experiment with directories along with `index.md` / `_index.md` files within the `content/` folder. Though, I was unsuccessful in getting the structure I wanted to appear, appear, along with not really understanding why `0` and `0` pages even existed.
|
||||
|
||||
# The Fix
|
||||
The issue lied in the following chunk of code for `layouts/partials/headers.html`:
|
||||
```html
|
||||
<div class="col-md-6">
|
||||
<div class="menu">
|
||||
<a href="/">Home /</a>
|
||||
{{ range $name, $taxonomy := .Site.Sections }}
|
||||
{{ if ne $name "post" }}
|
||||
<a href="/{{ $name | urlize }}">{{ $name }} / </a>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
```
|
||||
|
||||
For some reason it seemed that `.Site.Sections` would populate as `0` and `1`. Now, this may be an error of my part from lack of understanding of how Hugo works, but I have yet to make sense of the documentation as far as sections go.
|
||||
|
||||
|
||||
In any case, I borrowed the code found in `layouts/partials/sidebar.html` to include the nav links I desired:
|
||||
```html
|
||||
<div class="col-md-6">
|
||||
<div class="menu">
|
||||
{{ $url := .Site.BaseURL }}
|
||||
{{ range .Site.Params.navlinks }}
|
||||
<a href="{{ $url }}{{ .url }}">{{ .name }} /</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
```
|
||||
|
||||
----
|
||||
|
||||
# But Wait, There's More!
|
||||
After getting more comfortable with how themes are designed for Hugo, I found a slew of other problems with the ported **Tracks** theme:
|
||||
|
||||
* Improper HTML for `/about/` and `/contact/` resulting in a sloppy looking, inconsistent site.
|
||||
* Redundant `portfolio.html`: duplicated HTML code already used in `category.html`
|
||||
* Completely unused:
|
||||
* `layouts/_default/taxonomy.html`
|
||||
* `layouts/_default/list.html`
|
||||
* `<div class="col-md-10 category-description">` in `layouts/partials/category.html`
|
||||
* Missing:
|
||||
* Pagination
|
||||
* Syntax Highlighting
|
||||
|
||||
At the this point in time I decided it was no longer worth my time in trying to re-work something I wasn't very familiar with, as my main objective was simply to get a portfolio website with blog functionality up and running.
|
||||
Submodule themes/tranquilpeak deleted from 026df931e5
Reference in New Issue
Block a user