リンクなどをボタンっぽくするデザインに変更するWraptas独自機能の利用方法の紹介です。

今までは下記の記事のようにCSSを挿入することで実装していたボタン型のリンクですが、CSS編集無しで挿入できるようになったので、利用方法を紹介します。

Linkをボタンっぽくするデザイン

利用方法

  1. Wraptas管理画面で利用したいサイトの「サイトデザイン編集」→コンテンツエリアの「リンクボタン機能をON」にするへチェックを入れて保存します。(新規に制作したサイトはデフォルトでONになっていります。)
  2. Notion上の記事では通常のテキストブロックで、 [] でくくったURLリンク(ページリンクでも動作します)がボタンに自動で変換されるようになります。
  3. ボタンの色はNotionのそのブロックの背景色と連動し、それぞれの色に変換されます。色なしの場合白で黒フチのボタンになります。下記がそれぞれの背景色のボタンになります。

[セミナー応募はこちらから! ➡]

[リンク]

[リンク]

[リンク]

[リンク]

[リンク]

[リンク]

[リンク]

[リンク]

[リンク]

以下がNotion自体のリンクになります。こちらをコピーしても利用できます。

ボタン変換サンプル

注意点

上手く動作しない場合には以下の項目を順番にチェックしてください。

  1. 管理画面側で「リンクボタン機能をON」チェックを入れて保存している