解説ショップできすぎくんで自作画像を利用する方法

このエントリーをはてなブックマークに追加

お店が作れるようになると次にやりたくなるのが

自作した画像を使うこと。

かもしれません。(笑)

実は先日、ショップできすぎくんに自作した画像を挿入する方法を

お問い合わせいただきました。


原則、操作方法にはお答えしていないのですが、

今日は特別に画像の挿入方法についてご紹介してみようと思います。


まあ、なんで普段無料では答えないかと言えば、大変過ぎるからです。はい。

さて、まず本題に入るまえに

ウェブページについての知識について再確認しておきます。


たぶん、この辺を知っているとトラブルになったとき、

訳が分からんということも少なくなるかと思いますので。


■ ウェブページを構成する3つのファイル


あなたが普段見ているウェブページは、

大きく分けて次の3つのファイルで構成されています。


・ウェブページ(HTMLファイル)
・スタイルシート(CSSファイル)
・画像ファイル(gif, jpgなどのファイル)


これらのファイルはあなたのパソコンの中にあるだけでは、

他の人から見ることができません。


インターネット上にあるサーバー(コンピュータ)に上記ファイルを

置く(アップロードする)必要があるのです。


このサーバーにファイルが設置されることで、ほかの人は初めて

あなたのウェブページを見ることができるのです。

ここまでは良いですか?

では次に行きます。


■URLとフォルダの関係


URLというのは、http:// で始めるウェブページのアドレスのことですね。


わたしのブログで言えば

http://www.dsx101.com/

が URL になります。


このウェブページのファイルがどこにあるかと言えば、

わたしが借りているサーバーのフォルダ(ディレクトリ)の中にあるんですね。


もしロリポップというレンタルサーバーであれば、

/home/users/(***)/(アカウント名)/web/www.dsx101.com

という場所を割り当てることになります。

で、ここを覚えておいてほしいのですが、

何だか小難しく見えるウェブページも、実は単に http://www.dsx101.com/

という URL にアクセスがあったら、

/home/users/(***)/(アカウント名)/web/www.dsx101.com

というフォルダの中にあるHTMLファイルを表示するというだけのことなのです。


フォルダのパス(アドレス)がむずかしく感じさせてしまうかもしれませんが、

要はURLは

 <特定のフォルダ>の中身が
 
表示されているだけということなのです。

では次に行きましょう。


■画像ファイルをアップロードする先

さて、ここからが実際の作業です。


ショップできすぎくんで自作した画像を表示させるには、

どこかにあなたが作成した画像をアップロードしておく必要があります。


どこが良いのか、そこが問題なのですが、それぞれ適当な場所は次のとおりです。


忍者HPを使っているなら、忍者HP

独自ドメインを利用しているなら、独自ドメインで使っているレンタルサーバー

もしものディレクトリなら、他のレンタルサーバー


さて、次です。

■FTPソフトを使って画像をアップロードする


画像をアップする先が分かったら、次は実際にアップロードする作業です。

画像をアップする方法には、それぞれのサービスで提供されている

ウェブ管理ツールを利用するか、FTPソフトを利用することになります。


が、

おすすめは、断然FTPソフト。


理由は一度使い方を覚えてしまえば、

 <どんなレンタルサーバーでも使えるようになる> からです。


FTPソフトには、いくつかありますが、

FFFTPがおすすめ。

圧倒的なシェアがあって使い方の説明ページも充実しているからです。

過去、ウィルスの標的にされたことがありますが最新版を使えば大丈夫です。

さて、画像のアップについてはそれぞれのヘルプページに譲ります。

忍者HP
http://www.ninja.co.jp/hp/help/manual/4590/
ロリポップ
http://lolipop.jp/manual/hp/w-ff-ftps/

どうです?

アップロードまで出来ましたか?


では、実際にアップロードできたか一度確認してみましょう。


■画像が表示されるか確認する


例えば、http://www.dsx101.com/ というドメインのフォルダに

画像をアップロードしたのなら、ブラウザ(インターネットエクスプローラー)

のURL欄に http://www.dsx101.com/(自作した画像のファイル名)と

打ち込んでみてください。


自作した画像ファイル名が test.jpg なら

http://www.dsx101.com/test.jpg

で表示されるはずです。


もし表示されないなら、打ち込んだ文字が合っているか、

ファイル名の大文字、小文字が合っているかを確認してみましょう。


ウェブの世界(正確な説明ではない)では、大文字と小文字は別ものとして

扱われることに注意してください。

ありがちなのが、jpg と JPG という画像の種別を表す部分の間違いです。

画像が表示されたら、ゴールはもう目の前です。(笑)


■ショップできすぎくんに自作した画像を挿入する

最後の仕上げは、ショップできすぎくんに画像のタグを挿入することです。

操作方法は次の動画が参考になります。

http://www.youtube.com/watch?v=ollnqsQZSZE

2:00くらいから説明があります。

[画像のURLを入力してください。]欄に

先ほどテストした画像のURLを入力してください。


これで設定は完了です。


できるだけ分かりやすくと思ったのですが、

どうでしょう。

説明があると返ってむずかしく感じてしまうかも。


でも、この辺の話を理解していると、

ほんとうに応用が利くようになるので、覚えておいてほしい内容です。

ではでは、また次回!

差し上げます!

ノウハウをギッシリ詰め込んだ冊子

ドロップシッピングのノウハウをまとめたレポートをプレゼント。最新ノウハウもお届け中。詳しくはこちら↑↑

関連記事