html 分享社交媒体

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html 分享社交媒体相关的知识,希望对你有一定的参考价值。

function fbShare(url, winWidth, winHeight) {
        var winTop = (screen.height / 3) - (winHeight / 3);
        var winLeft = (screen.width / 3) - (winWidth / 3);
        window.open('http://www.facebook.com/sharer.php?u=' + url, 'sharer', 'top=' + winTop + ',left=' + winLeft + ',toolbar=0,status=0,width=' + winWidth + ',height=' + winHeight);
}

function twShare(url, text, winWidth, winHeight) {
        var winTop = (screen.height / 3) - (winHeight / 3);
        var winLeft = (screen.width / 3) - (winWidth / 3);
        window.open('http://twitter.com/share?text=' + text + '&url=' + url, 'sharer', 'top=' + winTop + ',left=' + winLeft + ',toolbar=0,status=0,width=' + winWidth + ',height=' + winHeight);
}

function tumblrShare(url, text, winWidth, winHeight) {
	var winTop = (screen.height / 3) - (winHeight / 3);
	var winLeft = (screen.width / 3) - (winWidth / 3);
	window.open('http://www.tumblr.com/share/link?url=' + url, 'sharer', 'top=' + winTop + ',left=' + winLeft + ',toolbar=0,status=0,width=' + winWidth + ',height=' + winHeight);
	
	var winTop = (screen.height / 3) - (winHeight / 3),
	winLeft = (screen.width / 3) - (winWidth / 3),   
	opts   = 'status=1' +
	',width='  + winWidth  +
	',height=' + winHeight +
	',top='    + winTop    +
	',left='   + winLeft;
	
    var url = "http://www.tumblr.com/share/link?url="+url+"&name="+text;
	
    window.open(url , 'tumblr', opts);
}

function pinShare(url, text, media, winWidth, winHeight) {
	var winTop = (screen.height / 3) - (winHeight / 3);
	var winLeft = (screen.width / 3) - (winWidth / 3);

	
	window.open('//www.pinterest.com/pin/create/button/'+
    '?url='+url+
    '&media='+media+
    '&description='+text,'_blank','top='+winTop+',left='+winLeft+',width='+winWidth+',height='+winHeight);
	return false; 
}
<a href="javascript:fbShare('<?php the_permalink();?>',520,350);">
  <!--?xml version="1.0" ?--><svg enable-background="new 0 0 56.693 56.693" height="56.693px" id="facebook-ico" version="1.1" viewBox="0 0 56.693 56.693" width="56.693px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M28.347,5.157c-13.6,0-24.625,11.027-24.625,24.625c0,13.6,11.025,24.623,24.625,24.623c13.6,0,24.625-11.023,24.625-24.623  C52.972,16.184,41.946,5.157,28.347,5.157z M34.864,29.679h-4.264c0,6.814,0,15.207,0,15.207h-6.32c0,0,0-8.307,0-15.207h-3.006  V24.31h3.006v-3.479c0-2.49,1.182-6.377,6.379-6.377l4.68,0.018v5.215c0,0-2.846,0-3.398,0c-0.555,0-1.34,0.277-1.34,1.461v3.163  h4.818L34.864,29.679z"></path></svg>
</a>


<a href="javascript:twShare('<?php the_permalink();?>','<?php the_title();?>: <?php the_permalink();?>',520,350);">
  <!--?xml version="1.0" ?--><svg enable-background="new 0 0 56.693 56.693" height="56.693px" id="twitter-ico" version="1.1" viewBox="0 0 56.693 56.693" width="56.693px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M28.348,5.157c-13.6,0-24.625,11.027-24.625,24.625c0,13.6,11.025,24.623,24.625,24.623c13.6,0,24.623-11.023,24.623-24.623  C52.971,16.184,41.947,5.157,28.348,5.157z M40.752,24.817c0.013,0.266,0.018,0.533,0.018,0.803c0,8.201-6.242,17.656-17.656,17.656  c-3.504,0-6.767-1.027-9.513-2.787c0.486,0.057,0.979,0.086,1.48,0.086c2.908,0,5.584-0.992,7.707-2.656  c-2.715-0.051-5.006-1.846-5.796-4.311c0.378,0.074,0.767,0.111,1.167,0.111c0.566,0,1.114-0.074,1.635-0.217  c-2.84-0.57-4.979-3.08-4.979-6.084c0-0.027,0-0.053,0.001-0.08c0.836,0.465,1.793,0.744,2.811,0.777  c-1.666-1.115-2.761-3.012-2.761-5.166c0-1.137,0.306-2.204,0.84-3.12c3.061,3.754,7.634,6.225,12.792,6.483  c-0.106-0.453-0.161-0.928-0.161-1.414c0-3.426,2.778-6.205,6.206-6.205c1.785,0,3.397,0.754,4.529,1.959  c1.414-0.277,2.742-0.795,3.941-1.506c-0.465,1.45-1.448,2.666-2.73,3.433c1.257-0.15,2.453-0.484,3.565-0.977  C43.018,22.849,41.965,23.942,40.752,24.817z"></path></svg>
</a>

以上是关于html 分享社交媒体的主要内容,如果未能解决你的问题,请参考以下文章

HTML5 画布 - 将保存的图像分享到社交媒体

社交媒体在页面外分享特定内容

通过 PWA 的社交媒体分享图片

在社交媒体上分享,网址不呈现任何元数据

社交媒体营销教程_编程入门自学教程_菜鸟教程-免费教程分享

通过 reactjs 应用程序在社交媒体上分享帖子 [关闭]