カラーミーショップでは「入力支援ツール」という機能があるのをご存知でしょうか。
HTMLがわからない人でも入力支援ツールで編集することで、商品説明やフリースペースなどをわかりやすく魅力的にみせることができます。
※閲覧いただく環境やタイミング等によっては、情報が異なる場合がございます。ご了承ください。
カラーミーショップ・入力支援ツールとは？
入力支援ツールを使うと、HTMLがわからない人でも「文字色を変えたり」「画像を挿入したり」といったことが容易にできます。
例えば、以下のイメージは入力支援ツールを活用した商品説明です。
下記のことを入力支援ツールでおこなっています。
- 文字を太字に
- 段落を使って文章を入力
- 画像を挿入
- 文字の色を変える
- 文字に下線を入れる
これらのことをツールを使用せず行おうとすると、「<p>」「<img>」「<u>」タグなどのHTMLを直接記述しないといけません。
HTMLに慣れていない初心者の方にとっては、抵抗がありますよね。
入力支援ツールを活用することで、上記のようなことが簡単におこなえるので、初心者の方にはおすすめのツールです。
入力支援ツールを活用・商品説明をよりわかりやすく伝えよう
商品説明は商品を購入してもらうための大事な要素のひとつです。
文章だけを羅列してしまうと、読まれづらい傾向にあるため工夫する必要があります。
以下のイメージは、前項の内容にプラスしたものです。
※使用しているテンプレート等によって、見え方は異なります。
入力支援ツールでは、画像を左右に挿入することもできます。
また、リンクも設定できるので関連商品などを商品説明内で紹介することも可能です。
ショップに訪れる訪問者のことを常に意識して、読みやすくわかりやすい商品説明を心がけましょう。
以降では、入力支援ツールの使い方について触れてみたいと思います。
カラーミーショップ・入力支援ツールの使い方
カラーミーショップの入力支援ツールにはマニュアルが用意されているので、比較的簡単に使用できるかと思いますが、今回はいくつかを例にあげて「入力支援ツールの使い方」をご紹介します。
商品説明で入力支援ツールを活用しよう
商品説明を入力する際、「入力支援ツールで編集」をクリックします。
入力支援ツールが表示されるので、「入力支援ボタンの使い方を見る」を確認し適宜おこなっていきましょう。
段落を使う場合
文章を入力したら、範囲選択し「段落」ボタンをクリックします。
段落（P）は、文章のひとかたまりを表します。
また、Pタグを使うことで、前後に余白が空く（使用しているテンプレートにもよる）ので、文章がみやすく整うといった利点もあります。
文字色を変える
文字色を変えたい箇所を範囲選択し「文字色」から色を選択します。
カラーパレットから、様々な色が選べるので試してみてください。
文字を太字にする
太字にしたい箇所を範囲選択し「太字」ボタンをクリックします。
シンプルに装飾を施したいなら、太字はとても便利です。
画像を挿入する
画像を挿入する場合は、挿入したい場所で「画像」ボタンをクリックします。
画像ファイル管理が表示されると思うので、ファイルをアップロードするか、アップロードされているファイル一覧から画像を選択します。
画像を選択したら、画像説明に代替テキストを入力して「追加」ボタンをクリックします。
もし、画像を右寄せなどにしたい場合は、「回り込み」から「画像を右寄せ」にして追加しましょう。
リンク先を設定する場合
リンクしたい箇所を範囲選択し「リンク」ボタンをクリックします。
リンク先のURLを入力するエリアが表示されるので、URLを入力後、設定を押します。
「別ウィンドウで開く」は、基本的に外部サイトなどのリンク先を設定する時に使います。
入力支援ツールを使う上で気を付けたいこと
カラーミーショップの入力支援ツールは、とても便利な機能で初心者さんには重宝するかと思いますが、以下の点に注意が必要です。
- 簡易的な設定しかできない
- HTMLの重複や閉じタグに気を付ける
より細かな見せ方（例えば、画像を左右に並べて表示・表を作成など）をしたい場合は、入力支援ツールでは現状難しいため、別の方法を考える必要があります。
また使い方次第では、HTMLが同じ箇所で重複してしまったり、誤って閉じタグを削除してしまったり、などが起こりえます。
そういった不備等をそのままにしてしまうと、表示崩れを起こす原因になってしまいますので、注意が必要です。
HTMLの基本知識はあると便利です
カラーミーショップの便利な機能のひとつでもある「入力支援ツール」をご紹介してきました。
ツールは使うためにあるので、どんどん活用して頂ければと思いますが、前項でお話した通り注意点もあります。
特に閉じタグなどのミスは、表示崩れの原因になりかねませんので、ネットショップを運営する上では気をつけなくてはいけません。
そういった意味では、基本的なHTMLの知識があれば、ミスを防ぐことにも繋がりますので身に付けておくことをおすすめいたします。
