Twitterウィジェットを各エントリの最後に表示させる
FirstUPDATE2021.11.9
@Scribble #Scribble2021 #プログラミング #Twitter #やぶにらこぼれ 単ページ viewport

Scribbleは「Twitterとの完全連携」をお題目に作ったので、Twitter上だけでなくScribbleの各エントリ上でも「完全に連携されてる」ってのを見せなきゃいけないわけでして。

しつこく念を押しておきますが、Scribbleってのはアタシが自作した「基本的にローカルで完結する<似非>SNS」です。
つまり、SNSと謳うのであればあって然るべきコミュニケーション機能がない。要するにイイネやリプライなどの機能を有してないことになります。
しかしTwitterとの完全連携でやるのであれば、この欠点は欠点にはならない。Twitter上でやってもらえればいいからです。
ただし、そうなると各エントリの最後に「該当エントリ紹介のためのツイート」=Twitterウィジェットを表示させてやることが前提になる。こうすることで読み終わった後で簡単にリアクション出来るようになる、と。

しかしこれは本当に骨が折れました。
ScribbleのHTMLやCSSの構成はYabuniraと基本的には共通している。ベースとなるYabuniraを作り込めば、後は簡単にScribbleに流用出来る、はずでした。
事実、ほとんどのところはまったく同じCSSで大丈夫だった。ところが「各エントリの最後にTwitterウィジェットを表示する」のがどうしても上手くいかないんです。
もちろん表示出来るのは出来るんですよ。でもTwitterウィジェットが異様に小さい。横幅が画面いっぱいになってくれない。散々検索して「これなら幅いっぱいに表示出来るよ!」ってのを試したけど、どれも不成功に終わりました。
最後の手段として、HTMLを弄る方法があった。ってもヘッダー内に『meta name=”viewport”~』を追加するだけっていう。
たしかにこれならTwitterウィジェットは幅いっぱいに表示される。ただしその代償としてCSSをかなり弄らなきゃいけないのです。つまり全体に影響を与えるので、極力やりたくなかったのです。
ま、結局は、降参した。つまりヘッダー内に『meta name=”viewport”~』を追加した。だって他の方法は全部無理だったんだもん。

もうひとつ。テキストをエントリするか、その紹介をツイートするかは「鶏が先か卵が先か」に近いものがあって、というのもツイートするまでそのツイートのURLアドレスはわからない。でも先にエントリしておかないと紹介もツイート出来ないっつー。
そこでかなりトリッキーですが、二段階エントリという方法を使った。

テキストをエントリ(この時点では末尾にTwitterウィジェットなし)&ツイート
→Twitterアプリから当該ツイートのURLアドレスをコピー
→URLアドレスからTwitterカードを作成してエントリをTwitterウィジェットを追加する形で改稿して再アップ

こう書けばものすごく手間みたいだけど

テキストファイルを選択してアップ
→Twitterアプリを実行
→URLアドレスをコピーしたら改稿して再アップ

なので、アクションの数としてはたいしたことはありません。

現状これはScribbleだけの仕様で元となったYabuniraには反映されてないんだけど(今はYabuniraにはTwitterウィジェットを表示させる予定がないので)、いずれは仕様を統一したい。その方がいろいろとラクだからね。
共通化するのなら、もうちょっとScribbleの機能を増やしてからかな。現状、画像、YouTube、Twitterウィジェットの貼り付けには対応してるけど普通のサイトのリンクがね、対応してるのはしてるけどイマイチなんで。そこを改善してからかな。

ま、まだ始めたばかりなんでね。時間をかけて成熟すればいいんだけどね。







Copyright © 2003 yabunira. All rights reserved.