Just wanted to share with everyone the custom code we used on our XC 4.5.5 site to integrate Facebook Open Graph and Twitter Cards for mostly every page.
Let us know if you have questions or suggestions!
9-10-2014: Added fix for categories, php pages, static pages, and manufacturer pages. Also cleaned up coding.
10-27-2014: Added compatibility for special offers module pages
Code:
<meta property="fb:admins" content="1099545101" />
<meta property="og:locale" content="en_US" />
<meta property="og:url" content="http://{$smarty.server.HTTP_HOST}{$smarty.server.REQUEST_URI}" />
<meta property="og:site_name" content="{$lng.lbl_site_name|default:$config.Company.company_name|amp}" />
<meta name="twitter:site" content="@silverhorseusa">
<meta name="twitter:creator" content="@silverhorseusa">
<meta name="twitter:title" content="{$meta_title}">
<meta name="twitter:domain" content="http://{$smarty.server.HTTP_HOST}">
{*Add {$smarty.server.REQUEST_URI} to end of content to enable full URL to show *}
{if $main eq "product"}
{assign var="prod_descr" value=$product.descr|default:$product.fulldescr}
<meta property="og:type" content="product" />
<meta property="og:title" content="{$product.product|escape}" />
<meta property="og:description" content="{$prod_descr}" />
<meta property="og:image" content="{$product.image_url}" />
<meta property="product:price:amount" content="{$product.price}" />
<meta property="product:price:currency" content="USD" />
<meta name="twitter:card" content="product">
<meta property="twitter:description" content="{$prod_descr|truncate:'400':'...':false|strip_tags}">
<meta name="twitter:image:src" content="{$product.image_url}">
<meta name="twitter:data1" content="${$product.price}">
<meta name="twitter:label1" content="PRICE">
<meta name="twitter:data2" content="{$product.productcode}">
<meta name="twitter:label2" content="SKU">
{elseif $main eq "catalog" and $cat ne "0"}
{assign var="cat_descr" value=$current_category.meta_description}
<meta property="og:type" content="website" />
<meta property="og:description" content="{$cat_descr}" />
<meta property="og:title" content="{$meta_title}" />
<meta property="og:image" content="http://{$smarty.server.HTTP_HOST}/{$current_category.image_path}" />
<meta property="og:image:secure_url" content="https://{$smarty.server.HTTP_HOST}/{$current_category.image_path}" />
<meta name="twitter:card" content="summary">
<meta name="twitter:description" content="{$cat_descr}">
<meta name="twitter:image:src" content="http://{$smarty.server.HTTP_HOST}/{$current_category.image_path}">
{elseif $main eq "manufacturer_products"}
<meta property="og:type" content="website" />
<meta property="og:description" content="{$manufacturer.meta_description}" />
<meta property="og:title" content="{$meta_title}" />
<meta property="og:image" content="{$manufacturer.image_url}" />
<meta property="og:image:secure_url" content="https://{$smarty.server.HTTP_HOST}/{$manufacturer.image_path}" />
<meta name="twitter:card" content="summary">
<meta name="twitter:description" content="{$manufacturer.meta_description}">
<meta name="twitter:image:src" content="{$manufacturer.image_url}">
{elseif $main eq "customer_offers"}
{foreach name=offers from=$offers item=offer}
<meta property="og:type" content="website" />
<meta property="og:description" content="{$offer.offer_name}" />
<meta property="og:title" content="{$meta_title}" />
<meta property="og:image" content="{$offer.image_url}" />
<meta name="twitter:card" content="summary">
<meta name="twitter:description" content="{$offer.offer_name}">
<meta name="twitter:image:src" content="{$offer.image_url}">
{/foreach}
{else}
<meta property="og:type" content="website" />
<meta property="og:description" content="Performance Dodge, Chevy, & Ford Mustang Billet Parts & Accessories" />
<meta property="og:title" content="{$meta_title}" />
<meta property="og:image" content="http://www.silverhorseracing.com/logo-images/SilverHorse%20Racing%20Logo.jpg" />
<meta property="og:image:secure_url" content="https://www.silverhorseracing.com/logo-images/SilverHorse%20Racing%20Logo.jpg" />
<meta name="twitter:card" content="summary">
<meta name="twitter:description" content="Performance Dodge, Chevy, & Ford Mustang Billet Parts & Accessories">
<meta name="twitter:image:src" content="http://www.silverhorseracing.com/logo-images/SilverHorse%20Racing%20Logo.jpg">
{/if}
Note that for
Code:
<meta property="og:title" content="{$meta_title}" />
...
<meta name="twitter:title" content="{$meta_title}">
to work. You must edit /include/templater/plugins/func.get_title.php
AFTER around line 115:
Code:
if (is_string($title)) {
$title = str_replace(array("\n", "\r"), array('', ''), trim($title));
AND
AFTER around line 150:
Code:
if (empty($title_items))
$title_items = array($lbl_site_title);
.......
$title = str_replace(array("\n", "\r"), array('', ''), trim(implode(' - ', $title_items)));*/
INPUT:
Code:
$smarty->assign('meta_title', $title);
Be sure to add twitter bot to your robots.txt file:
Code:
User-agent: Twitterbot
Disallow:
***Note: Not all of this code is ours, we had some help from:
http://forum.x-cart.com/showthread.php?t=66474
ALSO: This code becomes a little bit tricky if using CDSEO Pro, as the meta title,descriptions,keywords are all from CDSEO and will have to be assigned to a variable in php. If you'd like to see this work (we have ours working) PM me.