Apply GitHub pages theme on existing html - github

I have an existing GitHub project that already had a few html pages. Now I made a GitHub pages site of the project using the docs folder in the master branch but when I try to apply an existing jekyll theme to the pages, the theme is not applied. The docs folder contains a file named index.html.
Do I need to add some kind of import statement to my html pages or do I really need to convert them to markdown syntax? Maybe I am doing something wrong here?
The GitHub project is found here
The GitHub pages site for my project is here

From a plain HTML website to a Jekyll website
If you want a plain html website to use layouts, you start your html pages with:
---
layout: page
---
You can freely rename your files from .html to .md, as it is allright for .md pages to contain HTML. Next you simply create your page.html layout file in the _layouts directory.
Using a Github pages theme
If you want to use a Github theme, you can download the theme and put the files in the root. You can achieve the same by just adding this sinlge line to your _config.yml:
theme: jekyll-theme-hacker
The theme name here is 'jekyll-theme-hacker'. Optionally, if you'd like to preview your site on your computer, add the following to your site's Gemfile:
gem "github-pages", group: :jekyll_plugins
Source: https://github.com/pages-themes/hacker#usage

If you have a _layouts directory containing files with the same name as the new theme layout files, they will have precedence over the theme files.
This is the way Jekyll makes it possible to customize themes.
In this case remove the _layouts directory and Github pages will use the desired theme.

Related

Is the `config.yml` file what I need to customize the organization templates for the new-issue page on GitHub?

This pylance GH link renders the new-issue page as
whereas my own new-issue page is rendered as
which, I guess, is using some kind of blank-issues
per GH doc, I need to add a config.yml file to the .github/ISSUE_TEMPLATE folder.
However, there isn's a config.yml file in pylance GH .github/ISSUE_TEMPLATE folder.
Is the config.yml file what I need for the new-issue page pointed out by the red arrow? or I misunderstood the GH doc?
The config.yml is used to generate links outside of Github. For example to invite users to use stackoverflow to ask question instead of the github issues.
To add template choices (as you have in the red square), you will have to add template files in the form of .md files in the .github/ISSUE_TEMPLATE folder. You can see example of those template files in the pylance GH .github/ISSUE_TEMPLATE folder

What files and folders to include in .gitignore in Shopify Themes Development

I'm new to Shopify Themes Development. I downloaded the free Shopify theme template using Themekit. I want to push the theme to Github but in VS Code it's showing that there are 156 files to be pushed on Github.
Folder names are:
assets, config, layout, locals, sections, snippets, templates
File name:
config.yml
That's obvious, this is not a way.
Can someone please tell me what files and folders i need to write in .gitignore So that those won't be pushed on Github.
Thanks in Advance!
Shopify has an example .gitignore in their starter theme. I'm not sure why they don't include settings_data.json but I would definitely include it. Here's what I'd use:
# Shopify #
###################
config.yml
config/settings_data.json
# OS generated files #
######################
.DS_Store
.DS_Store?
._*
.Spotlight-V100
.Trashes
ehthumbs.db
Thumbs.db
ThemeKit will only care about file inside assets, config, layout, locals, sections, snippets, templates folders, anything else will be ignored thus, not uploaded to shopify.
It is a good practice tho, ignore: config/settings_data.json you only want that to be updated in the theme customiser.

Hugo website on GitHub not showing themes

My Hugo website is configured to publish in a folder called docs, which is the source (master/docs) for the website on my GitHub repo; however, the website itself won't show any css/js.
I've tried manually changing the reference for css in the index.html file so that the path is khobbs3.github.io/docs/main.....css but that doesn't seem to help either.
The repo: https://github.com/KHobbs3/ktechnology
The website:
https://github.com/KHobbs3/ktechnology
RESOLVED: set up new repos following https://gohugo.io/hosting-and-deployment/hosting-on-github/ tutorial.
Published site: http://khobbs3.github.io
It looks like there are no CSS /js files on the static folder. Hugo uses the static folder to render the js and CSS files and also for images.

CONTRIBUTING.md does not render as a web page on github pages

i'm in the process of moving my contributing.md file from the project root to the docs/ directory so it can be with the rest of the documentation. Other markdown files in docs render properly when viewed in github pages. For example, the page
https://jtablesaw.github.io/tablesaw/userguide/toc
renders the page toc.md as expected.
however,
https://jtablesaw.github.io/tablesaw/contributing
returns a 404, while simply adding the .md extension
https://jtablesaw.github.io/tablesaw/contributing.md
returns the page as markdown source
The github project is https://github.com/jtablesaw/tablesaw.
and the contributing.md file is in the docs/ folder.
Zachary's answer is correct but there is a way to modify the jekyll's configuration to include the specific page.
Here is an example: https://masterex.github.io/test-docs/contributing
You have to modify _config.yml as follows:
theme: jekyll-theme-minimal
include: contributing.md
Here is github's relevant help page.
After forking your repo, playing around with it for a bit, and banging my head against the wall because I didn't understand why it wasn't working, I realized something:
Github Pages doesn't support building Jekyll pages from files that have names that Github recognizes for other purposes. These file names include (in addition to their lowercase versions):
CONTRIBUTING.md
ISSUE_TEMPLATE.md
PULL_REQUEST_TEMPLATE.md
ISSUE_AND_PULL_REQUEST_TEMPLATE.md
CODEOWNERS.md
On the other hand, despite that README.md is also a Github keyword file, it looks like Github Pages supports using files with the README.md name because it purposely will interpret them the same way as an index.md or index.html file. See this link from the Github blog for more information.
To answer your specific question on how you could get the file to show at the /tablesaw/contributing path, you could rename it and move it to the /docs/contributing/index.md or /docs/contributing/README.md path.
U̶n̶f̶o̶r̶t̶u̶n̶a̶t̶e̶l̶y̶,̶ ̶a̶t̶ ̶l̶e̶a̶s̶t̶ ̶i̶n̶ ̶t̶h̶e̶ ̶p̶r̶e̶s̶e̶n̶t̶,̶ ̶t̶h̶e̶r̶e̶'̶s̶ ̶c̶u̶r̶r̶e̶n̶t̶l̶y̶ ̶n̶o̶ ̶w̶a̶y̶ ̶t̶o̶ ̶k̶e̶e̶p̶ ̶i̶t̶ ̶w̶i̶t̶h̶ ̶t̶h̶e̶ ̶s̶a̶m̶e̶ ̶f̶i̶l̶e̶ ̶n̶a̶m̶e̶ ̶a̶n̶d̶ ̶h̶a̶v̶e̶ ̶G̶i̶t̶h̶u̶b̶ ̶P̶a̶g̶e̶s̶ ̶b̶u̶i̶l̶d̶ ̶a̶ ̶p̶a̶g̶e̶ ̶f̶o̶r̶ ̶i̶t̶.̶
Edit: #Master_ex notes correctly that you can use the include configuration option in the _config.yml file to include files that would normally be excluded by Github:
theme: jekyll-theme-minimal
include: contributing.md
In reference to the original example, this will allow Github Pages to build a page successfully at the /docs/contributing path.

Keeping GH homepage in sync with README.md

While creating GitHub Pages for my project I was suggested to import existing README.md as the project's homepage. Later, I merged gh-pages with master and ended up with both index.html and README.md.
The "problem" is that the updates to README.md won't affect index.html. Is there any simple way to keep them in sync? Preferably with zero Jekyll knowledge...
Here's what I came up with, in case someone is interested.
Typically I write HTML using Jade preprocessor, and luckily it does support GitHub Flavored Markdown which is the language README.md is written in. So my steps where as following:
Translate index.html generated by GH Pages to Jade. I used online html2jade tool;
Save the output to index.jade;
Locate section block in the resulting markup in index.jade and replace its entire content with:
section
include:md README.md
Run jade index.jade which produces new, automatically generated index.html;
Commit both files to gh-pages.
See example in this commit on GitHub.