<commit_before>---
last_modified_at: 2017-10-28
title: "Jekyll Theme"
permalink: /githubpages/minimal-mistakes/
---
{% include toc icon="gears" title="Jekyll" %} いろいろカスタマイズしたり、Minimal Mistakesならではの使い方とか。

## 記事を書くときのテクニック的な?
### 画像をポップアップ
こういうやつ。
[![Header Image](/assets/images/github-header.png)](/assets/images/github-header.png)
[Magnific Popup](http://dimsemenov.com/plugins/magnific-popup/)というプラグインがすでに入っているので、うまく指定すれば可能。
```markdown
[![Header Image](/assets/images/github-header.png)](/assets/images/github-header.png)
```
プラグインがaタグにしか適用されないそうな。

## カスタマイズ
### シェアボタンを追加
 
_includes/social-share.html  
…の修正した部分を引用したいのだが、変数が含まれているために、ちょっといやぁんな表示になってしまう。  
`{...}`の部分は二重に囲ってありますので、他のボタンを参考に。
```html
<a href="http://getpocket.com/edit?url={ page.url | absolute_url }" class="btn btn--get-pocket" title="{ site.data.ui-text[site.locale].share_on_label | default: 'Share on' } Pocket"><i class="fa fa-fw fa-get-pocket" aria-hidden="true"></i><span> Pocket</span></a>
```
_sass/minimal-mistakes/_variables.scss
```scss
$pocket-color                 : #ef4056 !default;
```
_sass/minimal-mistakes/_buttons.css
```scss
.btn {
...
  /* button colors */
  $buttoncolors:
  (primary, $primary-color),<commit_msg>add brandcolors' link<commit_after>---
last_modified_at: 2017-10-29
title: "Jekyll Theme"
permalink: /githubpages/minimal-mistakes/
---
{% include toc icon="gears" title="Jekyll" %} いろいろカスタマイズしたり、Minimal Mistakesならではの使い方とか。

## 記事を書くときのテクニック的な?
### 画像をポップアップ
こういうやつ。
[![Header Image](/assets/images/github-header.png)](/assets/images/github-header.png)
[Magnific Popup](http://dimsemenov.com/plugins/magnific-popup/)というプラグインがすでに入っているので、うまく指定すれば可能。
```markdown
[![Header Image](/assets/images/github-header.png)](/assets/images/github-header.png)
```
プラグインがaタグにしか適用されないそうな。

## カスタマイズ
### シェアボタンを追加
[Pocket](https://getpocket.com)のシェアボタンを追加してみる。  
色は[BrandColors](https://brandcolors.net/)を参照。  

_includes/social-share.html  
…の修正した部分を引用したいのだが、変数が含まれているために、ちょっといやぁんな表示になってしまう。  
`{...}`の部分は二重に囲ってありますので、他のボタンを参考に。
```html
<a href="http://getpocket.com/edit?url={ page.url | absolute_url }" class="btn btn--get-pocket" title="{ site.data.ui-text[site.locale].share_on_label | default: 'Share on' } Pocket"><i class="fa fa-fw fa-get-pocket" aria-hidden="true"></i><span> Pocket</span></a>
```
_sass/minimal-mistakes/_variables.scss
```scss
$pocket-color                 : #ef4056 !default;
```
_sass/minimal-mistakes/_buttons.css
```scss
.btn {
...
  /* button colors */
  $buttoncolors:
  (primary, $primary-color),
{'fraction_non_alphanumeric': 0.18700475435816163, 'fraction_numerical': 0.009508716323296355, 'mean_word_length': 5.3924050632911396, 'pattern_counts': {'":': 0, '<': 15, '<?xml version=': 0, '>': 15, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7372549', 'n_tokens_mistral': 1261, 'n_tokens_neox': 1153, 'n_words': 125}