この記事はデジクリ アドベントカレンダー 2020 1日目の記事です。

はじめに

こんにちは、15期のsaruです。
PG班で現在は主にデジコア（当ブログおよび、サークル内部で使用するグループウェアを統合するウェブアプリ）の開発をしています。

みなさま、いかがお過ごしでしょうか？
自分はそこまで忙しくならないようにしているつもりなのですが、某麻雀ゲームやアニメにハマってしまい、いつも通り課題に追われてしまっています。

さて、「デジコア開発日誌」というタイトルにしたからには、なんらかの開発を行う必要があります（現在12月1日）

いろいろ実装したい機能はあるのですが、これから多くの人がブログの記事を書いていく中で、リンクをSlackに貼ったときに内容が展開されないのは寂しい、と思っていたので、今回はその機能を実装していこうと思います。

実装

どうしたら表示されるのかGoogle先生に聞いていたら、Slackの仕様を解説しているサイトにたどり付きました（英語でしたが）

このサイトによると、どうやらmetaタグを書いてあげる必要があるらしいです。

さっそくこれに従って、ブログのheadタグ内に以下のコードを追加します。

<meta property="og:title" content="{{article.title}} | デジクリ" />
<meta property="og:description" content="{{ article.content|markdown|striptags|truncatechars:100 }}" />
<meta property="og:image" content="{% static "home/img/favicon.ico" %}" />

簡単にやっていることの説明をすると、
1行目でタイトルの設定、2行目で中身の文章のプレビュー、3行目でサムネイルイメージの登録を行っています。

ちなみに、2行目ではLinuxのパイプのようなやつ→|で次々とコマンドが繋がっているように見えますが、
これは、Djangoのフィルタと呼ばれるもので、Djangoが機能として用意してくれてるとても便利なやつなんです。

具体的には、

• markdownでマークダウン形式の文字列をHTMLタグに変換
• striptagsでHTMLタグを削除
• truncatechars:100で文字列から最初の100文字を取得し、最後に「…」を付加するという処理

を行っています。

3行目はイメージなどを登録する部分ですが、とりあえずでデジクリのアイコンとしてみました。
（実用的には、記事内の画像からサムネイルを自動的に決めるようにするのが親切なのかなと思います）

pushして実際にSlackにリンクを張ってみて、無事urlの中身が展開されることを確認できました。

おわりに

ブログといえばよくある、評価機能、コメント機能、閲覧数表示なども（自分の時間とやる気があれば）今後実装して行きたいと思っています。

今回は時間の関係で備忘録っぽい短い記事となりましたが、ここまで読んでくださりありがとうございました。
明日からのみなさん（とくに新入生の方々）の記事を楽しみにしております。