网站设计教程全集

Zblog独立博客上线一天，庆祝自己博客修改了传统主题成功，同时优化了标题关键字等基础的SEO步骤。总觉得边栏很空，当参考其它优秀博客时，看到左、右边栏有Google的Friend Connect，我感觉很不错，记得以前用Blogspot的时候，也发现了提供了两个html文件，提供给独立博客或网站的站长们使用，最后我自己摸索，成功创建Friend Connect，点击看我的博客nsoom.cn效果。Google Friend Connect 的社会化特性让我觉得它会是一个非常适合博客的 Widget，在某些方面让你的博客也具有一定的社会化的特性，让你的博客能够获得更多的用户。Friend 网站制作公司 Connect是互联网较好的社交工具之一，将它作为博客的widget，还可以扩展博客的趣味性和互动性。

下面以Z-blog为例，讲一下我的创建步骤：

第一步，当然自己得注册Friend 天津河东网站建设公司 Connect账户，建立新站点，填写自己的域名等信息。继续将以下文件添加到您的站点中，将rpc_relay.html和canvas.html下载下来，添加到自己的站点根目录。保存测试。点击左边生成的站点，点击会员站点。选择这个可以生成带头像的好友栏。点击右边添加会员小工具，宽度设置成188左右，具体可后来根据实际情况调整。点击右边下方生成代码。

第二步，桌面上新建一个txt文件，命名friend，把复制的代码粘贴到friend.txt文件，然后修改txt文件后缀名为asp。最后生成的文件是friend.asp。把friend文件上传到空间的根目录INCLUDE文件夹

/INCLUDE/friend.asp

第三步，进入zblog后台， 点击链接管理下的文件管理，可以看到空间里的文件夹和文件。依次打开THEMES\j-spring\TEMPLATE，我使用的主题名字是j-spring，如果你使用的是其他主题名字，请打开THEMES\你使用的主题名\TEMPLATE，可以看到default.html，点击default.html的编辑按钮，下拉找到形如：

div class="function" id="div****"
h3工具名称/h3
ul
#CACHE_INCLUDE_FRIEND#
/ul
/div

然后添加Friend Connect代码：

div class="function" id="divFriend"
h3社交网络/h3
ul
#CACHE_INCLUDE_FRIEND#
/ul
/div

到你选择的位置，比如我放网站设计教程全集在分类目录下，那我就把Friend Connect代码放到分类目录代码之下，工具命名为社交网络即：

div class="function" id="divCatalog"
h3分类目录/汕头网站建设公司h3
ul
#CACHE_INCLUDE_CATALOG#
/ul
/div

div class="function" id="divFriend"
h3社交网络/h3
ul
#CACHE_INCLUDE_FRIEND#
/ul
/div

第四步：

点击提交，点击左边栏主题样式管理，再次激活你正在使用的主题，然后点击文件重建。

打开主页看看，是不是Friend Connect是不是已经显示了！

如果没有显示，检查friend.asp文件名和路径是否正确。Friend Connect工具栏的高度和宽度大家可以调整代码，以和其它工具栏对齐。

接下来你就把你Google里的好友添加到你的Friend Connect里吧，或者加入别人的Friend Connect，或者到相关的贴吧、小组、圈子之类的地方拉人。

可能大家还有比较好的其它办法，欢迎和我交流，共同学习。