[借放]手把手学习模块设置 打造个性个人门户网站

<DIV align=center>手把手学习模块设置 打造个性个人门户网站</DIV>
<DIV></DIV>
<DIV>“模块化”设计是X-Space的强大功能特色之一，随我一起用X-Space的模块建立特色个人门户吧。</DIV>
<DIV>一、什么是模块</DIV>
<DIV>所谓模块,就是指将软件或产品的功能单独化、部件化。这样当产品要扩展功能时，就可以通过安装这些模块来实现。通俗上讲模块化产品就好比我们小时玩过的积木一样，扩展模块卸载模块和搭积木一样简单。用户如果要对网站首页进行修改、对栏目进行增删，不用担心自己不懂代码，X-Space已将首页分解成一个个模块。如果想修改首页某个栏目，利用可视化的后台直接在模块上进行修改即可。通俗的讲，模块就好比我们小时玩过的积木一样，按照图纸进行组装卸载就可以了。</DIV>
<DIV></DIV>
<DIV>二、X-Space模块在哪里</DIV>
<DIV>既然上面提到X-Space系统的优势就在于功能的模块化，那么它究竟是如何通过模块实现个人门户的个性化呢？首先我们来看看默认情况下X-Space系统的界面。</DIV>
<DIV></DIV>
<DIV>X-Space系统默认主页上有很多栏目，最上方的是“个人空间排行”与“日志信息”。往下是“最新日志”、“热门文章”与“图片”、“推荐商品”与“相关内容的链接”以及“友情链接”和“版本信息”。</DIV>
<DIV>图1-17、图1-18、图1-19、图1-20：网站首页模块</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-17.jpg\" target=_blank><IMG height=310 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-17.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-18.jpg\" target=_blank><IMG height=326 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-18.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-19.jpg\" target=_blank><IMG height=257 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-19.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-20.jpg\" target=_blank><IMG height=109 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-20.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>实际上我们刚刚看到的所有栏目都是独立存在的，这就是前面所说的模块”。</DIV>
<DIV></DIV>
<DIV>进入X-Space的管理平台后点[模块]—>[模块列表]可以看到所有模块信息。</DIV>
<DIV>图1-21：浏览模块；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-21.jpg\" target=_blank><IMG height=129 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-21.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>
<DIV>可以查看到每个模块所对应的类别。</DIV>
<DIV>图1-22：查看模块所对应的类别；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-22.jpg\" target=_blank><IMG height=182 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-22.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>登录服务器，在X-Space安的目录中的“templates\\default”文件夹下可以看到所有模块对应的文件，默认情况下一共有49个模块文件。</DIV>
<DIV>图1-23：X-Space安装目录中的模块文件；</DIV>
<DIV></DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-23.jpg\" target=_blank><IMG height=232 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-23.jpg\" width=480></A></DIV>
<DIV>打开“templates\\default”文件夹下的“index.html.php”文件时可以更清晰的看到各个模块是如何加载的。</DIV>
<DIV>图1-24：模块文件；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-24.jpg\" target=_blank><IMG height=498 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-24.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>
<DIV>从“templates\\default”文件夹下的各个模块的文件名，也可以来分辨它所对应的栏目，例如以goods开头名称对应的都是商品相关的栏目。</DIV>
<DIV>图1-25：商品栏目下的文件；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-25.jpg\" target=_blank><IMG height=324 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-25.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>三、手把手教你设置X-Space模块</DIV>
<DIV>接下来通过多个实例进行讲解如何通过X-Space的模块机制打造个性个人门户网站。</DIV>
<DIV></DIV>
<DIV>实例1：修改版权模块的默认信息</DIV>
<DIV>有时模块的默认信息不符合网站的要求，特别是一些文本信息。在默认X-Space系统首页的最下方有一行X-Space的版权信息，我们想修改为自己的信息。</DIV>
<DIV>图1-26：默认系统下的版权信息；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-26.jpg\" target=_blank><IMG height=76 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-26.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>第1步：上面提到了X-Space安装目录中的“templates\\default”文件夹存放着所有模块，而通过index.html.php文件可以更清晰的看到各个模块是如何加载的。我们打开“index.html.php”文件，找到“{template footer}”语句，它的意思是在此加载footer模块。</DIV>
<DIV>图1-27：找到“{template footer}”语句；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-27.jpg\" target=_blank><IMG height=273 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-27.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>
<DIV>第2步：然后在“templates\\default”文件夹中找到“footer.html.php”文件，对其进行修改。图1-28：修改“footer.html.php”文件；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-28.jpg\" target=_blank><IMG height=285 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-28.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>第3步：修改完毕后再次打开X-Space首页，最下方的版权信息将显示修改后的内容。</DIV>
<DIV>图1-29：修改后的版权信息；</DIV>
<DIV>（提示：编辑模块内容的方法主要适用于相应模块在首页中以文本或超级链接形式存在的模块。）</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-29.jpg\" target=_blank><IMG height=79 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-29.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>实例2：修改分类列表默认信息</DIV>
<DIV>在X-Space默认首页下方有一大串分类列表，默认情况下的各个分类名称或许并不符合自己网站要求，我们可以对其进行修改为自己满意的分类。</DIV>
<DIV>图1-30：默认首页下的分类；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-30.jpg\" target=_blank><IMG height=123 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-30.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>第1步：进入到X-Space系统的管理平台，然后点[分类]—>[日志分类]， 可以看到网站的下的各个类别。</DIV>
<DIV>图1-31：点击[日志分类]，查看到所以类别；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-31.jpg\" target=_blank><IMG height=201 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-31.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>
<DIV>第2步：选择一个类别点右边的[编辑]，在日志分类基本信息处输入符合自己要求的[分类名称]，然后点[提交]按钮。</DIV>
<DIV>图1-32：编辑类别；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-32.jpg\" target=_blank><IMG height=195 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-32.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>第3步：通过上一步反复操作，并把不需要的分类“删除”。</DIV>
<DIV>图1-33：删除类别；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-33.jpg\" target=_blank><IMG height=123 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-33.jpg\" width=480></A></DIV>
<DIV>第4步：点“提交”按钮保存设置。</DIV>
<DIV>图1-34：保存设置；</DIV>
<DIV><IMG alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-34.jpg\"></DIV>
<DIV></DIV>
<DIV>第5步：默认情况下X-Space是开启缓存的，所以相应的信息更新需要一定时间，我们[其他]—>[更新缓存]进行手工更新。</DIV>
<DIV>图1-35：更新缓存；</DIV>
<DIV><IMG alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-35.jpg\"></DIV>
<DIV></DIV>
<DIV>
<DIV>第6步：接下来点[全部清空]按钮更新所有缓存信息。</DIV>
<DIV>图1-36：全部清空所有缓存信息；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-36.jpg\" target=_blank><IMG height=114 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-36.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>第7步：更新完毕，再次查看主页会看到新设置的分类信息已经显示出来了。</DIV>
<DIV>图1-37：更新后的页面；</DIV>
<DIV>按照同样方法，可以把对其他分类进行修改。</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-37.jpg\" target=_blank><IMG height=105 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-37.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>实例3：删除“图片”与“推荐商品”栏目</DIV>
<DIV>默认情况下X-Space首页显示的栏目过多，对于中小门户网站来说并不是所有栏目都需要的，那么我们如何删除不用的模块让首页更加简洁清新呢？比如，默认的X-Space首页的“图片”与“推荐商品”栏目占地比较大，而且实际用途不大。希望将其从首页中删除。</DIV>
<DIV>图1-38：默认首页下的栏目；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-38.jpg\" target=_blank><IMG height=163 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-38.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>第1<SPAN>步：打开“templates\\default</SPAN><SPAN>”文件夹下的“index.html.php</SPAN><SPAN>”文件。</SPAN>[l1]<SPAN></SPAN></DIV>
<DIV></DIV>
<DIV>第2步：在“index.html.php”内容中找到[商品区]，将“<!--商品区-->与<!--/商品区-->”之间的内容删除。</DIV>
<DIV>图1-39：要删除的内容；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-39.jpg\" target=_blank><IMG height=498 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-39.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>
<DIV>第3步：继续在“index.html.php”内容中找[图片区]，将“<!--图片区-->与<!--/图片区-->”之间的内容删除。</DIV>
<DIV>图1-40：要删除的内容；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-40.jpg\" target=_blank><IMG height=388 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-40.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>第4步：保存退出，再次访问X-Space的首页就会发现[图片]与[商品]栏目都消失。</DIV>
<DIV>图1-41：查看修改后的页面；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-41.jpg\" target=_blank><IMG height=233 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-41.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>（注意：在删除不用模块之前一定要把index.html.php与X-Space安装目录中的index.php文件进行备份，否则你将无法恢复删除的模块。）</DIV>
<DIV></DIV>
<DIV>实例4：因为每个人都对个人门户站点有自己的规划，默认栏目的排列与布局不一定合乎你的要求，这时就需要我们手动调整各个模块对应的栏目位置了。比如，要将默认的[个人空间排行]修改为[论坛最新主题列表]默认情况下X-Space首页右上方是[个人空间排行]，我们要对其进行修改。</DIV>
<DIV>图1-42：默认的[个人空间排行]；</DIV>
<DIV><IMG alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-42.jpg\"></DIV>
<DIV></DIV>
<DIV>
<DIV>第1步：进入X-Space系统的管理平台，选择[模块]—>[模块列表]，然后到[论坛主题]类别中寻找相应模块信息。</DIV>
<DIV></DIV>
<DIV>第2步：在[论坛主题]模块中我们看到了名为[论坛最新主题列表 不含发帖用户ID]的模块，其对应的内容如下“<!--论坛最新主题列表 不含发帖用户ID(共15条) begin--><!--{block name=\"bbsthread\" parameter=\"order/dateline DESC/limit/0,15/cachetime/1800/bbsurltype/bbs/tpl/thread_subject_list\"}--><!--论坛最新主题列表 不含发帖用户ID(共15条) end-->”，复制该段代码；</DIV>
<DIV>图1-43：打开模块；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-43.jpg\" target=_blank><IMG height=189 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-43.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>第3步：在X-Space安装目录的“templates\\default”文件夹中找到“index.html.php”，打开他，查找“用户空间排名”信息。</DIV>
<DIV>图1-44：查找“用户空间排名”信息；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-44.jpg\" target=_blank><IMG height=498 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-44.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>
<DIV>第4步：用刚才复制的代码覆盖“用户空间排名”对应的代码。</DIV>
<DIV></DIV>
<DIV>第5步：另外我们还需要把栏目名称进行修改，将“用户空间排名”对应代码上的“<h3>{lang tpl_index_spacetop}</h3>”修改为“<h3>论坛最新主题列表</h3>”。</DIV>
<DIV></DIV>
<DIV>第6步：在X-Space管理平台中清空全部缓存信息。</DIV>
<DIV></DIV>
<DIV>第7步：再次访问X-Space首页时就会看到原本是[用户空间排名]的地方已经变成[论坛最新主题列表]了。</DIV>
<DIV>图1-45：修改后的页面；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-45.jpg\" target=_blank><IMG height=448 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-45.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>第8步：默认情况下[论坛最新主题列表]模块将显示最新的15条帖子。</DIV>
<DIV>图1-45：论坛最新主题列表；</DIV>
<DIV><A href=\"http://www.bitscn.com/upimg/Image/discuz/25/1-46.jpg\" target=_blank><IMG height=929 alt=\"\" src=\"http://www.bitscn.com/upimg/Image/discuz/25/1-46.jpg\" width=480></A></DIV>
<DIV></DIV>
<DIV>（提示：可以通过修改“论坛最新主题列表”模块代码中的“/limit/0,15/为/limit/0,17/”使其能够显示17条帖子。）</DIV>
<DIV>
<HR align=left width=\"33%\" SIZE=1>

<DIV>
<DIV language=JavaScript id=_com_1 onmouseover=\"msoCommentShow(\'_anchor_1\',\'_com_1\')\" onmouseout=\"msoCommentHide(\'_com_1\')\">
<DIV><SPAN><SPAN>[l1]</SPAN></SPAN>和实例1中的第一步同</DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV></DIV>