首页 > 电脑专区 > CMS教程 > 帝国cms >

DISCUZ修改门户文章列表页模板的方法

来源:互联网 2023-03-14 19:32:40 104

将discuz门户文章列表页模板修改为图片 标题 (文章分类 发布时间)的形式!ASm办公区 - 实用经验教程分享!

预览效果如下:ASm办公区 - 实用经验教程分享!

DISCUZ修改门户文章列表页模板的方法ASm办公区 - 实用经验教程分享!

工具/原料

文本编辑器

方法/步骤

1

找到template/default/portal/list.htm文件,将其复制一份到你们模版文件夹下:ASm办公区 - 实用经验教程分享!

重命名为list_名字.htmASm办公区 - 实用经验教程分享!

ASm办公区 - 实用经验教程分享!

ASm办公区 - 实用经验教程分享!

打开该文件,找到如下代码:ASm办公区 - 实用经验教程分享!

ASm办公区 - 实用经验教程分享!

<dl class="bbda cl">ASm办公区 - 实用经验教程分享!

<dt><a href="$article_url" target="_blank" $highlight>$value[title]</a> <!--{if $value[status] == 1}-->({lang moderate_need})<!--{/if}--></dt>ASm办公区 - 实用经验教程分享!

<dd class="xs2 cl">ASm办公区 - 实用经验教程分享!

<!--{if $value[pic]}--><div><a href="$article_url" target="_blank"><img src="$value[pic]" alt="$value[title]" /></a></div><!--{/if}-->ASm办公区 - 实用经验教程分享!

$value[summary]ASm办公区 - 实用经验教程分享!

</dd>ASm办公区 - 实用经验教程分享!

<dd>ASm办公区 - 实用经验教程分享!

<!--{if $value[catname] && $cat[subs]}-->{lang category}: <label><a href="{$portalcategory[$value['catid']]['caturl']}">$value[catname]</a></label><!--{/if}-->ASm办公区 - 实用经验教程分享!

<span> $value[dateline]</span>ASm办公区 - 实用经验教程分享!

<!--{if $_G['group']['allowmanagearticle'] || ($_G['group']['allowpostarticle'] && $value['uid'] == $_G['uid'] && (empty($_G['group']['allowpostarticlemod']) || $_G['group']['allowpostarticlemod'] && $value['status'] == 1)) || $categoryperm[$value['catid']]['allowmanage']}-->ASm办公区 - 实用经验教程分享!

<span>ASm办公区 - 实用经验教程分享!

<span>|</span>ASm办公区 - 实用经验教程分享!

<label><a href="portal.php?mod=portalcp&ac=article&op=edit&aid=$value[aid]">{lang edit}</a></label>ASm办公区 - 实用经验教程分享!

<span>|</span>ASm办公区 - 实用经验教程分享!

<label><a href="portal.php?mod=portalcp&ac=article&op=delete&aid=$value[aid]" id="article_delete_$value[aid]" onclick="showWindow(this.id, this.href, 'get', 0);">{lang delete}</a></label>ASm办公区 - 实用经验教程分享!

</span>ASm办公区 - 实用经验教程分享!

<!--{/if}-->ASm办公区 - 实用经验教程分享!

</dd>ASm办公区 - 实用经验教程分享!

</dl>ASm办公区 - 实用经验教程分享!

<!--{/loop}-->ASm办公区 - 实用经验教程分享!

</div>ASm办公区 - 实用经验教程分享!

ASm办公区 - 实用经验教程分享!

ASm办公区 - 实用经验教程分享!

将其修改为:ASm办公区 - 实用经验教程分享!

<dl class="bbda cl">ASm办公区 - 实用经验教程分享!

<dt class="xs2 cl">ASm办公区 - 实用经验教程分享!

<!--{if $value[pic]}--><div><a href="$article_url" target="_blank"><img src="$value[pic]" alt="$value[title]" /></a></div><!--{/if}-->ASm办公区 - 实用经验教程分享!

</dt>ASm办公区 - 实用经验教程分享!

<dd><a href="$article_url" target="_blank" $highlight>$value[title]</a> <!--{if $value[status] == 1}-->({lang moderate_need})<!--{/if}-->ASm办公区 - 实用经验教程分享!

</dd>ASm办公区 - 实用经验教程分享!

<dd>ASm办公区 - 实用经验教程分享!

<!--{if $value[catname] && $cat[subs]}-->{lang category}:ASm办公区 - 实用经验教程分享!

<label><a href="{$portalcategory[$value['catid']]['caturl']}">$value[catname]</a></label><!--{/if}-->ASm办公区 - 实用经验教程分享!

<span> $value[dateline]</span>ASm办公区 - 实用经验教程分享!

</dd>ASm办公区 - 实用经验教程分享!

<dd>ASm办公区 - 实用经验教程分享!

<!--{if $_G['group']['allowmanagearticle'] || ($_G['group']['allowpostarticle'] && $value['uid'] == $_G['uid'] && (empty($_G['group']['allowpostarticlemod']) || $_G['group']['allowpostarticlemod'] && $value['status'] == 1)) || $categoryperm[$value['catid']]['allowmanage']}-->ASm办公区 - 实用经验教程分享!

<span>ASm办公区 - 实用经验教程分享!

<span>|</span>ASm办公区 - 实用经验教程分享!

<label><a href="portal.php?mod=portalcp&ac=article&op=edit&aid=$value[aid]">{lang edit}</a></label>ASm办公区 - 实用经验教程分享!

<span>|</span>ASm办公区 - 实用经验教程分享!

<label><a href="portal.php?mod=portalcp&ac=article&op=delete&aid=$value[aid]" id="article_delete_$value[aid]" onclick="showWindow(this.id, this.href, 'get', 0);">{lang delete}</a></label>ASm办公区 - 实用经验教程分享!

</span>ASm办公区 - 实用经验教程分享!

<!--{/if}-->ASm办公区 - 实用经验教程分享!

</dd>ASm办公区 - 实用经验教程分享!

</dl>ASm办公区 - 实用经验教程分享!

ASm办公区 - 实用经验教程分享!

ASm办公区 - 实用经验教程分享!

这里我将编辑和删除功能按钮单独放到了下方。ASm办公区 - 实用经验教程分享!

修改后的样式如下图:ASm办公区 - 实用经验教程分享!

DISCUZ修改门户文章列表页模板的方法ASm办公区 - 实用经验教程分享!

2

修改样式:ASm办公区 - 实用经验教程分享!

接下来我们将这些循环的div块进行左浮动:ASm办公区 - 实用经验教程分享!

在你的模板文件下的common.css文件下写上:ASm办公区 - 实用经验教程分享!

.bbda{ASm办公区 - 实用经验教程分享!

float:left;ASm办公区 - 实用经验教程分享!

}ASm办公区 - 实用经验教程分享!

变成下图所示样式:ASm办公区 - 实用经验教程分享!

DISCUZ修改门户文章列表页模板的方法ASm办公区 - 实用经验教程分享!

3

我们发现正文部分有左边的内边距。ASm办公区 - 实用经验教程分享!

我们在common.css文件中写上:ASm办公区 - 实用经验教程分享!

.xld{ASm办公区 - 实用经验教程分享!

padding:0;ASm办公区 - 实用经验教程分享!

}ASm办公区 - 实用经验教程分享!

即可。ASm办公区 - 实用经验教程分享!

DISCUZ修改门户文章列表页模板的方法ASm办公区 - 实用经验教程分享!

4

每页显示个数与图片的大小根据需要自行修改ASm办公区 - 实用经验教程分享!

图片大小:ASm办公区 - 实用经验教程分享!

.xld .atc img{ASm办公区 - 实用经验教程分享!

max-width:190px;ASm办公区 - 实用经验教程分享!

max-height:190px;ASm办公区 - 实用经验教程分享!

}ASm办公区 - 实用经验教程分享!

标题居中:ASm办公区 - 实用经验教程分享!

.xld dd{ASm办公区 - 实用经验教程分享!

text-align:centerASm办公区 - 实用经验教程分享!

}ASm办公区 - 实用经验教程分享!

ASm办公区 - 实用经验教程分享!

修改之后的样式如上演示图、ASm办公区 - 实用经验教程分享!

注意事项

内外间距、图片大小、以及边框根据需要修改。

以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!ASm办公区 - 实用经验教程分享!


标签: 网站

办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号统计代码