blog

jekyll ではじめる Static Web Site シリーズjekyllでプラグインを使った動的ページ生成

    • Ryuichi Nonaka
    この記事は書かれてから1年以上経過しており、内容が古い場合があります。

    動的にページを作るには

    動的なページを作るにはJekyllのPage ClassとGenerator Classをもとにインスタンスを作成します。大まかに理解するにはこちらの記事jekyllプラグインの作り方 ジェネレータ編が参考になります。

    今回は_layouts/default.htmlをベースのLayoutファイルに指定して、プラグインから新しいファイルを作ってみます。

    プラグイン

    以下のソースを_pluginsフォルダに適当な名前で保存します。あとはjekyll build等のコマンドを実行するだけです。

    module Jekyll
    
      class TestPage < Page
        def initialize(site, base, dir)
          @site = site
          @base = base
          @dir = dir
          @name = 'test2.html'
    
          self.process(@name)
    
          # layoutファイルを指定する
          self.read_yaml(File.join(base, '_layouts'), 'default.html')
    
          # タイトル
          self.data['title'] = "test"
        end
      end
    
      class TestPageGenerator < Generator
        safe true
    
        def generate(site)
          # 新しいページを作る.new(site, site.source, dir)
          site.pages << TestPage.new(site, site.source, '/')
        end
      end
    
    end
    

    簡単に説明すると最初のclass TestPage < PageでPage ClassのインスタンスTestPageを作り、レイアウトの指定やタイトルなど、生成するページの情報を定義します。次にclass TestPageGenerator < GeneratorでGenerator Classのインスタンスを作ります。Jekyllが実行されるとこのインスタンスのgenerateメソッドが呼ばれPageインスタンスのTestPage.new(site, site.source, '/')を実行します。

    実行してみて書き出し先のディレクトリにexample.htmlが作られていれば成功です。これでプラグインからページを作ることができました。これだけではあまり意味のないものですが、次回はjekyllのData Filesを使って複数のページを動的に生成してみたいと思います。

    シリーズ

    1. Jekyll × Gruntでブログを作ってみた:環境構築編
    2. Jekyll × Gruntでブログを作ってみた:NodeモジュールとGruntタスク
    3. Jekyll × Gruntでブログを作ってみた:まずはJekyllだけ動かしてみる
    4. Jekyllの関連記事表示とGSLを使った処理時間の短縮
    5. jekyllでFontAwesomeアイコンを表示するLiquid Tagを作った
    6. jekyllのタグを投稿数で並び替えて表示する
    7. jekyllでタグ・カテゴリ・マンスリーアーカイブページを作る
    8. jekyllでプラグインを使った動的ページ生成

    コメント・フィードバック