Topic

Hexo

A collection of 5 issues

HEXOでコードの書き方いろいろ実験

Hexoはジェネレート時にhighlight.jsを適用してくれます。 クライアントサイドでのレンダーではないので、軽いのが嬉しいです。 今回はいろいろMarkdownの書き方を実験してみました。 HTMLコードの掲載 ``` html <html> <head> <title>オレのブログ</title> </head> <body> <h1>コンテンツをここに</h1> <P>ローレンイプサム的ななにか </body> </html> ``` ↓ <html> <head> <
1 min read

HexoでRSSフィードを作成

HexoのヘッダにRSSフィードのリンクがありますが、デフォルトでは作成されていなくて404エラーになります。 hexo-generator-feedというプラグインをインストールして、RSS作成を自動化しましょう。 インストール yarnでプラグインを1個追加するだけ。 # Hexoプロジェクトのルートディレクトリで yarn add hexo-generator-feed _config.ymlの設定 続いて_config.ymlに出力設定を追加します。 # hexo-generator-feed (https://github.com/hexojs/hexo-generator-feed) feed: type: atom path: atom.xml limit: 20 出力確認 hexoコマンドからサイトをジェネレートします。 hexo g ちゃんと出力されたかな? headコマンドでファイルの頭を表示してみましょう。 head public/atom.xml こ
1 min read

Hexoでサイトマップを作成

SEO 対策のために Sitemap を用意するのがいいらしいのですが、人力で作るのはイヤですね。 こういうことは自動化してしまいましょう。 hexo-generator-sitemapというプラグインがあるので、それをそのまま使います。 インストール yarnでプラグインを 1 個追加するだけ。 # Hexoプロジェクトのルートディレクトリで yarn add hexo-generator-sitemap _config.yml の設定 続いて_config.ymlに出力設定を追加します。 # hexo-generator-sitemap (https://github.com/hexojs/hexo-generator-sitemap) sitemap: path: sitemap.xml 出力確認 hexoコマンドからサイトをジェネレートします。 hexo g ちゃんと出力されたかな? headコマンドでファイルの頭を表示してみましょう。 head public/sitemap.xml
1 min read

Hexo:記事に画像を貼り付ける

記事に画像を貼り付ける 公式やネット上でもいろいろやり方が紹介されていますが、post_asset_folder: trueと{% asset_img slug [title] %}のやり方がなんだかしっくり来ませんでした。 md 記法で完結したい。 公式のやり方 * 設定変更: post_asset_folder: trueする。 * hexo newのタイミングでディレクトリが作成される * この中にまとめて記事と画像を突っ込む * 画像の参照は独自記法で{% asset_img slug [title] %} * md 記法だとpermalinkに依存するので、絶対パスで書かなくてはいけない * 記事に紐づくディレクトリになるので、他の記事から同じ画像を参照しにくい こんな構成で考えてみた 公式の方法で面倒なところを回避したい。 * hexo newのタイミングでディレクトリ作成されるのがイヤ * permalinkの設定に依存したくない * 画像はある程度フォルダにまとめて突っ込みたい * 他の記事からも参照したい というこ
2 min read

Hexoすごい

Hexo すごいよ ブログ書こうかな〜めんどくさいな〜と思ってたら Hexo っていう静的サイトジェネレータがあるらしいことを知りました。 yarn(or npm)と MarkDown 記法に慣れてるなら 1 分で環境構築完了。 最初からhighlight.jsも適用済みなのでテック系ブログにもいいですね。 highlight.jsはサイトをジェネるときに適用済みなので、JS ライブラリへのリクエストがどっかり載ることもありません。 インストール hexo はコマンドラインツールです。 https://hexo.io/から入手できます。 npmでもいいけど今回はyarnを使ってインストール。 yarn global add hexo これだけ。 HELLOWORLD! hexo コマンドがインストールできたらプロジェクトを作成。 #作業ディレクトリの作成 hexo init プロジェクト名 #サーバ起動 hexo server これだけで http://localhost:4000/にデプロイされます。 H
1 min read

Subscribe to 猫好きが猫以外のことも書く

Don’t miss out on the latest issues. Sign up now to get access to the library of members-only issues.
jamie@example.com
Subscribe