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

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

[经验] 庆祝X2版 分享QQ登陆与微博按钮共存的修改3种办法

[复制链接]
ruziniu05100 发表于 2011-10-14 02:06:58 | 显示全部楼层 |阅读模式
本帖最后由 ruziniu05100 于 2011-10-14 02:58 编辑

如果安装微博登陆和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上移了,原因很简单,图标太长了,其实把图标剪断就可以了,大部分都会正常,但是个人空间还是会有问题,目前还是没解决。。。



本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x
衡阳家园 发表于 2011-10-14 10:19:27 | 显示全部楼层
这里是uch  兄弟。
回复

使用道具 举报

子非、 发表于 2011-12-23 09:50:24 | 显示全部楼层
路过围观
回复

使用道具 举报

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

本版积分规则

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

GMT+8, 2024-11-23 10:48 , Processed in 0.022783 second(s), 3 queries , Gzip On, Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

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