ThemeMagic 是 t3 架构里可以定制模板主题的工具 .. 我们先去试一下 ... 在 t3 模板的配置界面上 ... 点击 ThemeMagic 按钮 ... 可以打开这个工具 ...

左边会有一些面板，可以配置相关的样式 .. 最上面可以选择模板里已有的主题 ... 然后你可以基于这个主题去定制 ...

右边可以预览所做的修改 ...

网格面板里可以修改的是跟页面布局相关的东西 ... 你可以设置不同条件下的页面的整体的宽度 ... 还有每一个网格的宽度，另外还有网格与网格之间的空间 ...

T3 架构的模板使用了 Bootstrap 里的网格系统，有兴趣可以看一下宁皓网的 Bootstrap 相关的课程 ..

再看一下 脚手架构 这个面板 .. 这里我们可以设置背景，文字，还有链接的颜色 ..

我们可以改一下链接的颜色 ... 选择一种红色 ...

然后点击 预览 ... 你可以看到页面的变化 ... 这个链接的颜色不仅仅可以影响文字链接的颜色 ... 激活菜单项的背景 ... 按钮的背景都会基于我们选择的颜色重新生成 ...

再看一下 视觉 ... 元素圆角可以为表单元素添加一个圆角样式 ...

另外这里还有一个 反向样式的导航栏 ... 选择是 ... 预览 .. 导航栏会变成深色的背景 ... （改回来）

定制完成以后，我们可以把当前的样式保存成一个新的主题 ...

点击 预览 按钮右边的向下的三角形 ... 选择 另存为 ....

在弹出的对话框里输入新的主题的名称 ... 我们叫它 ninghao-red ... 确定 ...

打开这个主题的列表 ... 里面会有我们刚才创建的新的主题 ... 现在我们就可以把新的主题分配到模板风格里去使用了 ...

位置

打开 Joomla 所在的目录 ... templates ... t3_blank ... less ... themes ... 模板里的主题会放在这个 themes 目录的下面 ...

在这里除了模板默认的主题，还有我们刚才创建的 ninghao-red 这个主题 ....

这个主题里就是一些 Less 文件 ... Less 是把编程的思想放在了 css 上面 .. 比如你可以定义变量 .. 在样式声明里可以使用这个变量 ... 当我们把 less 文件编译成真正的 css 样式表的时候，所在使用了这个变量的地方都会动态的替换成变量里的值 ...

使用 less 的方法为网站撰写样式，比较容易维护 ...