【小技能】——博客栏目装饰

              不知道大家是否注意到有些人CSDN的左侧博客栏目有一些特殊的栏目,例如欢迎联系我,以及友情链接,个人感觉最神奇的是还有邮件联系我,单击后竟然直接进入了Formail的写邮件界面。。。这个小东东确实吸引了我,经过不断的查找,终于弄明白其中的道理。

添加友情链接

管理博客——博客栏目——添加项目

              【小技能】——博客栏目装饰_第1张图片

添加完成之后的效果图

                              

注微博的操作和上述操作一样,只要添加微博主页的链接就可以了。

附上源码,便于使用

<a href="http://blog.163.com/m15831650727_2/">我的网易博客 <br>
</a>


添加欢迎联系我

这一项下面可以包含好多内容,例如QQ联系我,邮件联系我等内容。

QQ联系我

实现的效果就是当单击图标之后,直接出现QQ聊天的界面。

登陆 http://wp.qq.com 选择代码类型及图片留言和在线状态风格:

                                                                                   【小技能】——博客栏目装饰_第2张图片

然后和添加友情链接的操作一样,这里面会出现的一个问题就是

             【小技能】——博客栏目装饰_第3张图片

关于这个问题因为我们用的图标是qq的,csdn上不允许,解决只需要把链接换成自己csdn上的图片的链接地址就行了。要说一点的是,百度的过程中,大家都说可以把图标放到相册中,但是我真的没有找相册!!我就是在csdn上写一篇博客放在草稿箱里,把所需要的图片放到了那里面,复制图片的链接。将图片的链接更换,就可以了。     【小技能】——博客栏目装饰_第4张图片

如果您不喜欢用图标,那就更方便了,直接仿照友情链接的操作就可以了,只需要QQ聊天界面的链接就OK啦。

效果图

                                                                         

单击图片直接出现了QQ聊天界面

                                                     【小技能】——博客栏目装饰_第5张图片

邮件联系我

其实这一部分非常简单,只是一句代码的问题。

               【小技能】——博客栏目装饰_第6张图片

当然这句代码让我找的也好痛苦。。

效果图就是直接单击图标,然后就是

    【小技能】——博客栏目装饰_第7张图片

附上添加过程源码,方便大家使用(注意链接一定添加自己的

<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=2361166986&site=qq&menu=yes"><img border="0" src="http://img.blog.csdn.net/20150911112023832?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast"><br>
</a><a target="_blank" href="mailto:***********@163.com"><img border="0" src="http://img.blog.csdn.net/20150911150849620?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center"></a>


【总结】

     一开始在csdn上看到这个功能,真心觉得特别神奇,后来研究懂了,发现也就是那么一回事。只能说代码的强大,如果我们真的懂的这些计算机语言,做这些东西,真的能说,小菜一碟。虽然用了两个多小时的时间,但是还是很高兴的,对事物保持一份好奇心,这样我们真的会收获的更多!

 

你可能感兴趣的:(添加qq联系我,添加邮箱联系我,添加友情链接)