如何“自定义”分享图标

如何“自定义”分享图标,第1张

如何“自定义”分享图标

使用说明: 工具式和图标式按钮风格可以自定义出现的图标,其标准代码如下:

<!-- JiaThis Button BEGIN -->

<div id="ckepop">

<a href="http://www.jiathis.com/share/" class="jiathis jiathis_txt jtico jtico_jiathis" target="_blank">分享哪仿携到:</a>

<a class="jiathis_button_tsina">新浪微博</a>

<a class="jiathis_button_qzone">QQ空间</a>

<a class="jiathis_button_kaixin001">开心网</a>

<a class="jiathis_button_renren">人人网</a>

</div>

<script type="text/javascript" src="http://v2.jiathis.com/code/jia.js" charset="utf-8"></script>

<!-- JiaThis Button END -->

如果您想在按钮后面添加或更换可以直接点击分享的小图标,可以采用以下方法:

添加图标:可以增加一行<a class="jiathis_button_douban">豆瓣网</a>这样的代码添加分享小图标,参数参考“jiathis_button_douban”这样的写法。ID为“douban”代表豆瓣网,ID为“tsina”代表新浪微博。(完整的ID参数定义可以从这里查看) 。如果<a class="jiathis_button_douban"></a>标签中间不填写文字,则只出现小图标,和图标式代码的表现效果一样,您不妨动手试试!

更换文字:可以将分享到...文字更换为任何您想要的文字。

如何“智能排序”分享图标?

工具式和图标式按钮风格还可以根据用户喜好智能排序(什么是用户智能排序请看这里),其标准代码如下:

<!-- JiaThis Button BEGIN -->

<div id="ckepop">

<a href="http://www.jiathis.com/share/" class="jiathis jiathis_txt jtico jtico_jiathis" target="_blank">分享到:</a>

<a class="jiathis_button_tools_1"></a>

<a class="jiathis_button_tools_2"></a>李伏

<a class="jiathis_button_tools_3"></a>

<a class="jiathis_button_tools_4"></a>

</div>

<script type="text/javascript" src="http://v2.jiathis.com/code/jia.js" charset="utf-8"></script>

<!-- JiaThis Button END -->

如果您想在网站的的各个社会化分享按钮是按照用户的喜好习惯智能排序,可以采用以下方法:

添加图标:可以增加一行<a class="jiathis_button_tools_5"></a>这样的代码添加分享小图标,每新增一行让jiathis_button_tools_5中的数字递增。多少行A标签决定了出现多少个图标。如果将其中的jiathis_button_tools_5更换成jiathis_button_icons_5,则表示不出现文字,和图标式代码的表现效果一样!

自定义+智能排序:JiaThis还支持网站主自定义图标与智能排序图标混排。假设您想为您的网站添加4个分享图标,您希望前两个由您自定义,固定不变,后两个图标根据您网站用户的喜好智能排序。则可以参考以下代码的写法:

<!-- JiaThis Button BEGIN -->

<div id="ckepop">

<a href="http://www.jiathis.com/share/" class="jiathis jiathis_txt jtico jtico_jiathis" target="_blank">分享到:</a>

<a class="jiathis_button_tsina">新浪微博</a>

<a class="jiathis_button_qzone">QQ空间</a>

<a class="jiathis_button_tools_1"></a>

<a class="jiathis_button_tools_2"></a>

</div>

<script type="text/大仿javascript" src="http://v2.jiathis.com/code/jia.js" charset="utf-8"></script>

<!-- JiaThis Button END -->

方法/步骤

在网页的头部腔闹乱加上以下代码,图片路径自行修改。

<head>

<div id='wx_pic' style='margin:0 autodisplay:none'>

<img src='/image/data/pic300.jpg' />

</div>

</head>

制作像素是 300*300px的图片,命名为pic300.jpg。将图片放到步骤一对应的路径下。

保存好文件后,伍档就可以分享弯迟到朋友圈了。此时分享的网页链接就会有小图片显示了。

1、手机微信直接发连接就是一个网址没有文字和图片。

2、袜逗点击打开链知猛接页面,点击右上角的三点图告猛卖标。

3、点击右上角的三点图标后,点击发送朋友。

4、点击发送朋友后,选择发送的朋友,分享的链接就要文字和图片了。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11989779.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-20
下一篇 2023-05-20

发表评论

登录后才能评论

评论列表(0条)

保存