通販ショップを始めよう。現役店長が教える開業運営きほんのきほん

HTML入門 その1

HTML入門

ヤフーストア作成で使うHTMLは、実に少なく、許可されてるタグ(<b>とか<a>とかのこと)は全部で61個です。その中で、必要のないものを除くと、わずか15個だけになってしまいます。

たったの15個覚えるだけでストアページ作成のための基礎ができるわけですから、この際、つべこべ言わずに覚えてしまいましょう。今回は、HTML入門の第1弾。簡単なタグを5つだけピックアップしました。

人気おすすめ無料講座
youtube-logo yahoo! shopping 画像挿入や文字のHTML変換
youtube-logo スマートフォン用サイトの看板やフリースペースの編集
youtube-logo ヤフーストアの看板画像を作る方法
youtube-logo サイドナビを画像に変更する方法
youtube-logo ストアサービスのリンクをボタン画像に変更する方法

このページのメニュー

  • (1)<A>(リンクを貼る)
  • (2)<B>(文字を強調する)
  • (3)<br>(改行する)
  • (4)<center>(文字や画像をセンタリングする)
  • (5)<font>(文字に色をつける)

※ネットショプ成功事例無料パンフレット配布中


<A> リンクを貼る

ヤフーストアに存在するのは、「ページ」と「画像」だけです。そして、ページにも画像にもURLがあります。URLとは「http://~~~」という形式のアドレスです。トップページのフリースペースからカテゴリーのページにリンクを貼ったり、商品Aのページ内にオススメ商品Bのページへリンクを貼ったりします。

【書き方】
<a href="http://netshop7.com/make/index.shtml">作り方</a>

※必ず<a>~</a>のセットで書くこと。

<b> 文字を強調する

「このVRゴーグルは最新型です。」というふうに太文字にすることができます。<strong>も、全く同じ見え方になります。基本的にどちらを使っても構いません。

【書き方】
<b>VRゴーグル</b>

<br> 改行する

テキストを改行することができます。

【書き方】
改行しする箇所で使います。<br>←ここで改行。単品で使う。

<center> センタリングする

文字や画像を真ん中に寄せたいときに使います。

【書き方】
<center>こんにちは。<br>
店長の山崎響です。<br>
新入荷のトマトはおいしいよ。<br>
</center>

※必ず<center>~</center>で、センタリングしたいモノをはさみます。
↓のように表示されます。

こんにちは。
店長の山崎響です。
新入荷のトマトはおいしいよ。

【画像の場合】
<center><img src="http://~~/tomato.jpg"></center>
↓のように表示されます。(※スマホでは画面いっぱいになります。)

トマト

<font> 文字に色を付ける、大きさを変える

テキスト文字に色を付けたり、文字の大きさを変えることができます。

【書き方(色を付ける】
<font color="red">おれは怒ってんだ(#゚Д゚)!</font>

おれは怒ってんだ(#゚Д゚)!

※必ず<font>~</font>のセットで書くこと。「color="○"」ここには、red、yellow、brown、blueなどの英単語以外にカラーコード「#ff0000(赤)」「#ffff00(黄色)」「#CC6600(茶色)」なども書くことができます。コードを入力する場合は必ず「#(シャープ)」をつけます。

【書き方 (大きさを変える)】
<font color="+3">ちょっと大きく</font>

ちょっとおおきく


開業予定者にオススメ

ショップサーブ資料請求

↑ PAGE TOP