Discuz!官方免费开源建站系统

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

[展示] 分享QQ登陆与微博按钮共存的修改3种办法

[复制链接]
飞扬吉他 发表于 2012-3-12 12:40:13 | 显示全部楼层 |阅读模式
如果安装微博登陆和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>


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

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

下面是素材:

   


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

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



有朋友提出这个错位问题:


LOGO上移了,原因很简单,图标太长了,其实把图标剪断就可以了,大部分都会正常,但是个人空间还是会有问题,目前还是没解决。。。


 楼主| 飞扬吉他 发表于 2012-3-12 12:40:57 | 显示全部楼层
演示网站http://www.tianfu5.com/portal.php
回复

使用道具 举报

xjpetro 发表于 2012-3-12 12:52:19 | 显示全部楼层
很不错啊
回复

使用道具 举报

坚定信心 发表于 2012-3-12 12:58:29 | 显示全部楼层
提示: 作者被禁止或删除 内容自动屏蔽
回复

使用道具 举报

 楼主| 飞扬吉他 发表于 2012-3-13 15:00:25 | 显示全部楼层
没人支持啊
回复

使用道具 举报

爱摩 发表于 2012-3-19 07:09:32 | 显示全部楼层
你这个办法的确是很很不错的哦!
回复

使用道具 举报

落水有情 发表于 2012-3-19 07:11:03 | 显示全部楼层
LZ说得很好。
回复

使用道具 举报

abcnic 发表于 2012-3-19 07:19:23 | 显示全部楼层
不错  支持了呢
回复

使用道具 举报

lvzhuzhi 发表于 2012-3-19 08:22:08 | 显示全部楼层
谢谢楼主的无私奉献!!
回复

使用道具 举报

 楼主| 飞扬吉他 发表于 2012-3-30 11:37:22 | 显示全部楼层
这么好,怎么就没有顶啊
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|Discuz! 官方站 ( 皖ICP备16010102号 )star

GMT+8, 2024-6-2 15:35 , Processed in 0.103852 second(s), 17 queries , Gzip On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

快速回复 返回顶部 返回列表