分享一下QQ登陆按钮与微博按钮共存美观的修改办法 0616增加横排

如果安装微博登陆和QQ互联的话，明显的就错位了，官方的方法太复杂了。

现在教大家一个非常简单的办法，效果图如下：

上下两行，一红一蓝，完美绝配。见代码一


通过CSS还可以控制间隙。见代码二




左右横排，空隙一样可以增加删除。见代码三

喜欢的可以继续往下看，不喜欢的AIT+F4

安装后在后台

会看到你对应的代码，然后复制了

打开source/plugin/qqconnect/template/module.htm

找到
<p><a href="$_G[connect][login_url]&statfrom=login_simple"><img src="{IMGDIR}/qq_login.gif" class="vm" alt="{lang qqconnect:connect_header_login}" /></a></p>
在第七行

然后把下面哪行替换成后台复制的代码：
<a href="xwb.php?m=xwbAuth.login"><img src="http://www.vwu.cc/xwb/images/bgimg/sina_login_btn.png" /></a>

注意，为了不错位，两端要加上<p></p>

下面提供三种样式的代码，修改方法同上！


一、无间隙竖排

完整代码如下：
<!--{block return}-->
        <div class="fastlg_fm y" style="margin-right: 10px; padding-right: 10px">
                <p><a href="$_G[connect][login_url]&statfrom=login_simple"><img src="{IMGDIR}/qq_login.gif" class="vm" alt="{lang qqconnect:connect_header_login}" /></a></p>
                <p><a href="xwb.php?m=xwbAuth.login"><img src="http://www.vwu.cc/xwb/images/bgimg/sina_login_btn.png" /></a></p>
        </div>

4~8行

网址要换成你自己的！！！

然后就可以了，但是大家会发现微博登陆按钮竟然比QQ的大个！

修改也很容易，用PS把红色部分剪掉一些就可以了，这里送上我改好的：




-------------------猥琐的分割线----------------------

推荐！有间隔CSS美化版


二、有间隙竖排




代码如下：

• <!--{block return}-->
• <div class="fastlg_fm y" style="margin-right: 10px; padding-right: 10px">
• <p><a href="$_G[connect][login_url]&statfrom=login_simple"><img src="{IMGDIR}/qq_login.gif" class="vm" alt="{lang qqconnect:connect_header_login}" /></a></p>
• <p class="hm xg1" style="padding-top: 2px;"><a href="xwb.php?m=xwbAuth.login"><img src="http://www.vwu.cc/xwb/images/bgimg/sina_login_btn.png" /></a></p>
• </div>
• <!--{/block}-->
• <!--{eval return $return;}-->
  

复制代码



一样记得换成自己的图片地址！
其中style="padding-top: 2px;控制间隔距离，根据情况调整


-------------------猥琐的分割线----------------------


三、左右横排

代码如下：


<div style="margin-right: 10px; padding-right: 10px;" class="fastlg_fm y">

<p><a target="_top" href="$_G[connect][login_url]&statfrom=login_simple"><img class="vm" src="xwb/images/bgimg/qq_login.png" alt="用QQ账号登陆" ></a>;<a target="_top" href="xwb.php?m=xwbAuth.login"><img class="vm" src="xwb/images/bgimg/sina_login.png" alt="用微博账号登陆"></a></p>

<p style="padding-top: 2px;" class="hm xg1">只需一步，快速开始</p>

</div>


这个无需修改网址路径，注意红色标记处图片存放的位置！我是默认放在新浪微博插件的图片文件夹里的~

蓝色标记的 就是空格符，增加可以加大空隙，减少可以去掉空隙。

下面是素材：

  


-------------------猥琐的分割线----------------------

最后要记得在后台关闭插件原配的登陆按钮~

沙发

顶顶

大亦庄支持你 http://www.dayizhuang.com/

用了
唯美意境 收录优美的图片 QQ空间论坛 QQ空间素材网 QQ空间音乐 唯美图片 QQ素材论坛 QQMCC邀请码

我改后怎么没有效果呢

广州海珠论坛http://www.haizhubbs.com

两个之间再加一行空的吧，感觉更好些。。。