【スタイル】ヨメレバ・カエレバ・トマレバ・タベレバの文字とボタンを左揃えに(序章)

その他 インターネット
この記事は約3分で読めます。

つい先日、ヨメレバカエレバトマレバというブログパーツを使いはじめました。

ブログパーツのスタイルを格好良くしたくて、スタイル定義(CSS)をネットでいろいろと探してみたのですが、どれも中央揃えでブログのデザインに合いません。

ということで、左揃えのスタイル定義(CSS)を自分で作ってみました。

なお WordPress(ワードプレス)のテーマ「Cocoon(コクーン)」の場合は、自前でスタイル定義(CSS)をしているので、特別な対応が必要です。

スポンサーリンク

ヨメレバ・カエレバ・トマレバ・タベレバとは

カエレバの表示例

さて、ヨメレバ・カエレバ・トマレバ・タベレバとは、「わかったブログ」で有名な「かん吉」さんが、作成されたブログパーツです。

1つの商品や施設などの画像に対して「Amazon」「楽天市場」「Yahoo!ショッピング」「7net」などの、複数のショップへのリンクが並んだブログパーツです。

  • ヨメレバ …… おすすめの本・書籍を紹介するブログパーツ
  • カエレバ …… おすすめの商品を紹介するブログパーツ
  • トマレバ …… おすすめの旅館・ホテルを紹介するブログパーツ
  • タベレバ …… おすすめの飲食店を紹介するブログパーツ
わかったブログ
人生は、日々「わかった!」の積み重ね。成功・成長する方法を研究するブログ。毎日走ってます。

カエレバから芋づる式に

以前から、いろんな Webサイトで、ヨメレバ・カエレバ・トマレバのようなブログパーツを見かけていました。

しかし、自分でやってみたいと思っても、はじめ方がまったく判りません。

芋掘り

つい最近、どこかの Webサイトを見ていたときに、たまたま「カエレバ」の存在を知って、そこから芋づる式にたどっていき、ようやく始められました。

とりあえず導入してみましたが

ブログパーツの導入の仕方は、ここで説明するまでもなく、ヨメレバカエレバトマレバ ・タベレバそれぞれのページに詳しく書いてあります。

説明書を読む男性

説明が判りやすいので、何の滞(とどこお)りもなく導入できました。

ただ、表示のデザインが、なかなか決まりません。
ブログパーツを導入したあとも、用意されたデザインを取っ替え引っ替えしてしまいました。

ネットでスタイル定義(CSS)を探す

そういえば以前、リンクの部分がボタンになっているものを、どこかの Webサイトで見かけたことがありました。

インターネット検索

どこかの親切な方が、スタイル定義(CSS)を配布していることを期待して、ネットで検索してみると、やっぱり、親切な方はたくさんいらっしゃいました。

とりあえず、ネットからダウンロードしたスタイル定義(CSS)を自分の環境に導入して、ブログパーツの表示を確認したのち、一旦は終了しました。

睡眠中の男性

やっぱり自分で作ってみよう

夜が明けると、やっぱりブログパーツのデザインが、気になります。

  • モバイル表示にしたとき、「画像小」を使っているため、画像が妙に小さい
  • モバイル表示にしたとき、中央揃えなので、左揃えの自分のサイトに合わない
  • パソコン表示にしたとき、文字とボタンの左揃えが微妙にずれている
日曜大工

ということで、自分でスタイル定義(CSS)を作ってしまいました。

あとがき

ネットで好みのものを探しても、好みのものがあるとは限りません。
自分でスタイル定義(CSS)を作ると、好みのものが作れるので良いですね。

ただ膨大な時間が掛かるので、本当は拾ってくるのが好きです。

コメント

タイトルとURLをコピーしました