初めての試み（ブログをかくこと）にあたり、発見と改善を繰り返すべきことは自明。そう、稽古のように。
というわけで、ブログにいいねボタンを追加してみましたので、躓きポイントをまとめました。
なお、GASの知識は前提とします。先人たちの有用な解説がたくさんありますので、もしご存じなければWebで検索してみてください。
Bloggerには、いいねボタンは標準搭載されておらず、対応しているテンプレートもないようです。困りましたわ。
調べていく中で、matsusan様のこちらの記事にて洗練されたソースコードが掲載されていることを発見いたしました。以下、当該記事を参考に、いいねボタンを追加しようと試みて苦戦した記録を残します。
コードを見てみると、どうやら通常のHTMLとは違い、Blogger独自の文法があるようです。Wordpressなど、ほかのHTMLで書けるブログツールと同じ様子。
挙動の見当がつかないので、スプシ・GASの準備をしたうえで、手始めに、空っぽの投稿を作成、エディタをHTML Viewにして、コードをそのまま貼り付けてみました。
結果、ただ０とだけ表示されました。よくわからない。
その後、元記事のソースコードをのぞいてみたり、適当にテンプレートの中にそれっぽく挿入してみたりしましたが、どうもうまくいきません。詮方なく、Sonnet先生にお伺いを立ててみました。
なるほど、やはりテンプレートに直挿しでよろしいのですね。
どうやら、テンプレートの内容と、投稿ごとの内容を綜合して、ひとつのWebページとして表示させる仕組みのように見えます。
そして０しか表示されなかった理由はまた別にあり、これはBloggerに存在しないフォントを使っていいねアイコンを表示させているからだと。そんなことまで丁寧に教えてくださるなんて、劇団Anthropicの指導者は半端ないですわね。
ご指導に従って、テンプレートを編集していきます。まずはテーマのCustomizeの右にあるプルダウンを開き、HTMLで編集（Edit HTML）を選択いたしまして、
エディタが開きましたら、entry-contentクラスを検索します。
ありました。このDiv要素が、投稿の内容に置き換わるイメージと理解しました。このDivの閉じた直後におけば、投稿の一番最後にいいねボタンが挿入できるという寸法ですわね。（正しいか否かは存じ上げませんが......）
そしてSonnet先生のご指摘のフォントも、b:if要素内に忘れずに追加いたします。来訪者様がコピペできるように、こちらにも残しておきます。
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css'/>
公開済みの記事を開いてみますと......
コメント
コメントを投稿