今天想聊聊layui论坛模板的二次开发，一开始我也是一头雾水，完全不知道从哪儿下手。

先摸清模板的基本结构

我做的第一件事就是把下载下来的模板文件夹整个翻了一遍。里面一堆css、js文件，还有html页面，看得我眼花缭乱。不过静下心来仔细看，发现主要就几个部分：前台页面、后台管理、静态资源这些。我特意把每个文件是干嘛用的都简单记了一下，免得后面改乱了。

动手改点简单的样式

熟悉了结构之后，我就想着先试试改个颜色什么的。找到那个叫*的文件，在里面搜“color”或者“background”，果然找到不少控制颜色的地方。我把顶部导航栏的颜色从蓝色换成了绿色，就这么一个小改动，页面立马看着就不一样了。这让我信心大增，原来二次开发也没那么可怕。

• 第一步：用浏览器打开论坛页面，按F12看看想改的那个部分对应的CSS类名是
• 第二步：去css文件里找到那个类名，把里面的颜色值改成自己喜欢的。
• 第三步：保存文件，刷新页面看看效果，不行就再调。

尝试修改页面布局

光改颜色不过瘾，我又想调整一下版块的位置。比如把帖子列表和侧边栏换个位置。这个就稍微复杂点了，得同时改html和css。我先找到显示帖子列表的那个html文件，看看它的结构是怎么写的，然后把那块代码整个剪切下来，粘贴到想放的位置。结果页面布局全乱了，侧边栏跑下面去了。我又赶紧去调css里的宽度和浮动属性，折腾了好半天，总算把布局给掰正了。这个过程虽然有点麻烦，但让我对页面结构的理解深了不少。

给论坛加个小功能

我觉得光调整样子还不够，就想自己加个功能。最简单的就是给帖子加个“点赞”按钮。我先在显示帖子的地方，找了个合适的位置，写了个按钮的html代码。然后去js文件里，找到处理帖子点击事件的地方，模仿着写了一段代码，就是点击这个按钮的时候，让一个计数数字加一。一开始点击根本没反应，检查了半天才发现是函数名写错了。改过来之后，一点击，数字果然增加了，当时可给我高兴坏了。

这么一圈折腾下来，我发现layui论坛模板二次开发就那几步：先看懂它原来的代码是怎么写的，然后从小地方开始动手改，改一点就看看效果，慢慢就能摸出门道了。最重要的就是别怕出错，多试几次就会了。