今までのお仕事履歴 & まったりお仕事募集中♪

【ひとかぶIPO対応】SBIネオモバイル証券口座を開設して、高配当株を買ってみた【初心者おすすめ】

【カード資産貧弱】蒸気と暗闇の塔を私的に攻略してみた! シリーズ【ハイスコア攻略もがんばってるよ】

【転職・就活】独立系? メーカー系? エンジニア(ソフトウェア開発)はどっちが良い?【ユーザー系もちょこっと】

【おすすめ】実際に使ってみた白髪隠し6選レビュー【1本2本のちょろりとした白髪に】

商品リンク【ポチップ】で外部リンクのアイコンを消す方法

ブログ関連
スポンサーリンク

以前はカエレバを使っていたが、色々と使いにくい部分が増えたため、ぼちぼちポチップへ乗り換えつつある。

  • 見た目はカエレバやRinker(リンカー)とおんなじ雰囲気
  • AmazonのPA-APIなしで商品検索を行える補助プラグインがある(これ便利!)
  • カエレバから1クリックで乗り換えられる補助プラグインもある(DBがSQLiteだと動作しない。詳細は後述する)

なんと言っても、PA-APIなしで商品検索できるのがとても有難い。

カエレバから乗り換えた際、ちょっとカスタムした部分についてをピンポイントで記載しておく。

ちなみに自ブログのスペックはこんな感じである。

  • スキンはCocoon
  • DBはSQLite使い(ポチップ補助プラグインの「ポチレバ」が使えないかもしれない)

ちなみに私は、Webデザイナーではないのでコードは「こんな感じかな?」と適当である。無駄なコードもきっとあるだろう。使用する時は自己責任で。

スポンサーリンク

ポチップの商品リンクボタンから、Cocoonの外部リンクのアイコンを消す方法

cocoonの外部リンクのアイコンがあると不恰好だな~

結論からいうと、cocoon childのスタイルシート(style.css)に以下の記述を追記すれば良い。

/* ポチップ内外部リンクアイコンなし */
 div.pochipp-box__btns a[target="_blank"]>span:last-of-type {
     display: none;
 }

少しだけコード説明すると、ポチップの商品リンク(pochipp-box__btns)内のリンクが張られている箇所(a[target=”_blank”])のspanタグの一番最後のみの表示を、非表示にするという感じだと思う。

外部リンクアイコンが消えて、すっきりした

キモは「last-of-type」のところで、この指定を入れないとポチップ内の文字表示が全部、消える。

ちゃんとは見てないけど、spanタグで全部囲っているのかな?

とりあえずこれで商品リンクボタンから外部リンクのアイコンの表示は消える。

商品名部分のアイコンは残っている

商品名の外部リンクアイコンを消したい場合は、div後の指定を商品名に該当するものに変更すればイケるとは思うが、私はやっていない。

(その内、やるかもしれないが未定である)

DBがSQLiteだと、補助プラグインの「ポチレバ」が使えない……?

ポチレバは、カエレバリンクをポチップリンクに一発で変換してくれる超便利な補助プラグアインだ。

いきなりやるの怖いな~と思って、サブサイトで実験したところ、私の場合はまったく置換されなかったのだ。

恐らく、原因はSQLiteなんじゃないかなと睨んでいる。ポチレバはどうもデータベースを直接変換しているようなので……。

おとなしく手動で直すことにする。そろそろ観念して、MySQLを使えるサーバに乗り換えようかしら。

けど、やっぱり運用コストが安いのよね。ぶっちゃけ、そこまでアクセスもないうちはこれで十分なのだよ。

コメント