はじめに

前回から引き続きfacebookのOGP設定についてです。前回、大方設定したOGP情報が反映されるところまでいきましたが、、記事ごとのOGPデータの設定がうまくいかない。という所でつまずきました。

OGP設定

今回はなんとかして記事ごとにOGPの取得をしてもらえるように設定したい！

Middleman-OGPを使う

突然ですが、、実はこのProudBlog、middlemanのブログ機能を使って作られています。

そのため、色々と調べてみた結果、今回はMiddleman-OGPというプラグインを利用しました。プラグインを入れて、の作業なったので、社長に設定をしてもらいました！なので、すみません、、詳細な設定内容は省きます＞＜ (ここが一番気になりますよね。汗)

内容についてはこの辺りのサイトを参考にしています。 http://whiskers.nukos.kitchen/2015/04/10/middleman-ogp.html

ただ上記プラグイン導入の他にも色々と手を加えて、加えて、、、設定をしてもらい、ようやく理想通りの形ができあがりましたー！！

肝心な手順部分の内容が薄くなってしまいました… せっかくなのでMiddlemanと静的サイトについて備忘録としてまとめておきます。

Middlemanとは

OGP設定

Middlemanとはruby製の静的サイトジェネレーター。静的なwebサイトを構築する際に便利なコマンドラインツール。

日本語のドキュメントもあります。 https://middlemanapp.com/jp/

日本語ドキュメントがあるのはありがたいですね！

この他にmiddlemanのメリットが書かれたサイトを見つけました。 http://www.mdesign-works.com/blog/web/static-site-genareter/

・開発用サーバがある・共通のレイアウト設定やファイルをパーツ化できる・変数が使える

※上記はサイトから抜粋したものです

静的サイトジェネレーター（Static Site Generator）とは

記事を書いたテキストファイルを元に、HTMLを生成してくれる、静的サイトを効率的に制作するためのツール。

middlemanの他にも Hugo、jekllyといったものが有名どころのようです。

静的サイトは、指定したパスに設置してあるhtmlファイルを表示させ、何度読み込んでも同じ内容を表示させます。まさに動きのない、静的なサイト。

HTMLファイルを表示させるだけなので、表示速度も高速。尚且つサーバ負荷も最小限で済みます。構成がシンプルで、更新頻度の少ないサイトには向いています。

サイトを簡単に作る上で多く利用されているのが、CMS(content management system)。なかでもwordpressは代表的なCMS。 CMSは静的サイトと異なり、DBサーバも必要になるので、前述したようにシンプルな構成のサイトは静的サイトで構築するほうが色々とメリットがあるかもしれません。

おわりに

実際に自分がmiddlemanを一から設定する作業をやったわけではないのですが、このブログを更新する上で一つ一つの作業はいたってシンプル。一定の規則に従って記事を書いてアップするだけ！ただ、中の構成がどうなっているのかわからないので、ブログのトップ画像を変えたい、今回のようにfacebookのogp設定をしたいとった時は分かる人に聞いたり、やってもらったりしないといけないので、社内向け、個人利用が主になってしまうのかな。お客さん向けに提供するには難しいかもしれません。

とは言え、サーバレスも注目されている中でmiddlemanのようなツールを使ったサイトはこれからどんどん増えていくかも！