I have purchased this "MAGENTO" shopping cart template, which was designed in 2013, yet there is NO facebook, google or pinterest links for the products.
This has got to be a major oversight in today’s marketing.
What can you offer to use for the item display to "like" etc for social media…
11 answers
Use this for sharing/tweeting specific CMS pages or product detail pages in Magento.
This code should go inside the file path --> /app/design/frontend/default/yourtheme/template/catalog/product/view.phtml.
You can put this in various locations, but I like having it directly after the product description on my product detail page.
Code:
<div class="share"> <?php if ($this->canEmailToFriend()): ?> <div class="email-friend"><a href="<?php echo $this->helper('catalog/product')->getEmailToFriendUrl($_product) ?>"><?php echo $this->__('Email to a Friend') ?></a></div> <?php endif; ?> <div class="tweet"><a href="http://twitter.com/share" class="twitter-share-button" data-count="none" data-via="PUT YOUR TWITTER NAME HERE">Tweet</a></div> <div class="fbShare"><script src="http://platform.twitter.com/widgets.js" type="text/javascript" ></script><div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=233211453363057&xfbml=1"></script><fb:like href="" send="true" layout="button_count" width="250" show_faces="false" font=""></fb:like></div> <br style="clear:both;" /> </div>
Be sure to change PUT YOUR TWITTER NAME HERE to the actual Twitter username your Tweet button is affiliated with. This will automatically add the #TwitterID tag to the end of the shared tweet.Now for the CSS. Add the following code at the end of your theme’s CSS file, most likely located in --> /skin/frontend/default/yourtheme/css/styles.css
Code:
.share { background: #F8F8F8 border:1px solid #CCC padding: 8px; margin:0 0 5px 0;} .email-friend a {display:block; margin:0 10px 0 0; float:left;clear:both;width:55px;height:20px;background:url(../images/email.png) no-repeat; font-size:0;text-decoration:none; text-indent:-9999px; } .tweet { float: left; width: 55px; height:20px; margin-right: 10px;} .fbShare { float: left; width: 175px; height: 20px;}
Download the email image below and add it to your theme’s image folder. The result should look like this:http://bigbuddymedia.com/assets/images/sharebuttons.png
Do you have the code for Pinterest please?
Thanks
The following code should work when placed inside theme/catalog/product/view.phtml:
Code:
<!--START PIN BUTTON--> <?php $_pinlink['url'] = $_product->getProductUrl(); $_pinlink['media'] = $this->helper('catalog/image')->init($_product, 'image')->__toString() ; $_pinlink['description'] = $_helper->productAttribute($_product, $_product->getName(), 'name') . " - " . strip_tags($_product->getDescription()); ?> <a href="http://pinterest.com/pin/create/button/?<?php echo http_build_query($_pinlink) ?>" class="pin-it-button" count-layout="horizontal"></a> <script type="text/javascript" src="//assets.pinterest.com/js/pinit.js"></script> <!--END PIN BUTTON-->
Thanks, how about the css?
http://thirtythreestar.com/new/riva-l982-formal.html
It is below other social buttons
http://thirtythreestar.com/new/riva-l982-formal.html
It is below other social buttons
Where do you want it?
The same spot like twitter, facebook, after the product description.
Thanks
The same spot like twitter, facebook, after the product description.
Thanks
Quick Question . . . . Are you seeing the twitter and facebook share icons when you view your site?
I am viewing via Firefox and I am only seeing the pintrest icon.
I actually do see twitter and facebook
http://thirtythreestar.com/new/riva-l990-formal.html
I also need instagram, I forgot to add.
Are you still not able to see Twitter and Facebook Share and Like?
I don’t see the email this however.
I placed this code after description in view.html
.share { background: #F8F8F8 border:1px solid #CCC padding: 8px; margin:0 0 5px 0;}
.email-friend a {display:block; margin:0 10px 0 0; float:left;clear:both;width:55px;height:20px;backg round:url(../images/email.png) no-repeat; font-size:0;text-decoration:none; text-indent:-9999px; }
.tweet { float: left; width: 55px; height:20px; margin-right: 10px;}
.fbShare { float: left; width: 175px; height: 20px;}
<!--START PIN BUTTON-->
<?php
$_pinlink[‘url’] = $_product->getProductUrl();
$_pinlink[‘media’] = $this->helper(‘catalog/image’)->init($_product, ‘image’)->__toString() ;
$_pinlink[‘description’] = $_helper->productAttribute($_product, $_product->getName(), ‘name’) . " -- " . strip_tags($_product->getDescription());
?>
<a href="http://pinterest.com/pin/create/button/?<?php echo http_build_query($_pinlink) ?>" class="pin-it-button" count-layout="horizontal"></a>
<script type="text/javascript" src="//assets.pinterest.com/js/pinit.js"></script>
<!--END PIN BUTTON-->
Figured it out. I now have pinterest,f- like, f-share buttons below product short description.
Thanks Joomlart!
This question is now closed