Simple social sharing product in Magento

最新推荐文章于 2025-11-29 10:44:03 发布

原创最新推荐文章于 2025-11-29 10:44:03 发布 · 145 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#php #javascript #ViewUI

php 同时被 2 个专栏收录

129 篇文章

订阅专栏

Magento

127 篇文章

订阅专栏

本文详细介绍了如何将JS和CSS添加到布局配置文件中，并使用PHP编写HTML文件来展示产品信息，包括产品名称、URL和图片，同时提供了分享功能，支持微信、微博、QQ和豆瓣等社交媒体平台。

1. add js and css to your layout config file

 <reference name="head">
		 	 <action method="addCss"><stylesheet>css/fancybox/jquery.fancybox-1.3.4.css</stylesheet></action>
		 	 <action method="addCss"><stylesheet>css/share/jquery.share.css</stylesheet></action>
		 	 
        	  <action method="addItem"><type>skin_js</type><name>js/share/qrcode.min.js</name></action>
		      <action method="addItem"><type>skin_js</type><name>js/share/jquery.share.min.js</name></action>
        </reference>

2. write html file with product

<?php 
$_product_id = $this->getData('current_product_id');
$_product = Mage::getModel('catalog/product')->load($_product_id);?>
<?php $productName = $_product->getName(); ?>
<?php $productUrl = $_product->getProductUrl(); ?>
<?php $productImage = $_product->getImageUrl() ?>
<!-- share BEGIN -->

<div class="share-list hp-shareTo-inner J_share_list_<?php echo $_product_id?>">
    <a href="javascript:" data-type="weixin" class="btn-share-weixin" title="<?php echo $this->__('weixin')?>"><?php echo $this->__('weixin')?></a>
	<a href="javascript:" data-type="weibo" class="btn-share-weibo" title="<?php echo $this->__('weibo')?>"><?php echo $this->__('weibo')?></a>
	<a href="javascript:" data-type="qq" class="btn-share-qq" title="<?php echo $this->__('qq')?>"><?php echo $this->__('qq')?></a>
	<a href="javascript:" data-type="douban" class="btn-share-douban" title="<?php echo $this->__('douban')?>"><?php echo $this->__('douban')?></a>
</div>

<!-- share END -->

<!-- share js begin-->
<script>
var url = '<?php echo $productUrl; ?>';
</script>
<script>
(function($){
	
	$('.J_share_list_<?php echo $_product_id?>  a').bind('click', function() {
		var type = $(this).data('type');
		$.shareAPI(type, {
			url: url,
			title: '<?php echo $productName;?>',
			pic: '<?php echo $productImage;?>',
			source: {
	
			},
			buttons: {
				'weixin': {
		            text: 'weixin', 
		            className: 'weixin', 
		            url: ''
		        },
		        'weibo': {
		            text: 'weibo', 
		            className: 'weibo', 
		            url: 'http://v.t.sina.com.cn/share/share.php?url={url}&title={title}&pic={pic}&appkey={appkey}&ralateUid={ralateUid}&searchPic={searchPic}'
		        },
		        'qq': {
		            text: 'qq', 
		            className: 'qq', 
		            url: 'http://connect.qq.com/widget/shareqq/index.html?url={url}&title={title}&pics={pic}&summary={summary}&desc={desc}&site={site}'
		        },
		        'douban': {
		            text: 'douban', 
		            className: 'douban', 
		            url: 'http://www.douban.com/share/service?href={url}&name={title}&text={summary}'
		        },
			}
		}); 
	});

})(jQuery);
</script>
<!--  share js end -->

More file download please go here:

https://github.com/nevergiveup-j/HP/tree/master/share