「もしも・かんたんリンク」のボタンがスマホで押せない!?

「もしも・かんたんリンク」のボタンがスマホで押せない!?
Amazonのリンクボタンだけ押せない。。。
スポンサーリンク

もしもアフィリエイトのかんたんリンクのボタンがスマホだけ押せない

もしもアフィリエイトのかんたんリンクのボタンがスマホだけ押せない
PCではOK。。。なんでスマホだけ。。。

かんたんリンクは、もしもアフィリエイトのツールで、Amazonや楽天、yahoo!ショッピングといった大手ECサイトの商品を簡単に紹介することができます。

◆ASPのススメ◆
ブロガーさんで登録がまだなASPがあれば即登録をおすすめします。5~10分で無料登録可能です。
がんばる個人のための「もしもアフィリエイト」
バリューコマース
A8.netの申し込みページはこちら

Amazonアソシエイトの審査規格が変更になり、物販をかんたんリンクで行っているブロガーさんもさらに増えたのではないでしょうか。
Amazonアソシエイト審査の「180日メール」についてCocoon(コクーン)ユーザーが解説

今回は、そんな「かんたんリンク」で困ったことがありました。

もしも・かんたんリンクのAmazonボタンがスマホページで反応しない

もしも・かんたんリンクのAmazonボタンがスマホページで反応しない

当ブログがお世話になっているもしもアフィリエイトのかんたんリンクに、

スマホページでAmazonのリンクボタンをタップしてもリンク先に飛べない

という問題が発生。

ag
ag

いや致命的!!

かんたんリンクの不具合関係でググっても、

「かんたんリンクが表示されない」系の記事が上位を埋め尽くしていて解決できない。。。

しかしあまりに大きな問題なので、調べました。

ag
ag

結果解決したので、同じように困っている方のために記事にしておきますね!

PCで記事を書くブロガーさん、記事公開後のかんたんリンクの動作チェックをスマホページでもしていますか?
スマホ版だけリンクボタンが反応しないという現象は確かに存在します。
機会損失を防ぐためにも、一度自サイトのチェックを推奨します。

もしもアフィリエイトのかんたんリンクのボタンが押せない原因はかんたんリンクのCSSカスタマイズだった

もしもアフィリエイトのかんたんリンクのボタンが押せない原因はかんたんリンクのCSSカスタマイズだった

なんだかんだ調べているうちに、最近かんたんリンクの見た目を変更するためにCSSをカスタマイズしたことを思い出しました。

ag
ag

このCSSが原因では。。。?

かんたんリンクのCSSを一旦削除

と、いうわけで、もしもアフィリエイトのかんたんリンクのCSSを削除したところ、

バッチリ問題解決しました。

Amazon、楽天、yahooショッピング全てのボタンが反応してくれるようになりました。

ただ、CSSを削除したので、デフォルトの見た目に戻ってしまいました。

もしもアフィリエイトのかんたんリンクのCSSを削除

スマホ版のかんたんリンクのデフォルトの見た目はあまりに大きく、、、さらにボタン色が同一でオシャレ感が足りません。。。

機能に致命的な問題があるよりも、見た目が多少不格好である方がマシではあるのですが、

やはり見た目にも気を配りたいので、まともに動くおしゃれCSSを探しました。

かんたんリンクのCSSを差し替え

結果からいくと、EARN LIFEさんのCSSをそのままコピペさせていただきました。

当ブログの環境ではオシャレに問題なく動作してくれています。ありがとうございます。

◆以下コピペ用CSS◆

コピーして、外観→テーマエディター/スタイルシート (style.css)の現在問題を起こしているもしも・かんたんリンクのCSSを差し替えましょう。

div.easyLink-box {	
	border:3px double#CCC !important; 	
	box-shadow: 2px 3px 9px -5px rgba(0,0,0,.25);}
div.easyLink-box.easyLink-size-s div.easyLink-info p.easyLink-info-name  {
    margin:15px 2px 0 0!important;
    text-align:center !important;
	font-size: 14px !important;}
p.easyLink-info-model {
display: none !important;}
.easyLink-info-btn { 
	display: inline!important;} .easyLink-info-btn a{
		margin: 5px 10px 5px 0!important; 	padding: 0 12px!important;
		line-height: 28px!important; 	
		display: inline-block!important;
		width: 100%!important; 
		box-shadow: 0 8px 15px -5px rgba(0, 0, 0, 0.25)!important; 	
		font-size: 0.9em!important; } .easyLink-info-btn-amazon{ 	
		background:#ffb36b!important; } .easyLink-info-btn-rakuten{ 
		background:#ea7373!important; } .easyLink-info-btn-yahoo{ 	
		background:#73c1ea!important; } 

div.easyLink-box div.easyLink-img,
div.easyLink-box div.easyLink-img
p.easyLink-img-box,
div.easyLink-box div.easyLink-img
p.easyLink-img-box img.easyLink-img-pht{
max-width: 300px !important;
max-height: 130px !important;}

@media screen and (max-width: 480px){ 
	div.easyLink-box div.easyLink-info p.easyLink-info-btn a { 	
		width: 100%!important; 	
      position: relative; 	} 	
	.easyLink-info-btn a:before { 		padding-right: 5px; 
		right: 5px; 	
position: absolute;		 
	} }

@media screen and (max-width: 480px){
div.easyLink-box.easyLink-size-s {
max-width: 340px !important;
}}

変更を保存したら、PC、スマホの両方で押せないリンクボタンがないか確認しましょう。

ag
ag

動作確認!大事!できた!

もしもアフィリエイトのかんたんリンクのボタンがスマホだけ押せないときのまとめ

もしもアフィリエイトのかんたんリンクのボタンがスマホだけ押せないときのまとめ
焦らずに原因究明!

かんたんリンクのボタンが反応しない問題の原因は、CSSのカスタマイズにありましたよというハナシでした。

PCで作業するブロガーはスマホ側の動作確認が疎かになりがちです。

今回のように、スマホ側固有の問題も起こりえますので、こまめなチェックをおすすめします。

◆バリューコマースのススメ◆

もしも・かんたんリンクは物販アフィリエイトに非常に便利です。

実は、バリューコマースにも、「MyLinkBox」というかんたんリンクと同じようなツールがあります。

選択肢は多いに越したことはないので、バリューコマースの無料登録がまだの方は、

「MyLinkBox」を使える準備をするのはいかがでしょうか。

登録は無料です。

その他のASPもこちらからチェックしてください。登録必須レベルのASPです。

コメント

  1. kj より:

    コメント失礼します

    私の場合、PCからだとクリック出来ません

    右クリック→開く  という操作だと開きますが、左クリック一発だけだとダメです

    どのような原因が考えられますか?

    cssでデザインを変更などはしてません

    • ag(あぐ) ag(あぐ) より:

      kjさん

      コメントありがとうございます!

      自分が遭遇したことのない不具合なので大したことは言えませんが、複数のリンクすべてで同症状なのですよね?私なら

      ①テーマの機能との相性
      ②プラグインとの相性の問題

      をまず疑います。

      一旦テーマやプラグイン関係を止めて確認して絞り込んでいくのが最初のステップかと思います。

      最初からだめなのか、ある時点からダメになったのか。。。とか思い出すのも解決のヒントになるかと思います。

      お力になれると幸いです!

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