繁體
|
簡體
Sclub交友聊天~加入聊天室當版主
(檢舉)
分享
新浪微博
QQ空间
人人网
腾讯微博
Facebook
Google+
Plurk
Twitter
Line
標題:
[分享]
超美觀!!!調用論壇熱點-首頁或主題列表頁三格列式
[打印本頁]
作者:
n7197
時間:
2012-5-10 18:36
標題:
超美觀!!!調用論壇熱點-首頁或主題列表頁三格列式
總共為三步驟-*皆為添增主題列表
下載
(108.52 KB)
2012-5-10 18:11
第一步驟:
工具 » 數據調用
添加主題列表
所在版塊:全部的開放版塊
顯示數據條數:8
標題最大字節數:50
鏈接打開位置:在當前窗口打開 或 在新窗口打開
主題排序方式: 240 小時內瀏覽次數倒序排序
其餘為默認
調用代碼:
<div id="hot2" style="display:none" align="left">
<div class="ad_text" id="ad_text_div">
<table summary="Text Ad" cellpadding="0" cellspacing="1" >
<tr>
<td width="100%">
<div id="ad_text_1" align="left">
</div>
</td>
</tr>
</table>
</div>
</div>
<div id="hot1" style="display:none">
<style type="text/css">
/* Powered by Vover! Team 5d6d'libingyan'fans */
#ad_text_div{
margin:0px auto 0px;
padding:0px 0px;
width:960px; /*這裡依據貴站主體表格寬度更改,一般為960px,如果是全屏風格,大概95%左右*/
}
#hot {
margin-bottom: 20px;
}
#hot h3 {
margin-bottom: 10px;
font-size: 14px;
color: #999;
}
#hot .desc {
color: #666;
}
#hot .desc a {
color: #09C;
}
#hot .cite,#hot cite,#hot cite a {
color: #999;
}
#hot dt,#hot li {
background: url(http://homepage8.seed.net.tw/web@5/n7197/1106302023f4ca5db9ae64b640.gif) no-repeat 0 50%;
position: relative;
}
#hot_img {
float: left;
padding-right: 14px;
width: 200px;
border-right: 1px dashed #E6E7E1;
}
#hot_img img {
margin-bottom: 1em;
padding: 2px;
width: 200px;
height: 150px;
border: 1px solid #E6E7E1;
}
#hot_img h2 {
position: relative;
}
.desc {
padding: 5px 0;
}
.img #hot_main {
float: right;
margin-left: -230px;
width: 100%;
}
.img dl,.img ul {
margin-left: 230px;
}
#hot dt strong {
margin-right: 1em;
}
#hot dl {
border-top: 1px dashed #E6E7E1;
}
#hot dt,#hot dd {
padding-left: 10px;
}
#hot dt {
padding-top: 8px;
background-position: 0 15px;
}
#hot dd {
padding-bottom: 8px;
border-bottom: 1px dashed #E6E7E1;
color: #666;
}
#hot ul {
padding: 8px 0;
border-bottom: 1px dashed #E6E7E1;
}
#hot li {
float: left;
width: 49.5%;
line-height: 22px;
height: 22px;
text-indent: 10px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
#hot .deloption {
position: absolute;
right: 0;
margin: 0;
border: 3px solid #f5f5f5;
background-color: #f5f5f5;
}
.sidebar,#infoside,#sidebar_img {
display: none!important;
}
.with_side .main,.with_side .content {
margin-left: 0px!important;
}
#ad_text_div{
margin:0px auto 0px;
padding:0px 0px;
}
/* Powered by dzcode! Team 5d6d'libingyan'fans */
</style>
<div id="hot" class="s_clear img">
<h3>
論壇熱點
</h3>
<div id="hot_main">
<div id="hot_girl">
</div>
<ul class="s_clear">
[node]
<li>
<a href="{link}">
{subject_nolink}
</a>
</li>
[/node]
</ul>
</div>
<div id="hot_img">
</div>
</div>
</div>
<script>
if (document.getElementById("ad_text_1") != null) {
document.getElementById("ad_text_1").innerHTML = $("hot1").innerHTML;
}
if (document.getElementById("ad_text") != null) {
document.getElementById("ad_text").innerHTML = $("hot2").innerHTML;
}
</script>
複製代碼
第二步驟:
工具 » 數據調用
添加主題列表
所在版塊:全部的開放版塊
顯示數據條數:1
標題最大字節數:20
主題簡短內容最大字節數:64
鏈接打開位置:在當前窗口打開 或 在新窗口打開
主題排序方式: 1680 小時內瀏覽次數倒序排序
其餘為默認
調用代碼:
<div id="hot_img_1" style="display:none">
[node]
<a href="{link}"><img src="{imgattach}" width="204" height="154" width="224" onclick="zoom(this, this.src)" alt="{subject_full}" /></a>
<h2>
熱圖推薦:<a href="{link}" class="lightlink">{subject_nolink}</a>
</h2>
<p class="desc">
{message}
<a href="{link}" class="lightlink">查看全文</a>
</p>
<cite>
{author} 發表於 {dateline}
</cite>
[/node]
</div>
<script>
if (document.getElementById("hot_img") != null) {
document.getElementById("hot_img").innerHTML = $("hot_img_1").innerHTML;
}
</script>
複製代碼
第三步驟:
工具 » 數據調用
添加主題列表
所在版塊:全部的開放版塊
顯示數據條數:2
標題最大字節數:50
主題簡短內容最大字節數:210
鏈接打開位置:在當前窗口打開 或 在新窗口打開
主題排序方式: 8760 小時內瀏覽次數倒序排序
其餘為默認
調用代碼:
<div id="hot_boy" style="display:none">
[node]
<dl>
<dt>
<strong>
<a href="{link}" class="lightlink">{subject_nolink}</a>
</strong>
<cite>
{author}
</cite>
</dt>
<dd class="desc">
{message}
<a href="{link}" class="lightlink">查看全文</a>
</dd>
</dl>
[/node]
</div>
<script>
if (document.getElementById("hot_girl") != null) {
document.getElementById("hot_girl").innerHTML = $("hot_boy").innerHTML;
}
</script>
複製代碼
全局 - 啟用邊欄: 選擇"是"
界面 » 界面設置 - 首頁或主題列表頁都可
將新建的三個主題列表打勾可用 - 顯示順序 : 可依步驟 其實應該沒差
圖片附件:
sshot-2.jpg
(2012-5-10 18:11, 108.52 KB) / 下載次數 1668
http://s-club.tw/discuz/attachment.php?aid=3257&k=82fa062e132ed77a4b704b5b7cb9973c&t=1732387033&sid=ZY8KpO
作者:
0857
時間:
2012-5-10 18:41
謝分享~~
下載
(18.23 KB)
2012-5-10 18:41
圖片附件:
14df4ccd4c8fc8.gif
(2012-5-10 18:41, 18.23 KB) / 下載次數 1542
http://s-club.tw/discuz/attachment.php?aid=3260&k=1fe8179c579eac1d76a65f1f553bc2bc&t=1732387033&sid=ZY8KpO
作者:
{藍妹}
時間:
2012-5-19 02:02
回復
1#
n7197
謝謝 你
作者:
asterisk
時間:
2012-5-19 03:28
繼續學習
作者:
8301853
時間:
2012-5-20 09:01
曾经用过....挺不错的
歡迎光臨 SCLUB免費論壇申請-使用者論壇 (http://s-club.tw/discuz/)
Powered by Discuz! 7.2