Jazzと読書の日々

iPadを筆記具として使う方法を模索します

Obsidian:WebClipperの結果をどう活かすか

ネットの記事を取り込める。 それもObsidianの利点です。 そこからその記事をどう活用するかですよね。

webclip

WebClipperで集めたノートを一覧するBases。

項目ごとに高さ調整するので困ってましたが、 捨て項目を設けることでやりくりできそうな気がしました。

webclip.md

Bases自体はシンプルです。

Import Obsidian: webclip

---
search:
---
>[!example]- webclip
>```dataview
>task where !completed group by file.link
>```

```base
filters:
  and:
    - file.folder == "Clippings"
formulas:
  サムネ: image(image)
  space: '" "'
views:
  - type: cards
    name: Cards
    filters:
      and:
        - if(this.search,(file.name+author+description).contains(this.search), true)
    order:
      - file.name
      - source
      - description
      - formula.space
    sort:
      - property: file.mtime
        direction: DESC
    columnSize:
      file.name: 462
      note.author: 162
    rowHeight: tall
    image: note.image
    imageFit: ""
    imageAspectRatio: 0.7
    cardSize: 200

```

searchプロパティに書き込むと、 そのキーワードを含むノートを絞り込みます。

bases.css

cssでdescriptionを三行表示にします。

.bases-view {
  font-size: 14px;
}

.bases-cards-item {
  background: ivory;
  border-left: 10px solid gold;
  box-shadow: none;
}

.bases-cards-line {
  font-size: small !important;
  padding-top: 0;
  height: 1.4em;
}

.mod-title>.bases-cards-line {
  color: navy;
  height: 2em;
  white-space: pre-wrap;
}

.bases-cards-label {
  display: none;
}

.bases-cards-property[data-property="note.description"] {
  overflow: visible;
}

.bases-cards-property[data-property="note.description"]>.bases-cards-line {
  height: 3em;
  white-space: pre-wrap;
}

するとこんな感じ。

内容がちょっとわかる。

ポイント

spaceというformulaを作り、カードの高さを調整しています。

これがないと高さが足りなくなってしまう。

一行半しか表示しない。 今後修正されそうな仕様ですけどね。

まとめ

Obsidian Bases:内部リンク込みの関連ノートを表示 - Jazzと読書の日々

このクリップがTagLinkで連絡しあう。 そうなってObsidianの真骨頂だと思います。