カイモモの商品紹介ブログパーツを使ってみました

商品紹介ブログパーツって使っていなかったけど、プラグイン以外に商品紹介ブログパーツと言えば、カエレバ。超有名ですよね。それぐらいは知ってます。でも、カエレバ以外にも商品紹介ブログパーツってあるんですね。

で、カイモモを使ってみた話です。

スポンサーリンク
スポンサーリンク

カイモモを知ったきっかけ

何故そんなサービスを知ったかと言うと、現在のWordPressテーマがSimplicityなんですけど、コピペカスタマイズのせいか「AMPページのスポンサーリンクの文字位置が変な事になっているなぁー。また、変な事をしてしまったのかな?」ってamp.cssを見ていました。

相変わらず、書いてある内容は難しいんですけど、ずらずら~っと下の方へスクロールすると、とある記述が気になりました。

// 作者: Kaimomo
// ウェブサイト: http://www.kaimomo.com/
// 更新日: 2017年2月12日

「何だこりゃ?カイモモ?」

いつもの様に「スポンサーリンクの件」は忘れて、サイトを覗いてみる事に。

カイモモ商品紹介ブログパーツって?

外部リンク カイモモ | 新アフィリエイターSNS

テーマとなんか関係があるのだろうか?と気になったのでググるしかありません。「カイモモ Simplicity」で検索したら、

あるじゃないかっ!

Simplicity公式 カイモモブログパーツのAMP対応の要望

そういう経緯だったのか、知らなかった。

カイモモ商品紹介ブログパーツを作成

早速、試しにブログパーツを作ってみました。最近、折りたたみ自転車が欲しいんですが、この自転車って約37万円?めっちゃ高いやんか!しかも、22段変速って凄すぎる!

カイモモのカスタマイズ用CSS

ブログパーツを作成して、コピペ用のコードの下にあるカイモモのカスタマイズ用CSSをダウンロードしてみると、

.kaimomo-item {
  zoom: 1;
  overflow: hidden;
}
.kaimomo-left {
  vertical-align: middle;
  display: table-cell;
  padding-right: 10px;
  margin-bottom: 15px;
}
.kaimomo-link {}
.kaimomo-img {
  max-width: none;
}
.kaimomo-right {
  vertical-align: middle;
  display: table-cell;
  zoom: 1;
  overflow: hidden;
  margin-bottom: 15px;
}
.kaimomo-title {
  margin: 0;
}
.kaimomo-title-link {}
.kaimomo-details {
  list-style: none;
  padding: 0;
  margin: 0 0 5px 0;
}
.kaimomo-detail-author {}
.kaimomo-detail-manufacturer {}
.kaimomo-detail-publication-date {}
.kaimomo-links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.kaimomo-link-amazon{}
.kaimomo-link-rakuten{}

やっぱり、難しいです。なので、Simplicityの親テーマからコピペしました。

現在利用中のカイモモ用CSS

Simplicityの親テーマの中のamp.css内にあるコードの一部をスタイルシートへコピペしてみました。

.kaimomo-item {
  zoom: 1;
  overflow: hidden;
  padding: 15px;
  border: medium double #e4e4e4;
}
.kaimomo-left {
  vertical-align: middle;
  float:left;
  padding-right: 10px;
  margin-bottom: 15px;
}
.kaimomo-link {}
.kaimomo-img {
  max-width: none;
}
.kaimomo-right {
  vertical-align: middle;
  zoom: 1;
  margin-bottom: 15px;
}
.kaimomo-title {
  margin: 0;
}
.kaimomo-title-link {
  text-decoration: none;
}
.kaimomo-brand {
  margin: 0 0 5px;
}
.kaimomo-brand small {
  font-size: 85%;
}
.kaimomo-brand small a {
  font-size: 85%;
}
.kaimomo-details {
  list-style: none;
  padding: 0;
  margin: 0 0 5px;
  font-size: 85%;
}
.kaimomo-detail-manufacturer {}
.kaimomo-links {
  display:block;
  list-style: none;
  padding: 0;
  margin: 0;
}

まぁいいか、これで。

さいごに

色んな紹介パーツがあるんですね。使い方は説明も不要なぐらい凄く簡単でした。

ただ、よく分らないのが、サイト名やIDを入力して保存しているはずやのに、次回は設定が保存出来ていないから、また入力が必要になるって、使い方が悪いのかな?

「AMPページのスポンサーリンクの文字位置」の件は、ひとまず解決したからいいとして。

「カイモモ」をちょっと使ってみたかった!って話でした。

追記

後日、直々にご連絡戴き有難うございました。