看板画像を作る方法
ヤフーショッピングの看板画像をフリーの画像作成ツールを使って作る方法を解説します。フリーが良いと言うわけじゃないんですが、ここを見た「誰もができてしまう」という点でフリーを選んでみました。「そんなにハイクオリティーな看板はいらない。決まったサイズに収まって、必要な情報さえ載せられれば良い。」そんな方にもオススメです。
人気おすすめ無料講座
yahoo! shopping 画像挿入や文字のHTML変換
スマートフォン用サイトの看板やフリースペースの編集
サイドナビを画像に変更する方法
ストアサービスのリンクをボタン画像に変更する方法
このページのメニュー
- (1)素材集めと素材作り
- (2)素材の組み合わせ
- (3)動画1(操作方法について)
- (4)動画2(保存方法について)
- (5)ストアクリエーターProから看板を登録
素材集めの素材作り
まずはどんな看板にするのかを決めないといけません。デザインはどこかのお店を参考にしてもいいですし、載せる内容もそれぞれのお店が決めます。内容が決まったら素材を集めたり作ったりします。今回の看板はサンプルなのでちょっとシンプルです。
デザイン:シンプル
店名:SAMPLE SHOP
キャッチコピー:さんぷる色々楽しいショッピング
送料:送料全国一律500円
送料無料:1万円以上で送料無料
素材作りは、ストアーサービスをボタン画像化したときにボタンメーカーを使います。
素材を組み合わせる
今回素材を並べてみます。9つですね。(ボタンメーカーの使い方は、ストアーサービスをボタン画像化にする)の動画でみてください。背景を白にすれば、ボタンではなく文字だけが作れます。
これらを、さらに無料の画像編集ページで組み合わせます。
使うサイトはここ。
https://pixlr.com/editor/
お店のロゴはStores.jpさんの無料ツールを利用しました。シンプルなロゴの場合は使えそうです。これも動画にしてみました。
動画(操作方法パート1)
まず、看板サイズ950x100のキャンバスを作ります。その上に、用意した素材を配置していきます。看板のサイズはお店によって違うので調整して下さい。
素材は、「レイヤー」→「画像をレイヤーとして開く」から配置します。レイヤーとは、例えば、小学生が図画工作の時間に何かを作るとき、色紙や厚紙を切った状態のままのもので、まだ糊付けされていないパーツのような感じです。糊付けするまでは、レイアウトや大きさを自由に決めることができます。
配置した素材の大きさの変更は「編集」→「自由変形」で手動で変形します。
動画(操作方法パート2)
9つの素材を大きさを考えながらレイアウトしていくのは、なかなか大変だと思いますが、いちど完成すれば、当分変更しなくていいので頑張りましょう(^^)。
ほぼ、完成したとき、あるいは、ある程度完成に近づいてきたときに必ず保存してください。動画の中で2回保存していますが、その1回目のやつです。ファイル形式「.pxd」で保存します(ファイル名は日本語「看板.pxd」で構いません)。そうすることで、次にまた変更を加えたいときに、このファイルを開けば編集ができます。
Jpegや画像などで保存してしまうと次から変更がきかなくなるのでやらないようにしてください。
そして、動画では2回目の保存が、ヤフーショッピングの看板用の保存です。ファイル形式は「.png」で保存しています。これは「.gif」でも「.jpg」でも構いません。お好みでどうぞ。そしてファイル名は必ず、半角英数じにします。例)「kanban.png」日本語にしてしまうとヤフーの看板登録で拒否られます。
ストアクリエーターProで看板を登録
いよいよヤフーストアの看板を登録します。「ストアデザイン」→「ヘッダ・看板」と進んで右側の「看板」をクリックします。下の「参照」ボタンを押して看板を登録します。看板は自動的にお店のトップページにリンクされるのでHTMLの編集もなしでです。
これで貧相な看板は脱出して、ちょっと豪華でリッチな?看板になりました。ちなみに、今回のサンプルを作った人間はデザインにはド素人なので、デザイナーが作るような美しい看板は作れません。デザインセンスのある方は、もっと素敵な看板画像を作ってください。
ヤフーストアのカテゴリをバナー画像に置き換える方法
フリースペースや商品説明はホームページ・ビルダーで効率的に作る
ヤフーストア・トップページ用のテンプレートを作ってみた。
ヤフーショップのヘッダー画像HTMLの編集方法
yahoo! shoppingトップページ用HTMLテンプレート(シンプル版)