Double O というサービスがWeb ComponentsやPWAなどアグレッシブにWeb技術を取り入れていて応援したい気持ちなので、まずはユーザーとして使っていこうと思います。
「よくある質問」がDouble Oの公式アカウントとして運用されてるの面白いですね https://ooapp.co/DoubleO
で、Ask Meボタンをどこに設置するのがよいかなーと考えた結果、ブログで記事を読んだあとに目に留まるところがいいんじゃないかと思い、はてなブログ上に設置してみました。 まさにこの記事の -> あたりに Ask Meのボタンが出ていると思います。
設置手順
Double Oのタグを入手する
Double Oのアカウントを作成し、ボタンのスクリプトを入手します。
スクリプトはscriptタグと、oo-buttonタグの2つからなり、scriptタグで読み込まれるJavaScriptによりoo-buttonタグがWeb Componentsとして認識されるようになります。
headタグ内でoo-buttonタグを登録するためのスクリプトを読み込む
はてなブログの設定画面から詳細設定を開き、下の方にある head要素にタグを追加 のところにscriptタグだけを追加します。
これで、このはてなブログ内ではどこでもoo-buttonタグが使えるようになりました。
サイドバーにHTMLモジュールを配置
デザイン設定からサイドバーにHTMLモジュールを追加し、oo-buttonタグを配置するだけです。
質問だけでなく、マイクロナレッジの共有にも使えるサービスになっていくようなので、ブログにまとめるほどでもないようなこともぼちぼち書いていきつつ、マイクロナレッジのまとめをブログでサマライズするようなやりかたができるといいのかなーと思ってるところです。
ちなみに4/23に登壇する Web Components Cafe #2でもオンラインの質問場所としてDouble Oが使われますので、ぜひこちらもよろしくお願いします！
すごいステマ記事みたいになってしまった。
