T.I.D.

Git や GitHub と戯れる、オレオレ的おとなの遊び場

SEOに効くOctopressの隠し機能

Octopress のコードリーディングをしていて見つけた隠し機能について。同じネタが既に Octopress Hidden Features に挙がっていた。

<meta> タグの追加機能

source/_includes/head.html の10行目付近から。

head.html 
1
2
3

  {% capture description %}{% if page.description %}{{ page.description }}{% else %}{{ content | raw_content }}{% endif %}{% endcapture %}
  <meta name="description" content="{{ description | strip_html | condense_spaces | truncate:150 }}">
  {% if page.keywords %}<meta name="keywords" content="{{ page.keywords }}">{% endif %}

記事の YAML ブロック に description か、記事から HTML を除いた先頭150字が <meta name="description" content="..."> に挿入される。 同様に keywords で <meta name="keywords" content="..."> が挿入される。

記事の YAML ブロック・サンプル
1
2
3
4
5
6
7
8
9

---
layout: post
title: "SEOに効くOctopressの隠し機能"
date: 2012-01-02 09:31
comments: true
categories: [octopress]
description: Octopress のコードリーディングをしていて見つけた隠し機能について。
keywords: Octopress, SEO
---

ちなみにトップページの場合も、先頭記事が { content } として参照されるのが、何だかアレな感じ。

plugins/octopress_filters.rb の改修

記事の先頭150字以内に改行が含まれていると、content="..." が改行されちゃうのもアレ（HTML 的には OK だから、気にすることないけどネ）。

そこで、plugins/octopress_filters.rb（ソースコードの全体）の104行目付近 condense_spaces に改行を削除するコードを追加。

plugins/octopress_filters.rb の改修
1
2
3
4
5

  # Condenses multiple spaces and tabs into a single space
  def condense_spaces(input)
    input.gsub(/\s{2,}/, ' ')
    input.gsub(/\n/, '')
  end

Rakefile の改修

Rakefile 102行目付近の new_post エントリーで、上記を YAML ブロックに挿入する。

Rakefile 
1
2
3
4
5
6
7
8
9
10
11
12

  puts "Creating new post: #{filename}"
  open(filename, 'w') do |post|
    post.puts "---"
    post.puts "layout: post"
    post.puts "title: \"#{title.gsub(/&/,'&amp;')}\""
    post.puts "date: #{Time.now.strftime('%Y-%m-%d %H:%M')}"
    post.puts "comments: true"
    post.puts "categories: "
    post.puts "description: "
    post.puts "keywords: "
    post.puts "---"
  end

サイドバーへの About Me 追加

既にテンプレートが source/_includes/custom/asides/about.html にある。色々なサイドバー・パーツを追加するのにも使える。後は _config.yml 49行目付近に指定するだけ。

_config.yml のサイドバーに about.html を指定する
1

default_asides: [custom/asides/about.html, asides/recent_posts.html, asides/github.html, asides/twitter.html, asides/googleplus.html]

Comments