More than 5 years have passed since last update.

github.ioのWebページにテーマを反映させてみた

Last updated at 2019-08-18Posted at 2018-11-21

github.io

GitHubのレポジトリでWebページを公開したときのURL。
javascriptが動くhtmlを公開できる。

日記

GitHubのレポジトリにdocs/index.htmを作る。
SettingsのGitHub PagesでSourceのmaster branch/docs folderを選んでSave。
Theme Chooserでテーマを選べるのかと思って元々選ばれているCayman themeを選んでみた。
github.io でWebページを公開できたが、テーマが反映されてない。

テーマが反映されてない！？


---
layout: default
---

HTMLファイルの <body> だけ残して他を削除し、この３行をHTMLファイルの先頭に追加したらテーマが反映された。¹

こんなページになった

docs/_config.yml

theme: jekyll-theme-cayman
lang: ja-JP
title: タイトルを変更してみた

docs/index.htm

---
layout: default
title: タイトルは２つある
description: metaタグで見れる
---
<body>
  <h1>文字の大きさ h1</h1>
  <h2>文字の大きさ h2</h2>
  <h3>文字の大きさ h3</h3>
<pre>
&lt;pre&gt; のテスト
</pre>
<p>
&lt;p&gt; のテスト
</p>

{% highlight javascript %}
const fun=function(){
	console.log("test");
};
{% endhighlight %}

テーマの設定をもっと変えたらブログのようになるようだ。

Markdownで書くこともできた

index2.mdを作ったらindex2.htmlに変換された。

docs/index2.md

---
layout: default
title: トップページ２
---

# ここは h1 に変換される

* ここは ul li に変換される

出典はGitHub Community Forum の Page not showing the theme。 ↩

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up