Web Analytics Made Easy -
StatCounter

めモらンだム・ヤード

自分用のアプリ設定やスクリプト類の備忘録・覚え書き(Memorandum) / 作った物のライセンスはCC BY-NC-SAで。 / 内容が古いまま、間違ったまま、書いている途中、途中で放置など、手入れはあまり行き届いていない庭 / 対象の仕様変更で動かなくなったもの多々。WorkFlowy向けは全滅したので削除 / 製作物のインストール及び使用は各自の責任で。使用によって、利用者および第三者に損害が発生したとしても、当方は一切責任を負いかねます

ObsidianモバイルにWikipediaの引用ソース表示、YouTubeの埋め込み、Tweetの埋め込み、Webページの選択範囲をHTML/Markdownにして貼り付け(2022-02-05)




1. Wikipediaの引用ソース表示

2021-02-05

Wikipedia:ウィキペディアを引用する - Wikipediaには、

使用している記事(版)の「更新日時」(時刻も含む)を記載して下さい。

と書かれている。そこで、ブラウザで開いている日本語版Wikipediaのページの現在の最終更新日時をMediaWiki APIを使って取得し、ウィキペディアの引用の仕方に従った書式にするショートカットを作った。

https://www.icloud.com/shortcuts/8085fbf6addf4f69965b2356954415c0

f:id:sorashima:20220205170347j:plain:w692
カザフスタンのページを引用したときに書く引用ソース表示を生成する。

f:id:sorashima:20220205170355j:plain:w479
クリップボードに表示された。

関連メモ:




2. YouTubeの埋め込み

2022-02-03

コニュニティプラグインの Simple Embedsを使えば

https://youtu.be/C4sAUc_ZGMY

などのように書き込めばOK。

f:id:sorashima:20220203204930j:plain:w489
このように表示される。(上図はスクリーンショットなのでタップしても反応しない)

以下のショートカットは不必要になった。

2021-12-25
もっと便利なものが存在するだろうが、自分が使う分にはこれで十分。

https://www.icloud.com/shortcuts/b95e955cc0b84123968db4e816ffd75c

f:id:sorashima:20211225225338j:plain:w715

f:id:sorashima:20211225225615j:plain:w364

f:id:sorashima:20211225225933j:plain:w316

f:id:sorashima:20211225230337j:plain:w468




3. ツイートの埋め込み

2022-02-03

これもYouTubeと同じくSimple Embedsで可能。

注意点
[Twitter link](https://twitter.com/rob_pike/status/1021913270922358784)

プラグインの説明に書かれている上の書き方だと、ツイートの内容が含まれていないのでツイートの内容で検索できない。

f:id:sorashima:20220203203333j:plain:w478
また、リプライが必ず表示され、単体のツイートは表示不可。


<blockquote class="twitter-tweet" data-conversation="none" data-dnt="true" data-theme="dark"><p lang="en" dir="ltr">Things should just work.</p>&mdash; Rob Pike (@rob_pike) <a href="https://twitter.com/rob_pike/status/1021913270922358784?ref_src=twsrc%5Etfw">July 25, 2018</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

Web版Twitterの各ツイートの右上の「…」メニューの「</>ツイートを埋め込む」からコピーしたコードを貼れば、ツイート内容も含まれているのでツイート内容も検索対象になる。

Hide conversationの設定も、Light/Darkの表示テーマ設定も反映される。

コードを新たに書き込んだり・書き換えたり、プラグインの設定を変えたりした時は、一度Obsidianアプリを再起動しないとコードがツイート表示に置き換わらないのが唯一の難点。

f:id:sorashima:20220203203402j:plain:w474
単体のツイートも表示できる。

以下のショートカットは必要なくなった。


Simple Embedsプラグインの説明にはYouTubeTwitterのことしか書いてないが、プラグインの設定画面には「YouTube」と「Twitter」と並んで「Instagram」・「GitHub Gists」・「Flat.io」・「Noteflight」・「Codepen」もオン/オフできるようになっている。




4. Webページの選択範囲をHTMLやMarkdownにして貼り付け

2022-02-03

Obsidian外部からのドラッグ - ドラッグ&ドロップ - Obsidian 日本語ヘルプ - Obsidian Publish

ブラウザからObsidianへのHTMLコンテンツのドラッグは自動的にマークダウンに変換されます。

と書かれているが、モバイルはまだ外部からのドラッグ&ドロップに対応していない。(List of known issues and planned improvements - Mobile - Obsidian Forum)
そこで、クリップボードにコピーした選択範囲を一度HTMLやマークダウンに変換してクリップボードにコピーするショートカットを作った。

https://www.icloud.com/shortcuts/a9e193baa2f64a56bbc52ffe8019075e

愛媛県のページの一部をキャプチャする。

f:id:sorashima:20220203214718j:plain:w692
選択してコピー

HTMLに変換した場合
<meta charset="UTF-8"><div class="page-header-wrapper " style="box-sizing: border-box; outline: 0px; font-family: &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Yu Gothic&quot;, YuGothic, &quot;ヒラギノ角ゴ ProN W3&quot;, &quot;Hiragino Kaku Gothic ProN&quot;, メイリオ, Meiryo, sans-serif; padding: 0px; background-color: rgb(255, 255, 255); caret-color: rgb(51, 51, 51); color: rgb(51, 51, 51); font-size: 16px; font-style: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-text-size-adjust: 100%; -webkit-text-stroke-width: 0px; text-decoration: none;"><div class="page-header member" style="box-sizing: border-box; outline: 0px; font-family: &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Yu Gothic&quot;, YuGothic, &quot;ヒラギノ角ゴ ProN W3&quot;, &quot;Hiragino Kaku Gothic ProN&quot;, メイリオ, Meiryo, sans-serif; padding: 50px 10px 30px; margin: 0px auto; border: 0px; width: 834px; max-width: 1200px; letter-spacing: 2px; color: rgb(51, 51, 51); background-color: transparent; clear: both; overflow: hidden;"><div class="inn clearfix" style="box-sizing: border-box; outline: 0px; font-family: &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Yu Gothic&quot;, YuGothic, &quot;ヒラギノ角ゴ ProN W3&quot;, &quot;Hiragino Kaku Gothic ProN&quot;, メイリオ, Meiryo, sans-serif; padding: 0px 10px 0px 40px; height: auto; background-image: url(&quot;/images/attraction/mainDetailTitle.png&quot;); float: left; background-position: left center; background-repeat: no-repeat no-repeat;"><h1 class="title" style="box-sizing: border-box; outline: 0px; font-size: 35px; margin: 0px; font-family: &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Yu Gothic&quot;, YuGothic, &quot;ヒラギノ角ゴ ProN W3&quot;, &quot;Hiragino Kaku Gothic ProN&quot;, メイリオ, Meiryo, sans-serif; font-weight: bold; line-height: 1em; color: inherit; padding: 0px;">日本一細長い半島の魅力発見旅</h1></div></div></div><article style="box-sizing: border-box; outline: 0px; display: block; font-family: &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Yu Gothic&quot;, YuGothic, &quot;ヒラギノ角ゴ ProN W3&quot;, &quot;Hiragino Kaku Gothic ProN&quot;, メイリオ, Meiryo, sans-serif; padding: 0px 10px; caret-color: rgb(51, 51, 51); color: rgb(51, 51, 51); font-size: 16px; font-style: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-text-size-adjust: 100%; -webkit-text-stroke-width: 0px; text-decoration: none;"><div class="content" style="box-sizing: border-box; outline: 0px; font-family: &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Yu Gothic&quot;, YuGothic, &quot;ヒラギノ角ゴ ProN W3&quot;, &quot;Hiragino Kaku Gothic ProN&quot;, メイリオ, Meiryo, sans-serif; margin: 0px auto; padding: 35px 10px 40px; width: 814px; max-width: 1200px !important;"><div class="head clearfix" style="box-sizing: border-box; outline: 0px; font-family: &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Yu Gothic&quot;, YuGothic, &quot;ヒラギノ角ゴ ProN W3&quot;, &quot;Hiragino Kaku Gothic ProN&quot;, メイリオ, Meiryo, sans-serif; margin-bottom: 80px; background-color: rgb(255, 255, 255); -webkit-box-shadow: rgba(0, 0, 0, 0.2) 5px 5px 10px 0px; box-shadow: rgba(0, 0, 0, 0.2) 5px 5px 10px 0px;"><div class="innL pull-left" style="box-sizing: border-box; outline: 0px; font-family: &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Yu Gothic&quot;, YuGothic, &quot;ヒラギノ角ゴ ProN W3&quot;, &quot;Hiragino Kaku Gothic ProN&quot;, メイリオ, Meiryo, sans-serif; float: left; width: 397px; max-width: 600px;"><div class="figure" style="box-sizing: border-box; outline: 0px; font-family: &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Yu Gothic&quot;, YuGothic, &quot;ヒラギノ角ゴ ProN W3&quot;, &quot;Hiragino Kaku Gothic ProN&quot;, メイリオ, Meiryo, sans-serif; position: relative; z-index: 1; display: block;"><img src="https://www.iyokannet.jp/image/rendering/attraction_image/4079/trim.960/2/1?v=2bdac64d6116e6ad89d271d9a5ae9f5c997ed4e6" alt="日本一細長い半島の魅力発見旅" class="img-responsive" style="box-sizing: border-box; outline: 0px; border: 0px; vertical-align: middle; font-family: &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Yu Gothic&quot;, YuGothic, &quot;ヒラギノ角ゴ ProN W3&quot;, &quot;Hiragino Kaku Gothic ProN&quot;, メイリオ, Meiryo, sans-serif; display: inline-block; max-width: 100%; height: auto; width: auto;"></div></div><div class="innR pull-right" style="box-sizing: border-box; outline: 0px; font-family: &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Yu Gothic&quot;, YuGothic, &quot;ヒラギノ角ゴ ProN W3&quot;, &quot;Hiragino Kaku Gothic ProN&quot;, メイリオ, Meiryo, sans-serif; float: right; width: 397px; margin-bottom: 10px;"><div class="courseDescription" style="box-sizing: border-box; outline: 0px; font-family: &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Yu Gothic&quot;, YuGothic, &quot;ヒラギノ角ゴ ProN W3&quot;, &quot;Hiragino Kaku Gothic ProN&quot;, メイリオ, Meiryo, sans-serif; padding: 30px 50px; font-weight: bold; font-size: 18px;">日本一細長い半島・佐田岬。道をくねるごとに表情の違う小さな漁港が点在し、海と寄り添って暮らす人々の生活を感じることが出来る。海を眺めながら、ふわふわのしらすに舌鼓を打ったあとは、歴史遺産に触れながらの絶景ドライブ。三崎港からは大パノラマの四国最西端クルージングを楽しんで。最後は地下1500mから湧き出る効能豊かな「亀ケ池温泉」で1日の疲れを癒して帰路に着こう。</div></div></div></div></article> <br clear="all"/>

f:id:sorashima:20220203214401j:plain:w692
レイアウトが保存されている。

マークダウンに変換した場合
# 日本一細長い半島の魅力発見旅

![日本一細長い半島の魅力発見旅](https://www.iyokannet.jp/image/rendering/attraction_image/4079/trim.960/2/1?v=2bdac64d6116e6ad89d271d9a5ae9f5c997ed4e6)

日本一細長い半島・佐田岬。道をくねるごとに表情の違う小さな漁港が点在し、海と寄り添って暮らす人々の生活を感じることが出来る。海を眺めながら、ふわふわのしらすに舌鼓を打ったあとは、歴史遺産に触れながらの絶景ドライブ。三崎港からは大パノラマの四国最西端クルージングを楽しんで。最後は地下1500mから湧き出る効能豊かな「亀ケ池温泉」で1日の疲れを癒して帰路に着こう。

f:id:sorashima:20220203214431j:plain:w692
レイアウトは崩れるがコードが短くて済む。
ただこちらは、選択範囲コピーをObsidianにペーストしてObsidianアプリの自動Markdown変換に任せた結果とあまり変わらないので、あまり使う機会はないかも。

©︎ 2022 Sorashima