Akira's Tech Notes

Java/JVM | GNU/Linux | Emacs/Lisp | 知的好奇心駆動

header-icon
ネイティブでない日本語で思い付くことや気になることをダラダラ書く、体裁とかは気にしない。読みづらいと感じた時に随時更新する。

[メモ]Otcopressにプラグインを導入する-その１

1 TagCloudとカテゴリリスト

このから ダウンロードする 

[akira@jizai tmp]$ git clone https://github.com/tokkonopapa/octopress-tagcloud.git
Cloning into 'octopress-tagcloud'...
remote: Reusing existing pack: 65, done.
remote: Total 65 (delta 0), reused 0 (delta 0)
Unpacking objects: 100% (65/65), done.
Checking connectivity... done.
[akira@jizai tmp]$

octopress-tagcloud/plugin/ 配下のファイルを octopress/plugins へコピーする。 octopress-tagcloud/source/ 配下のファイルを octopress/source へコピーする。 

[akira@jizai tmp]$ cd octopress-tagcloud/
[akira@jizai octopress-tagcloud]$ cp -rfv plugins/* ~/.emacs.d/blogs/octopress/plugins
`plugins/tag_cloud.rb' -> `/home/akira/.emacs.d/blogs/octopress/plugins/tag_cloud.rb'
[akira@jizai octopress-tagcloud]$ cp -rfv source/* ~/.emacs.d/blogs/octopress/source
`source/_includes/custom/asides/tag_cloud.html' -> `/home/akira/.emacs.d/blogs/octopress/source/_includes/custom/asides/tag_cloud.html'
`source/_includes/custom/asides/category_list.html' -> `/home/akira/.emacs.d/blogs/octopress/source/_includes/custom/asides/category_list.html'
[akira@jizai octopress-tagcloud]$

octopress/_config.yml の default_asides 項目に custom/asides/tag_cloud.html と custom/asides/category_list.html を追加する。 

default_asides: [...., custom/asides/tag_cloud.html, custom/asides/category_list.html, ..... ]

このままだとTagCloudカテゴリリストが同じものになったしまうので、ここ と ここ の記事を 参考してカテゴライズ機能を流用してTagCloud機能を実装する。以下TagCloud機能を実現する ためには変更及び追加したファイル一覧です。 

[akira@jizai octopress]$ git status
Changes not staged for commit:
  (use "git add <file>..." to update what will be committed)
  (use "git checkout -- <file>..." to discard changes in working directory)
  (commit or discard the untracked or modified content in submodules)

	modified:   _config.yml
	modified:   sass/partials/_archive.scss
	modified:   sass/partials/_blog.scss
	modified:   source/_includes/archive_post.html
	modified:   source/_includes/post/categories.html
	modified:   source/_layouts/page.html
	modified:   source/_layouts/post.html

Untracked files:
  (use "git add <file>..." to include in what will be committed)

	plugins/tag_cloud.old.rb
	plugins/tag_cloud.rb
	plugins/tag_generator.rb
	source/_includes/custom/asides/related.html
	source/_includes/custom/asides/tag_cloud.html
	source/_includes/custom/tag_feed.xml
	source/_includes/post/tags.html
	source/_layouts/tag_index.html

記事書く際にヘッダの属性リストに tags と category を記述するすればOKです。 

---
title: "[メモ]Otcopressにプラグインを導入する-その１"
date: 2014-07-01
layout: post
category: misc
tags: Octopress blog
published: true
comments: true
---

2 QRコード

Google Chart APIで記事URLのQRコードイメージを自動的に生成する。

octopress/source/_includes/custom/asides/qrcode.html 

<section>
  <!-- create at 2017/07/01 
       Google Chart Tools: Infographics
       https://developers.google.com/chart/infographics/docs/qr_codes?csw=1
  -->

  <div style="position: relative; text-align: center">

    <!-- Google Chart API でQRコード取得 -->
    <img src="http://chart.apis.google.com/chart?chs=180x180&amp;cht=qr&amp;choe=UTF-8&amp;chl=http://luozengbin.github.io/blog/2014-07-01-%5B%E3%83%A1%E3%83%A2%5Dotcopress%E3%81%AB%E3%83%97%E3%83%A9%E3%82%B0%E3%82%A4%E3%83%B3%E3%82%92%E5%B0%8E%E5%85%A5%E3%81%99%E3%82%8B-%E3%81%9D%E3%81%AE%EF%BC%91.html" alt="post-qrcode" height="180" width="180" />

    <!-- サイトのfaviconを重ねて表示する -->
    <div style="position: absolute; top: 75px; width: 100%; margin: 0 auto; text-align: center">
      <img style="border: 0.2em solid #FFF;" src="/favicon.png" alt="post-qrcode" height="30" width="30" />
    </div>
  </div>

</section>

octopress/_config.yml の default_asides 項目に custom/asides/qrcode.html を追加 する。 

default_asides: [...., custom/asides/qrcode.html, ..... ]

3 月間アーカイブ

作成中…

Comments