質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

Q&A

解決済

2回答

3364閲覧

woocommerceの商品ページエラーについて

peter-

総合スコア12

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

0グッド

0クリップ

投稿2017/05/07 15:11

編集2017/05/07 15:15

現在Business Centerというワードプレスのテーマとwoocommerceプラグインを使ってECサイトを製作中です。

商品登録がひと段落ついて、何気なく商品ページを見てみると
・商品数
・「カートに入れる」
・商品カテゴリー
がクリックできない状況になってしまいました。

エラーが発生しているサンプルページ

ほとんどのページが同じような(クリックできない)状況になってしまいましたが。

不思議な事に、
・レスポンシブ表示にすると問題がない
・一部の商品は問題がない(問題がない商品のページ

といった、問題が生じない条件もあり打開策があるのでは、と頭を抱えております。

プラグインやCSSなど考えられるものは停止したりと、試したのですが直りません。
もはやテーマを変えるしか手がない状況まで追い詰められてしまいました。

もし対応策がわかる方がいらっしゃれば、何卒
お力をいただければ幸いです。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

商品画像部分であるdiv.woocommerce-product-gallery
商品説明部分であるdiv.summary部分は互いにfloatにて左右に回り込んでいます。

本来であればこれら2つを包み込むdiv.productclearfixなどの設定がなされているはずですが、
存在しないのか、あるいは機能していないのかわかりません。

添付画像のように、2つの回り込むブロック要素の直後に
<div style="clear:both;"></div>を入れてみればすぐに効果がわかると思います。
イメージ説明

投稿2017/05/09 07:59

編集2017/05/09 08:01
greenisland

総合スコア20

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

peter-

2017/05/21 07:09

大変コメントが遅くなり申し訳御座いません。こちら他の方をベストアンサーにさせて頂きましたが、コメントをいただき誠にありがとうございました。
guest

0

ベストアンサー

今わかる範囲で書いておきます。

エラーが出ているページと出ていないページでは、「追加情報」という項目のある・なしが関係しているようです。

その追加情報の下に関連商品が掲載されている部分のsectionの部分に、
cssで```
position: relative;

追加情報がないものはそれがページのトップまで効いているようで、ボタンのクリックや数字の入力ができなくなっているようです。 そのCSSをコメントアウトすればいいのでしょうが、 他のデザインとの兼ね合いもあると思うので、 「追加情報」がないページも「追加情報なし」という「追加情報」を入れることによって、 その欄が入るはずなのでクリックできるようになるのではないでしょうか。 うまく説明できませんが、参考まで。

投稿2017/05/08 06:22

8-0_nyan5

総合スコア2352

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

peter-

2017/05/21 07:11

回答が遅くなり大変申し訳ございません。今回は結論解決ができず、テーマを変えて進める事にしました。回答を頂き、ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問