商品ページ作成について

Question

いつもお世話になっております。
画像のような表？をHTMLコードで作成したいのですがご教授いただきたいです。
参考URLを報告から送信させていただきます。###HR######IMG0fb6f919bbb2ed87929ee42809bbd5a48.pngIMG0###

Answer

ECマスターズの田中です。

いただいた画像の表は、下記のようなHTMLにて作成されております（一部修正を加えております）。



左列の内容
右列の内容

Answer

ありがとうございます。やってみます。

Answer

すみません、文字が改行されてしまうのはどうしたら直りますか??###HR######IMG038fdbcd5f0ec1e1ef19b74bf3dca3734.jpegIMG0###

Answer

あとすみません。先ほどのtableをスマートフォン用商品説明文にいれたいのですが
スマートフォン用商品説明文に許可されないHTMLタグ"table"の"style"属性が入力されています。
とエラーが出ます。
【報告する】から参考STOREさんの商品ページを送らせていただきます。
参考STOREさんのような、スマホでも表示できる表を作りたいです。
宜しくお願い致します。

Answer

ECマスターズの田中です。

いただいた商品ページ、スマートフォン用の表は
下記のようなHTMLとなっております。
PC用の表はまた異なるHTMLとなっておりますが、
スタイルシートが必要で、そのままスマートフォンにはご利用いただけないので、
取り急ぎ、PC/スマートフォン、両方でご利用いただける下記表のみご案内いたします。


	商品情報
	
		左列の内容
		右列の内容

Answer

ありがとうございます。こちらYahooやauペイマーケットでも使用できますか??

Answer

ECマスターズの伊藤です。

> こちらYahooやauペイマーケットでも使用できますか??

記載したい箇所により異なってまいりますので、

Yahoo：スマートフォン用フリースペース

のように
どちらに記載されたいか、詳細をお知らせいただけますでしょうか。

Answer

Yahoo!は
商品情報
検索対象PCスマホ共通 箇所

auペイマーケット
商品説明（共通）


スマホ、PC共通で表示される箇所が希望です

Answer

ECマスターズの土屋です。

>Yahoo!は
>商品情報
>検索対象PCスマホ共通 箇所

商品詳細情報にはHTMLの入力が不可になっているため
こちらの入力欄にHTMLを入力することは出来かねます。
https://ec-masters.gyazo.com/7dafbdebeb2c4da9cdfa2c944304f66d

もし仮に入力されてしまいますと以下の様に表示されてしまいますので
ご注意下さい。
https://ec-masters.gyazo.com/c3d1647e9f72caf792e9d39e96c4b955

>auペイマーケット
>商品説明（共通）

商品説明欄に仕様出来るタグが決まっておりますので
tableタグを仕様することは出来かねます。
https://ec-masters.gyazo.com/49295bcf993f53b6ea5cd89f292f6fa3

sp用商品説明欄とPC用商品説明欄には「仕様出来ないHTMLタグ」に指定が無いため
こちらは仕様することが出来ます。
https://ec-masters.gyazo.com/324fa4e9d6db010a708413062cd2aefc

Answer

ご教授ありがとうございます。

Yahoo!でPC.スマホに表示させるには、ごの箇所に入れたらいいでしょうか??

Answer

Yahoo!で商品説明、スマートフォン用フリースペースに入れてみました。
PCではキャプチャ画像のように枠線が消えてしまい、
スマホでは枠線が極太になってしまいました。
ちなみにECマスターズのスマホ比較ツールでは[機能上表示できません]と表示され、確認できないようです。。###HR######IMG0c918fe6447dd0e5d69792ef6b263b97a.jpegIMG0### ###IMG1eba267d34dce6c0e3a68428474227ce7.jpegIMG1###

Answer

ECマスターズの土屋です。

>Yahoo!で商品説明、スマートフォン用フリースペースに入れてみました。
>PCではキャプチャ画像のように枠線が消えてしまい、
>スマホでは枠線が極太になってしまいました。
>ちなみにECマスターズのスマホ比較ツールでは[機能上表示できません]と表示され、確認できないようです。。

枠線はテーブルタグにborder属性を追加していただきますと、枠線が表示されると思われます。
例)

スマートフォン画面で確認する方法ですが、拡張機能の代わりに開発者ツールを
利用する事もおすすめします。

手順1
スマホ画面で確認したい画面で右クリック。
検証をクリックしていただきます。
https://ec-masters.gyazo.com/10f5fc366332e95b792d869e748a85f9

手順2
スマートフォンマークをクリック
https://ec-masters.gyazo.com/af932f55fb33a80995b9a1b7ab99c0c5

手順3
サイズをクリックしていただきますと、お好みの解像度で確認することが出来ます。
https://ec-masters.gyazo.com/b869bda1665c6b271aa1aa1e4355ea08