【kViewer】CSSカスタマイズを使わないでカラフルなボタンを使う方法

はじめに

kViewerのヘッダー、サイド、フッターなどにURLリンクを配置したいなと思ったことはないでしょうか？

その際に、私はめんどくさがりですが、リンクはできればボタンっぽくなってほしいなと思ったりします。

かといって、わざわざCSSカスタマイズするのも面倒だなと思ったりします。

なので、そんなときに手っ取り早くボタンっぽくするやり方を紹介します。

といいつつ、自分で忘れないようにここに残しておきます。

結論ですが、下図のように、コンテンツタイプをHTMLとして、aタグにクラスを付与するだけです。

もう少し詳細に説明します。

以下のサンプルコードのように、aタグにクラスを付与するだけで、色付きのボタンでかつホバーしたらちょっとだけ色が変化するものになります。

<a href="ここにURLを入れる" class="ui button ここに色名入れる">ボタンのテキスト</a>

上記のコードをコンテンツに入れることでカラフルなボタンが作れます！

色のバリエーションは以下のとおりです。

仕組みとしては、すでにトヨクモさん側で用意してあるCSSを借りているような形になります。

ですので、このスタイルシートが変更になると機能しなくなりますのでご注意ください。

統一感のあるボタンに仕上がるので個人的には気に入っております。

気になる方はぜひお試しください。