Announcement

**jleclair** · 12-06-2013, 03:00 PM

document.write will send to the html as you said.

you're looking for something like jQuery.append();

(since jQuery is included in 3dcart stores anyway)

HTML Code:

jQuery('head').append('<meta property="go:price:amount" content=" ' + priceNoCurrency + ' ">');

is more what you are looking for. Fire that whenever you were doing your document.write

**edcroteau** · 12-06-2013, 03:32 PM

Thanks so much for the quick reply.

Unfortunately I still need to ask more questions :

1. Do I need to enclose your code within <script> </script> ? I suspect yes.

2. Where would I put the code ? I tried in <head> and <body> with and without the <script> tags ...

Here's my current entry in <head> - doesn't validate with Pinterest so it's probably not working :

Code:

<script type="text/javascript">
var priceNoCurrency = "[price]";
priceNoCurrency = priceNoCurrency.substring(1);
metaString = '<meta property="og:price:amount" content="' + priceNoCurrency + '">';
</script>
<script type="text/javascript">
document.write(metaString);
</script>

Thanks,

Ed

**jleclair** · 12-07-2013, 09:44 AM

sorry i wasnt around much yesterday afternoon.

HTML Code:

<script type="text/javascript">
var priceNoCurrency = "[price]";
priceNoCurrency = priceNoCurrency.substring(1);
metaString = '<meta property="og:price:amount" content="' + priceNoCurrency + '">';
jQuery(function(){
   jQuery('head').append(metaString);
});
</script>

Put this at the bottom of your page before the closing html tag.

**edcroteau** · 12-07-2013, 02:42 PM

Again, thanks so much.

I put the exact code block in frame.html between </body> and </html> but the meta tag string does not appear to be appended to the <head> section nor anywhere else but inside the code block itself. I'm clearing the cache, reloading the page and looking at the page source. Using Cloudflare so I put the site in Development Mode and cleared the cache.

I tried a product page on the Rich Pin Validator and it is still failing on the lack of "og:price:amount" which makes sense since I can't see it in the source code of the page anyway.
Validator URL : https://developers.pinterest.com/rich_pins/validator/
Sample product page URL : DR519 Cotton/Velvet Dress by Jedzebel

I noticed that other jQuery calls that 3dcart themselves make are just listed as code blocks as well. Do I need to do something to "execute" that function in a browser ?

Sorry for being such a newbie but I don't really understand how the 3dcart preprocessors do things nor how ASP really works. If this was PHP it would be much easier I think.

Any other ideas about getting the jQuery function to execute ?

Thanks so much, Ed

**jleclair** · 12-07-2013, 03:03 PM

I'm unfamiliar with how that pinterest thing works, but the meta tag is there in the head on your test page.

I see 4 required fields here on the developer page. Perhaps the lack of these other fields is more of the issue now?

https://developers.pinterest.com/rich_pins/

**edcroteau** · 12-07-2013, 08:24 PM

jleclair - you're so nice to help me with this.

1. I don't see the meta tag - do you see the one with the $ sign that is already there by default with 3dcart or do you see this one with NO currency $ sign ?
<meta property="og:price:amount'" content="99.95"> note the difference is also in the property og:price:amount vs. og:price

2. The Pinterest pin validator at that URL is causing an error on the price variable as expected because it contains the currency sign - this is crazy as 3dcart won't help me with this at all and no one with 3dcart can use this feature of Pinterest called Rich Pins ...

**jleclair** · 12-07-2013, 08:49 PM

i assure you the one we are inserting with the code is there. the append() function inserts at the end of the element.. scroll down in your head I assure you it's there. It's the third element from the bottom. translate.googleapis.com is inserting a script tag and then something is dropping some inline styles after it.

I don't know how the pinterest module initializes, and if we need to have the meta tag there before the dom completes or what, but our problem is not the lack of the meta tag at this point.

**edcroteau** · 12-08-2013, 07:48 PM

Interesting ... when I use Show Page Source it doesn't appear in the <head> just in my script but when I used the Javascript console then I could see it ...

So yes, you were right and it worked. Thanks.

Now the question is why is Pinterest not validating ... ?

I can check in with them to see if the other default meta price with the $ sign is messing it up ...

**jcocking** · 12-09-2013, 08:38 AM

I am using a combination of og: and schema.org models to be validated by Pinterest.

I have the following in the SocialCommerce => Like Button => Advanced:

HTML Code:

<meta property="og:title" content="[TITLE]"/> 
<meta property="og:description" content="[description]"/> 
<meta property="og:type" content="product"/> 
<meta property="og:url" content="[product_url]"/>
<meta property="og:site_name" content="[store_name]"/> 
<meta property="og:price:currency" content="USD"/> 
<meta property="og:image" content="[product_image]"/>

I then run the schema.org values for pricing in the listing_0.html template:

HTML Code:

<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
  <link itemprop="availability" href="http://schema.org/InStock" content="[availability_itemprop]" />
  <span itemprop="priceCurrency">USD</span>
  <!--START: ITEMPRICE-->
     <div itemprop="price">[price]</div>
  <!--END: ITEMPRICE--> 
  <!--START: SALEPRICE--> 
    <s>[price]</s><br />
    <div itemprop="price">[saleprice]</div>
  <!--END: SALEPRICE--> 
</div>

Schema.org's model allows a "$" to exist in the price field. The two together are receiving a positive validation. Additionally, this allows your sale price or the regular price to be displayed.

jeff

**edcroteau** · 12-10-2013, 07:07 PM

Thanks for that.

I had trouble getting it to work ... even with formatting issues that I didn't like I still wasn't able to get Pinterest to validate.

I'll keep looking at it ...

Can you use the schema.org stuff in the SEO tools (under Marketing) down in the Open Graph section ? It looks to me like the product needs to be in a div but can that div go in the OG section of SEO Tools ?

**jcocking** · 12-10-2013, 11:46 PM

Formatting issues: I showed the schema.org from a stock template. My template looks like this:

HTML Code:

            <div class="price2" itemprop="offers" itemscope itemtype="http://schema.org/Offer">
              <link itemprop="availability" href="http://schema.org/InStock" content="[availability_itemprop]" />
              <span style="display:none;" itemprop="priceCurrency">USD</span>
              <!--START: price2-->
              <span class="price-tax">[product_retailprice] &nbsp;[price2]</span><br />
              <!--START: SAVINGS-->
              <span class="price-tax">[product_savings] &nbsp;[savings]</span><br />
              <!--END: SAVINGS--> 
              <!--END: price2-->
              <div class="price1">[product_yourprice] &nbsp; 
              <!--START: ITEMPRICE-->
              <span itemprop="price">[price]</span>
              <!--END: ITEMPRICE--> 
              <!--START: SALEPRICE--> 
              <span class="price-old">[price]</span> 
              <span itemprop="price" id="price" class="price">[saleprice]</span>
              <!--END: SALEPRICE-->
              </div> 
            </div>

You will notice, I use <span> tags. This way it does not mess up the formatting of the page.

divs in Open Graph Meta Tags: I do not know if they will work.

jeff

Announcement

Need a Javascript variable to populate into an HTML string

Need a Javascript variable to populate into an HTML string

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment