サイトは一部アフィリエイトを含みます。
マガジン「沖縄で家づくり」読んでみてね!

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

ブログ運営・ウェブ運営をしている人むけに「トマレバ」のカスタマイズをご紹介します。

私と妻で運営している沖縄の観光サイト「ODAY」でも、実際に使っているカスタマイズです。

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

スポンサーリンク

トマレバってなに?

トマレバCSS

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

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

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

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

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

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

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

トマレバ サンプル

DEMO

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

カスタマイズCSSの注意点

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

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

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

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

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

※記事で紹介したコードは動作を保証するものではございません。必ず自己責任で使用してください。コードを使う際はテストを行い、動作検証をおこなってください。

閉じる