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

【質の良い無料コンテンツ紹介】

【ブラックレーベル】謎解き特集!【SCRAPゲームブック】

【通信制大学】産業能率大学に三年次編入しました

【悲報】ジュニアNISAで、買い付け口座を間違えていた話【NISA預りと特定預りは違うのよ】

当サイトではアフィリエイト広告を利用して商品を紹介しています。

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

ブログ関連

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

  • 見た目はカエレバや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を使えるサーバに乗り換えようかしら。

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

コメント