最近よく書くティラピアを飼う

[コピペOK]トマレバのカスタマイズ「カード表示」っぽくするCSSを作成しました

ブログ運営・ウェブ運営をしている人むけに「トマレバ」のカスタマイズをご紹介します。私と妻で運営している沖縄の観光サイト「ODAY」でも、実際に使っているカスタマイズです。

コピペで使えるようになっているのでご活用ください。

トマレバってなに?

トマレバCSS

トマレバとは、ブログ・サイト上で、宿やホテルを紹介するためのブログパーツです。
楽天トラベル、じゃらん、JTBなどの宿泊予約サイトへのリンクを、簡単に表示できるようになります。

宿泊関係のリンクって生成するのが手間ですが、トマレバを使うと作業が一気に効率アップしますよ!

ちなみにトマレバは宿泊用のツールですが、同じようなもので、ネット通販用の「カエレバ」、書籍の紹介用「ヨメレバ」なんかもあります。

どれも便利でよく使わせていただいております。

わかったブログのかん吉さん、いつも素敵なツールをありがとうございます!)

トマレバのCSSカスタマイズ

というわけで、今回、ご紹介するのはこんな感じのカスタマイズ。

トマレバ サンプル

DEMO

トマレバで生成したホテルのリンクをシンプルな表示に切り替えます。各旅行サービスへのリンクはブランドカラーに寄せた色合いのボタンにしてあります。

カスタマイズCSSの注意点

トマレバでリンクを生成する際に注意点があります。

トマレバCSSのカスタマイズ

デザインは、「amazlet風-2(cssカスタマイズ用)」を選択してお使いください!
(これに合わせてCSSを作っていますので、これ以外で表示確認していません)

カスタマイズ用CSSコード(コピペOK)

これをコピペしてスタイルに加えれば、そのまま適用されます。CSSが分かる方は、あとはお好みで調整しても良いと思います。

[code_menseki]

記事を検索
シェアする