The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.
 
 
Thread Tools Display Modes
  #1  
Old 03-20-2014, 10:16 PM
Dom Goor1's Avatar
Dom Goor1 is offline
 
Join Date: Oct 2013
Posts: 24
Default

No single widget product options showing up on web page


I am creating a new web page and putting in that web page my single widget product

here is the code

src="http://app.ecwid.com/script.js?2675204" charset="utf-8"></script>
<div class="ecwid ecwid-SingleProduct ecwid-Product ecwid-Product-29124450" itemscope itemtype="http://schema.org/Product" data-single-product-id="29124450">
<div itemprop="options"></div>
<div itemprop="addtobag"></div>
</div>
<script type="text/javascript">xSingleProduct()</script>

The problem is when I open the webpage the single widget product options does not appear there is just a blank page. here is a link to a page so you can see what I mean

https://domgoorshop.com/Dom-Goor-Sho...

Once again any help would be appreciated
  #2  
Old 03-21-2014, 02:30 AM
Maya's Avatar
Maya Maya is offline
Ecwid Team
 
Join Date: Feb 2010
Location: Ecwid headquarter
Posts: 5,876
Default

Quote:
Originally Posted by Dom Goor1 View Post
I am creating a new web page and putting in that web page my single widget product

here is the code

src="http://app.ecwid.com/script.js?2675204" charset="utf-8"></script>
<div class="ecwid ecwid-SingleProduct ecwid-Product ecwid-Product-29124450" itemscope itemtype="http://schema.org/Product" data-single-product-id="29124450">
<div itemprop="options"></div>
<div itemprop="addtobag"></div>
</div>
<script type="text/javascript">xSingleProduct()</script>

The problem is when I open the webpage the single widget product options does not appear there is just a blank page. here is a link to a page so you can see what I mean

https://domgoorshop.com/Dom-Goor-Sho...

Once again any help would be appreciated
Hello,

It seems that the link you sent me doesn't work. Could you check, please, if it is correct?

Thank you.
__________________
Maya N., Ecwid Team

------------------
Welcome to our new Help Center!
  #3  
Old 03-21-2014, 09:02 AM
Dom Goor1's Avatar
Dom Goor1 Dom Goor1 is offline
 
Join Date: Oct 2013
Posts: 24
Default

Hi Maya sorry for that.
here is the link
https://domgoorshop.com/Dom-Goor-Sho...T/master1.html

The one browser it does seem to work in is Safari
but is not working Google Firefox or Internet Explorer

Best regards Daniel
  #4  
Old 03-27-2014, 02:02 PM
Maya's Avatar
Maya Maya is offline
Ecwid Team
 
Join Date: Feb 2010
Location: Ecwid headquarter
Posts: 5,876
Default

Hello,

It seems that there is no option to get old single product widget code anymore. That is why I suggest you to use new product widget. In order to avoid the situation when new added product option required source code customisation, I suggest you to change the part of the product page marked on screenshot with default Single product widget code.


It will required some design changed to show them as it is now. Please, follow these steps:
1. Go to Ecwid control panel -> Catalog -> Products -> Product modify page and set name of your option as "Select color" and "Set size" correspondingly

2. Go to "HTML Code" tab and uncheck "Thumbnail", "Product Name" and "Price" in "Widget Components" block to generate single product widget code that will contain options list and "add to bag" button only.

3. Copy single product widget code and paste it to your site

4. Add following CSS code in your custom CSS theme to design your options list as they shown on your site now:
Code:
div.ecwid-SingleProduct-options {
   width: 400px;
}
#ecwid-productoption-34802594-Select_Size-container l label.ecwid-fieldLabel ,
div.ecwid-productBrowser-details-optionPanel label.ecwid-fieldLabel {
font-family: arial, sans-serif;
font-size: 11px;
font-weight: normal;
float: left;
margin-right: 10px;
width: 66px !important;
}
div.ecwid-productBrowser-details-optionPanel>div {
  float: left;
   width: 240px; 
  clear: right;
}
div.ecwid-productBrowser-details-optionPanel {
  height: 35px;
}
span.ecwid-productBrowser-details-optionCheckbox-name {
font: 10px helvetica, arial, verdana, sans-serif;
}
span.ecwid-productBrowser-details-optionCheckbox label {
   display: block;
   width: 40px;
}
span.ecwid-productBrowser-details-optionCheckbox {
margin: 0 5px 0 0;
 float: left;
}
div.ecwid-SingleProduct-qty {
    display: none;
}
#ecwid-productoption-34802594-Select_Size-container label {
   width: 30px;
}
5. 1-3 step for other products

Once you do this, product page will look the same as it is now, but all product option will appear automatically, when they will be added in control panel.

Good luck!
__________________
Maya N., Ecwid Team

------------------
Welcome to our new Help Center!
 
The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 08:36 PM.
Powered by vBulletin® Version 3.8.11. Copyright ©2000 - 2021, Jelsoft Enterprises Ltd.