目次
こんばんは、神谷です。
「もしもドロップしピングで売上100万円を目指せ」講座です。
昨日は、どろっぷしっぴんぐ研究所の対面講座でLPOについての勉強をしました。
できすぎくんの画像にリンクが貼ってあってもリンクということがよくわからない
その勉強が終わっていいろいろ講座の内容を思い返した時、
「画像にリンクが張ってあっても、それがリンクだと分からないから、クリックしてくれない」
という話を考えていました。
その時の対策としては、画像内に、
『クリック』
という文字を入れるという話が出たのです。
↑↑↑↑
こんな感じ
以前に、その手法を使ったことがあるのですが、それだと、画像を編集しなくちゃいけないので、どうも面倒。
画像処理自体も面倒だし、画像に画像を重ねるので、色合いなど結構デザインにも気を使います。
もっと簡単な方法はないかなぁ・・・。
と思って考え付いたことがありました。
画像に単にリンクを貼っているだけだと、カーソルが手のアイコンになるなどで分かるくらいですよね(カーソルのカスタマイズをしている方はその限りではないですが)。
しかし、リンクが貼ってある画像にカーソルが重なると、画僧が動くようにすれば、それがリンクが貼ってあることがよくわかりますよね。
結構メジャーな手法ですが、それを
『もしもドロップシッピングのショップできすぎくんでやってみましょう』
という事です。
ショップできすぎくんのカスタマイズとしては、中上級者レベルなんですが、
■ レンタルサーバーを借りていて
■ レンタルサーバーに画像を保存して
■ それをできすぎくんで表示したことのある方
なら、超簡単。
ホンの、15分でできてしまうテクニックです。
CSSファイルを作る
CSSと聞いたところであきらめてしまいそうですよね。
私もCSSと聞いた瞬間「もうできない」という感じなんですが、今回は、CSSというキーワードを考えず、これから書いてあることをそのまま実行しましょう。
このCSSファイル、1回作ったら、すべてのできすぎくんのショップで使用可能ですから、とっても便利です。
メモ帳をでファイルを作る
テキストエディター、
代表は、メモ帳ですが、それで、
「moshimo_dekisugi.css」
という名前のファイルを作りましょう。
画像を動かすCSSを書く
作成した、「moshimo_dekisugi.css」の中に、下記をコピペしてください。
div.img-move a:hover {
position: relative;
top: 5px;
left: 5px;
}
そして保存してください。
サーバーにアップ
できすぎくんで使う画像をレンタルサーバーにアップするのと同じ方法で、適当なフォルダ名・・・例えば、「CSS」というフォルダをレンタルサーバの中に作って、「moshimo_dekisugi.css」をアップロードしましょう。
ショップできすぎくんにCSSファイルを登録
できすぎくんの
「設定」→「ショップデザイン設定」→「拡張設定」→「オリジナルCSS URL」
に、先ほど、レンタルサーバにアップロードした「moshimo_dekisugi.css」の絶対パスを記入してください。
ショップできすぎくんの画像を動かすコーディングをする。
そして、できすぎくんのショップの中でカーソルが画像の上に来たら動かしたい画像の前後に、
<div class="img-move"> ~ </div>
で、囲えば完成です。
サンブルサイトとして、
『ハローミップ(Hello! MiP) オムニボットシリーズ通販』をご紹介します。
左サイドバーの『ハローズーマー』と『ロビジュニア』の画像が、マウスカーソルと乗せると動くはずです。
※ショップの変更をしていたらこの限りではありません。
いかがでしょうか、これなら画像リンクのクリック率も上がるんじゃないかと思います。
ある程度集客ができているのに、ショップの回遊率が今一つ低いという方にはおススメの手法です。
※ 読者さんから情報を頂きました。この手法、できすぎくんの画像アップロード機能を使った画像には使えないそうです。
ドロップシッピングで痒い所に手が届く様なスキルを学ぶことのできる場所はココです。
もしもドロップシッピングで、稼ぎたいなら、稼ぐ方法を学ぶのが早道です。 研究生制度(ドロップシッピング3カ月集中講座)で、みっちり学んでみましょう。
現在、私も研究生5期目です。ここで学んでプラチナクラスになりました。
申込み時に
RLVG64C5
を入力すると、受講料が割引になります。
使ってくださいね!!