#author("2020-05-02T10:14:49+09:00;1970-01-01T18:00:00+09:00","default:tgoto","tgoto")
このサイトは個人のメモ書きという要素が強かったのでSNSでのシェアのしやすさはそれほど意識していなかったのと、ウェブサイトが重くならないように極力シンプルな構成を目指していましたが、AMP用スクリプトはいずれもウェブサイトの重さに極力影響を与えずに様々な機能が実装できることがわかってきたので、SNSでのシェアを容易にするためのAMP-social-shareスクリプトも設定してみました。
#ogpi(https://amp.dev/ja/documentation/components/amp-social-share/)
TwitterやFacebookなどスクリプトにオフィシャルとして認められているSNSの場合は設定はほぼコピペのみで完了します。はてなブックマーク、はてなブログや、最近人気が出てきているnoteなどは日本でしか普及していないからかスクリプトの公式対応がまだなので、設定は手打ちしてやる必要があり、若干手間がかかります。
下記にnoteのボタンを設置するための例を記載しておきます。なお、ロゴは公式サイトにてSVGが配布されています。このSVGをテキストエディタで開いて、背景と本体の色を反転させています。
''CSS''
> amp-social-share[type=note] {
> background-color: #41C9B4 ;
> background-image: url('<?php echo get_script_uri() ?>skin/note_logo.svg');
> background-repeat: no-repeat;
> }
''body内''
> <amp-social-share type="note" class="snsicon" width="50" height="40" data-share-endpoint="https://note.mu/intent/post?url=<?php echo $canonical_url ?>"></amp-social-share>
他のpukiwikiカスタマイズ箇所については下記を参照。
#ogpi(https://oncologynote.com/?7541d85e0f)