Amazonの商品紹介Markdownをつくるブックマークレット

bibinfo-exporter/script.js at main · goryugocast/bibinfo-exporterを参考にAmazonから書誌情報をへ取り込むブックマークレットを作成した。 直接Obsidianに取り込むのは自分の運用に合わないためTextwellへ追記するように。 こちらは書籍専用で､著者名や出版社､出版日などを取り込む。 Amazonの書誌情報をTextwellの追記するブックマークレット javascript: (() => { const dest_path = 'notes'; //ファイルを格納するパス const amazon_id = 'namaraiicom-22'; // アフィリエイトID let p = document.getElementById("productTitle"); //書籍のタイトルの処理 p = p ? p : document.getElementById("ebooksProductTitle"); const title = p.innerText.trim(); let asin = document.getElementById('ASIN'); //ASIN番号の処理 const a = asin ? asin.value : document.getElementsByName('ASIN.0')[0].value; const url = `https://www.amazon.co.jp/exec/obidos/ASIN/${a}/${amazon_id}/`; const link = `[${title}](${url})`; let image = document.getElementById("imgTagWrapperId"); //書影の処理 image = image ? image : document.getElementById("ebooksImgBlkFront"); const imageurl = image.querySelector("img").getAttribute("src"); const c = document.getElementsByClassName('author'); const pub = []; const ct_list = []; // ctの各要素を保存する配列を新たに定義 for (let g = 0; g < c.length; g++) { const at = c[g].innerText.replace(/\r?\n/g, '').replace(/,/,''); const pu = at.match(/\(.+\)/); const ct = at.replace(/\(.+\)/,'').replace(/ /g,''); ct_list.push(ct); // ctを配列に追加 pub.push(`${pu} [[${ct}]]`); } const author = pub.join(' '); let h1title = `『${title}』`; h1title = h1title.replace(/[\\/:*?"<>|.]/g, char => ({ ':': '：', '\\': '＼', '/': '／', '?': '？', '*': '＊', '"': '”', '<': '＜', '>': '＞', '|': '｜', '.': '．' }[char])); const mdimage = `[](${url})`; // 登録情報欄を取得 let detail = document.getElementById('detailBullets_feature_div'); if (!detail) { const subdoc = document.getElementById("product-description-iframe").contentWindow.document; detail = subdoc.getElementById("detailBullets_feature_div"); } const detailtext = detail.innerText; const pubdata = detailtext.split(/\n/); pubdata[2] = pubdata[2]?.slice(10); // 出版社 const date = new Date().toLocaleDateString('sv-SE'); const lines = `---%0D%0Atitle: "${h1title}"%0D%0Adate%3A%20${date}%0D%0Aupdated%3A%20${date}%0D%0Andl%3A%0D%0Atags%3A%20読書メモ%0D%0Adraft%3A%20true%0D%0A---%0D%0A${mdimage}%0D%0A-%20${link}%0D%0A-%20${author}%0d%0A-%20${pubdata[2]}%0D%0A%0D%0A%23%23 関連・思い出した本 %0d%0A%23%23 読書メモ%0d%0A`; const app = `textwell:///add?text=${lines}`; window.open(app); })(); こちらは一般的な商品の画像と商品名を取り込む。 Amazon商品の商品名と画像へのリンクをTextwellに追加するブックマークレット javascript: (() => { const dest_path = "notes"; //ファイルを格納するパス const amazon_id = "namaraiicom-22"; // アフィリエイトID let p = document.getElementById("productTitle") || document.getElementById("ebooksProductTitle"); //書籍のタイトルの処理 const title = p.innerText.trim(); const asinElement = document.getElementById('ASIN') || document.getElementsByName('ASIN.0')[0]; //ASIN番号の処理 const a = asinElement.value; const url = `https://www.amazon.co.jp/exec/obidos/ASIN/${a}/${amazon_id}/`; const link = `[${title}](${url})`; const image = document.getElementById("landingImage"); const imageurl = image.getAttribute("src"); // 自分が必要なパラメータに変換 let h1title = title.replace(/[\\/:*?"<>|.]/g, char => ({ ':': '：', '\\': '＼', '/': '／', '?': '？', '*': '＊', '"': '”', '<': '＜', '>': '＞', '|': '｜', '.': '．' }[char])); const mdimage = `[](${url})`; const lines = `${mdimage}%0D%0A%0D%0A${link}%0D%0A`; const app = `textwell:///add?text=${lines}`; window.open(app); })();

ObsidianのデイリーノートへTextwell から追記するためのアクション。TextwellからObsidianのデイリーノートを書く方法 - Jazzと読書の日々を参考にさせていただき以下の修正を行った。 デイリーノートのディレクトリ構成（YYYY/MM/YYYY-MM-DD.mdとした） 新規作成ではなく追記に変更 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 // デイリーノートのルートディレクトリ Root = "journal"; url = "obsidian://"; d = new Date(); y = d.getFullYear(); m = Zero(d.getMonth()+1); // デイリーノートのディレクトリ構成対応(YYYY/MM/YYYY-MM-DD.md) Folder = Root + "/" + y + "/" + m; Title = y + "-" + m + "-" + Zero(d.getDate()); if(Folder) Title = Folder + "/" + Title; if(T.text) url+= "new?content=" + encodeURIComponent("\n") + T.stdin.text + "&file=" + encodeURIComponent(Title) + "&append"; T(url,{option:"cutWhole"}); function Zero(x){ return ("00"+x).slice(-2); }

Textwell - The Modeless Textbox for iPhone, iPad, iPod touch, Mac, and Watch. メモ、メッセージ、ブログ、検索、投稿など、あらゆる文章作成タスクに使用できる多目的テキストエディタ ファイリングやスタイリングのための機能はないが、JavaScriptベースのカスタマイズ可能なアクション、自動履歴、クラウド同期などをサポートしており、シンプルで拡張性が高い Mac版、iOS版、AppleWatch版がある Textwell | URL Schemes 自作のアクションなど # ソートして重複行を削除するTextwellのアクション Obsidianのデイリーノートへ追記するTextwellのアクション Amazonから書誌情報をTextwellへ取り込むブックマークレット

ページタイトル変更時の問題 # Obsidianでノート名（ファイル名）を変更した場合、そのノートに張られているリンクは自動的に修正される。このため、Obsidian単体で使っている限りは気軽にノート名を変更して問題ない。 ページの内容が変化した場合、それにあわせてノート名を変更したくなるのは自然なことで、Obsidianはそれをアプリケーションの機能として実現しているわけだ。 ただ、Obsidian PublishやQuartzなどを使って、Obsidianのノートをインターネット上で公開する際には、外部サイトからリンクを張られる可能性がある点を考慮する必要がある。 Obsidianを単体で使うときのように気軽にノート名を変更してしまうと、外部サイトからのリンクがデッドリンクになってしまうからだ。 この問題に対してScrapboxは、 ページタイトルをURLにする(ページタイトルとは別に一意なページIDを持っている) 外部からのアクセス時、ページが無くなっていた場合は、そのURLのアクセスログからページIDを探し、ページIDから移動先へリダイレクトする という方法で対応しているようだ。 wikiでページのURLをIDにすると絶対にうまくいかない - 橋本商会 本サイトでの対応 # 本サイトではこのページタイトル問題について、以下のように対応している。 ノート名（ファイル名）は半角英数字と一部の記号(- _)だけを使用する Markdownファイルとしての取り扱いを考慮 ノート名（ファイル名）は基本的に変更しない（外部公開時のパーマリンク維持のため） それでも変更したくなったらFront Matterにaliasesを書いておけば大丈夫そう これはHugoの機能。ただしまだQuartzでは試していない。 ノートのタイトルはFront Matterのtitleを使用する URLの構成要素ではなくなるので気軽に変更できる ただ、これだとファイルエクスプローラなどで視認性が落ちてしまう… ファイル名表示をtitleがあればそれを使用するプラグインがあった obsidian-front-matter-title オプションのAlias titleをONにすれば、Aliasを本来の目的で使用できなくなるものの、Wikiリンクの補完時に日本語のtitle、ファイル名のどちらでも候補を検索できるようになる 現時点では大きな問題は無さそうだが、しばらく運用して再評価したい。

PCやスマホで作成したメモをどのように管理するか。方法やツールを替えながら長年模索してきたが､ここ最近は以下の考え方を元に運営し安定している。 (1) PKMツールとしてのObsidian # ObsidianはいわゆるPKM(Personal Knowledge Management)のツールとして使用しており､自分で考えたことや調べてまとめたこと（主に技術的な話題）を管理している。 ページ間のリンクなどObsidianらしい機能はあまり使っていないが､メモ管理ツールとしてこなれているし､プラグインで機能拡張できるところも良い。 有償のObsidian Syncを契約しており､iPhone・iPad・Mac・PCの各アプリでメモを同期している。 また､すべてのメモではないがquartzというツールでWebサイトとして公開している。 NamaraiiBox Obsidianでのノート編集から公開までの流れは､このページにまとめてある。 (2) 覚え書きを中心としたメモを管理するApple謹製メモ # メモを外部へエクスポートする有効な手段がないという大きな不満はあるものの､アプリとしては年々良くなっているし､Apple製品は今後も使っていくだろうということで､覚え書きを中心としたメモはApple謹製の「メモ」で管理している。 メモのジャンルはこんな感じ。 写し・控え（各種手続きの写し。スキャンしたPDFを添付する） モノ（買ったもの。型番やマニュアルのPDFを一緒に管理） 家族（家族のもろもろの覚え書き） 飲食店（好きな店､行ってみたい店） カメラ・写真（撮影スポット､持っているカメラ､レンズ､機材など） キャンプ（キャンプ場のメモ､持っている道具､キャンプ飯レシピ） 人物（スキャンした名刺とメモ） クルマ（車検証や保険証の写し､メンテナンス記録､マニュアルなど） 雑多なメモ（洋服のサイズ､粗大ゴミの出しかたなど） Appleのメモは添付したPDFの中も検索できるので､取説やスキャンした紙などをバンバン添付して使っている。 iCloudでiPhone・iPad・Mac間で同期している。ひと昔前はメモの容量が大きくなると同期が不安定になっていたが､ここ最近は安定しているようだ（自分の環境では）

Hugoには他のCMSではよくある､機能を拡張するためのプラグインを提供する仕組みがない。 このため､あるテーマの中に便利なショートコードがあったとして､それを別のテーマで使用しようとした場合､ テーマディレクトリ/layouts/shortcodes配下のショートコードのソースを､別のテーマの/layouts/shortcodes配下､またはルート配下の/layouts/shortcodesへコピーする ショートコードにスタイルが設定されている場合､スタイルシートの中から必要な部分を抜き出し､別のテーマのスタイルシートへコピーする という煩雑な手順が必要となるが､先日､以下のショートコードのインストール手順を読んでいたら､うまい方法でショートコードを提供していた。 mfg92/hugo-shortcode-gallery: A theme components with a gallery shortcode for the static site generator hugo. まずショートコードのコードをテーマディレクトリ配下へcloneする。その後､config.tomlでテーマを以下のように指定する。 theme = ["your-main-theme", "hugo-shortcode-gallery"] そもそもテーマを複数指定できることを知らなかったが､この設定によりyour-main-themeテーマに加えhugo-shortcode-galleryテーマも参照されることになる。 そして､hugo-shortcode-gallery配下は以下のようなファイル構成になっている。 hugo-shortcode-gallery ├── LICENSE.md ├── README.md ├── assets │ └── shortcode-gallery │ ├── filterbar.sass │ └── font-awesome │ ├── compress-alt-solid.svg │ ├── expand-alt-solid.svg │ └── license.txt ├── config.toml ├── layouts │ └── shortcodes │ └── gallery.html └── static └── shortcode-gallery ├── jquery-3.7.0.min.js ├── justified_gallery │ ├── LICENSE │ ├── jquery.justifiedGallery.js │ ├── jquery.justifiedGallery.min.js │ ├── justifiedGallery.css │ └── justifiedGallery.min.css ├── lazy │ ├── jquery.lazy.js │ └── jquery.lazy.min.js └── swipebox ├── css │ ├── swipebox.css │ └── swipebox.min.css ├── img │ ├── icons.png │ ├── icons.svg │ └── loader.gif └── js ├── jquery.swipebox.js └── jquery.swipebox.min.js 14 directories, 23 files テーマと言ってもlayouts配下にあるのはショートコードのみである。そしてassetsとstaticディレクトリ配下にショートコードで使用するファイルだけを置くというのは､汎用的にショートコードを提供する方法として手軽で良いと思った。