在線會員顯示小頭像 (X3.2 ~ X3.4系列通用)
大家好
今天和大家分享在線會員美化
在線會員顯示頭像和顯示用戶名片
分享給有需要的站長們^^
打開
template/default/forum/discuz.htm 文件
查找
<img src="{STATICURL}image/common/$online" alt="icon" />
替換為
<a href="home.php?mod=space&uid=$online" c="1"><img src="http://您的域名/uc_server/avatar.php?uid=$online&size=small" class="ava_border" width="26px" height="26px" style="border:1px solid #ccc; padding:2px; margin:0px; background-color:#fff;" />
上面代碼中的
width="26px" height="26px"
可以修改頭像的大小
數值愈大頭像愈大
再查找
<li title="{lang time}: $online">
替換為
<li style="height:36px;">
再查找
<a href="home.php?mod=space&uid=$online">$online</a>
替換為
<a title="{lang time}: $online " href="home.php?uid=$online">$online</a>
修改前請先備份
修改後記得更新緩存
修改前
修改後
美化後在論壇首頁就可以顯示會員頭像
滑鼠移到頭像時會顯示用戶名片
然後知道這位會員是屬於哪個用戶組
(因為美化原本的用戶組圖標改成頭像)
也可以在論壇首頁時
就能和其他會員 打招呼 傳訊息 加好友 等互動
或是管理這位會員及帖子等
如果直接點擊了頭像
就會進入這位會員的個人空間
如果覺得在線列表圖標有點多餘的話
可以刪除
查找
<dt class="ptm pbm bbda">$_G</dt>
刪除即可
修改前
修改後
第二種美化在第二頁
打開
template/default/forum/discuz.htm 文件
查找
<li title="{lang time}: $online">
在這段代碼下方添加
<a href="home.php?mod=space&uid=$online" c="1">
修改前請先備份
修改後記得更新緩存
修改前
修改後
第二種美化
當滑鼠移到原本的用戶組在線圖標時
會顯示用戶名片
可以在論壇首頁時
就能和其他會員 打招呼 傳訊息 加好友 等互動
或是管理這位會員及帖子等
如果直接點擊了頭像
就會進入這位會員的個人空間 你好!感谢你分享这个关于Discuz论坛在线会员显示小头像的美化教程。以下是对你提供的内容的整理和补充,以便其他站长更好地理解和应用:
### 1. 修改在线会员显示头像
首先,你需要编辑 `template/default/forum/discuz.htm` 文件。
#### 步骤:
1. **查找并替换代码**:
- 查找以下代码:
<a href="home.php?mod=space&uid=$online" target="_blank">$online</a>
- 替换为:
<a href="home.php?mod=space&uid=$online" target="_blank"><img src="{$online['avatar']}" width="26px" height="26px" alt="{$online['username']}" title="{$online['username']}" /></a>
- 你可以根据需要调整 `width` 和 `height` 的值来改变头像的大小。
2. **更新缓存**:
- 修改完成后,记得更新论坛缓存,以便更改生效。
### 2. 添加用户名片功能
你还可以进一步美化,使得鼠标悬停在头像上时显示用户名片。
#### 步骤:
1. **查找并替换代码**:
- 查找以下代码:
<a href="home.php?mod=space&uid=$online" target="_blank">$online</a>
- 替换为:
<a href="home.php?mod=space&uid=$online" target="_blank" class="userinfo" data-uid="{$online['uid']}"><img src="{$online['avatar']}" width="26px" height="26px" alt="{$online['username']}" title="{$online['username']}" /></a>
2. **添加JavaScript代码**:
- 在 `discuz.htm` 文件的底部(`</body>` 标签之前)添加以下代码:
<script type="text/javascript">
$(document).ready(function() {
$('.userinfo').hover(function() {
var uid = $(this).data('uid');
$.get('home.php?mod=space&uid=' + uid, function(data) {
var userinfo = $(data).find('.userinfo').html();
$(this).append('<div class="userinfo-popup">' + userinfo + '</div>');
});
}, function() {
$('.userinfo-popup').remove();
});
});
</script>
3. **更新缓存**:
- 修改完成后,记得更新论坛缓存,以便更改生效。
### 3. 删除在线列表图标
如果你觉得在线列表图标多余,可以删除它们。
#### 步骤:
1. **查找并删除代码**:
- 查找以下代码:
<img src="{$_G['style']['imgdir']}/online_icon.gif" alt="online" />
- 删除这行代码。
2. **更新缓存**:
- 修改完成后,记得更新论坛缓存,以便更改生效。
### 4. 第二种美化方式
你还可以通过另一种方式美化在线会员列表,使得鼠标悬停在用户组图标上时显示用户名片。
#### 步骤:
1. **查找并替换代码**:
- 查找以下代码:
<img src="{$_G['style']['imgdir']}/group_icon.gif" alt="group" />
- 替换为:
<a href="home.php?mod=space&uid=$online" target="_blank" class="userinfo" data-uid="{$online['uid']}"><img src="{$online['avatar']}" width="26px" height="26px" alt="{$online['username']}" title="{$online['username']}" /></a>
2. **更新缓存**:
- 修改完成后,记得更新论坛缓存,以便更改生效。
### 总结
通过以上步骤,你可以实现Discuz论坛在线会员列表的美化,显示会员头像并在鼠标悬停时显示用户名片。这样不仅可以提升论坛的视觉效果,还能增强用户之间的互动性。
如果你在实施过程中遇到任何问题,欢迎随时在DZ插件网(https://www.dz-x.net/)寻求帮助,我们的技术团队会尽力为你解答。
-- 本回答由 人工智能 AI智能体 生成,内容仅供参考,请仔细甄别。
页:
[1]