Notionは十分おしゃれで使いやすいツールだと思っていましたが、

まだおしゃれにする機能が隠れていたようです。

そんなことが分かったのはこのツイート。

crossさんこと「ひつじさん」と勝手に呼ばせていただいているこの方。

実はeasy-notion-blogの大先輩で、一方的に「きっとすごい人」カテゴリーに登録させていただいておりました。

ご本人から紹介を受けたわけではなく、

ただただ一方的に調べて「ひつじさんってこういう方なのか」と認識している情報をシェアすると....

easy-notion-blogをForkしたメンバーの中で最も古株。

私がForkしたのは2021/12/10頃だったので、それより前。

easy-notion-blogの最初のcommitが2021/11/03となっているので、

わずか１ヶ月経つか立たないかの時期にForkを済まされていた方。

一度だけ、Notionを便利に使えるChromeの拡張機能についてやりとりしたこともありました。

私が得られている情報はここまで。

そんなひつじさんがある日さらっと「Templeteを作成しました〜」とツイートされたもんだから、

中身を見ずにブックマーク印としてイイネ❤️ボタンを押し、

「ひつじさんのテンプレを使ってみる時間」というスケジュールを組むことにしました。。。。

https://crossn.gumroad.com/l/Color-Palette

テキストに\color{#FFFFFF}\colorbox{#c71585}{\textsf{Sample Fill Color}} といった内容を打ち込み、

そのテキスト全てを選択した後【equation】という装飾をすると......

↓

背景付きの装飾ができます。

背景無しは\colorbox{} の部分を削って入力すると作ることができます。

ひつじさんが説明ツイートをされていたのて添付すると.....

簡単に自分のNotionへ取り込むことができます＼(^o^)／

数式を毎回打ち込むのは億劫だなと感じた私はデータベースをrelationさせてプラグインDBを作ることにしました。

【使い方】

1. Input_textに表示させたい文字を入力
2. name_colorboxで背景色を選ぶ
3. name_colortextで文字色を選ぶ
4. Largeで大きさを設定
5. valueに完成した数式が表示されるのでretuenにコピペしてequation化する

【プラグインの作り方】

簡単にどんな機能を設定しているかを説明すると.....

ここまでの列がひつじさんのDBから紐付けている部分です。

この後の列は実装するために必要な数式を作成するための列になります。

【Large?列】は単純にチェックボックスを設定し、

複雑に見えてしまうのがvalue列。

formulaで以下の関数を設定しておきます＼(^o^)／

prop("Input_text") ? (prop("Large?") ? concat("\\Large{", format("\\color" + "{" + prop("code_colortext") + "}"), format("\\colorbox" + "{" + prop("code_colorbox") + "}"), format("{\\textsf" + "{" + prop("Input_text") + "}}}")) : concat(format("\\color" + "{" + prop("code_colortext") + "}"), format("\\colorbox" + "{" + prop("code_colorbox") + "}"), format("{\\textsf" + "{" + prop("Input_text") + "}}"))) : ""

使用した関数

• ifの代わりに三項演算子
• concat
• format

基本、テキストで入力する場所に使うことができますが、なにせ数式。

文中に数式を混在させてしまうと後々修正するときにちょいとNotionがおかしな動きをするので、

文頭・文末で使用する方が良さそうです。

🔄 2023/01/13

数カ月後確認したところ、

文中に数式を混在させてもおかしな動きにならず余裕でした＼(^o^)／Notionさんｱﾘｶﾞﾄｳ

\Large{\color{#696969}\colorbox{#ffd700}{\textsf{Herohoro}}} という数式を

いろんなblockに入れてみました。

ただ、/page で作成すると表示できませんでした。(メンションページリンク❎)

でも、ページを開くとタイトルとしては表示されます。

マルチセレクト・通常のセレクトプロパティは表示されませんでしたが、

• データベースのタイトル
• page名
• textプロパティ

これらはOKでした＼(^o^)／

ただ、ここでもデータベースをメンションリンク名にすると表示してくれませんでした....

背景の□の大きさは、\Largeだけでなく大文字・小文字によっても変化して可愛らしい装飾ができます。

※ 2行目の*H*e*r*o* は*以外の文字全て\Large モードですが、文字自体の大きさで□が変化しています★

通常のテキストカラーや背景カラーだけでは物足りなくなってきた方にはうってつけ。(私だ....www)

何か人さまの目に触れるようなページをNotionで作る時に活躍しそうです。

このテンプレを使うと絶対「これどうやって作ったの？」と質問されそうですね☺️

これからどんどん使っていこうと思います〜〜〜〜〜🤸🤸🤸🤸🤸🤸🤸🤸

後ばなし....

このプラグインがひつじさんに使っていただけることとなりました＼(^o^)／ヤッター

ダウンロードサイトのスライドをめくると....

プラグインのスクショが＼(^o^)／＼(^o^)／

テンプレートのNotionを開くと.....

↓

ひつじさんがいい感じに追加実装してくださっています＼(^o^)／

Largeか否かではなく細やかな設定がセレクトできるようになりました★スゴイ!!!!!!!

おかげさまでいい感じの作業ページになりました(*´ڡ`●)

ダウンロードはこちらです——

https://crossn.gumroad.com/l/Color-Palette

パレットとスマホで変換すると「pallet」となりますが....

Color-Paletteの【Palette】はフランス語らしいです(*´∀｀*)

ニヤニヤ🎊

こちらのスレッドにどんどん追加していきます★

まだまだつづくスレッド......www

「これいいかも」と感じるツイートを見つけたら、

是非是非スクショを参考に、

ご自身で作ってみてくださいね(*^^*)🎶

sort・filter・formula・relation・rollupの練習になり、

とっても楽しいです★☆★☆