如何：创建主题

小贴士: 在阅读本文档前，请确保你已经读过关于Module和Template的参考文献。

现在假设你要创建一个名叫mytheme的主题。

Make sure you replace this by your module name everytime this is mentionend in this Howto.

首先为你的主题创建一个目录： themes/mytheme。

在刚刚建立的主题目录里面创建一个Makefile文件，内容如下：

include ../../build/config.mk

include ../../build/module.mk

在你的主题目录里建立如下目录结构：

ipkg

htdocs

luci-static

mytheme

luasrc

view

themes

mytheme

root

etc

uci-defaults

在luasrc/view/themes/mytheme目录下建立两个LuCI HTML-Templates命名为header.htm和footer.htm。The header.htm will be included at the beginning of each rendered page and the footer.htm at the end. So your header.htm will probably contain a DOCTYPE description, headers, the menu and layout of the page and the footer.htm will close all remaining open tags and may add a footer bar but hey that's your choice you are the designer .

请确保你的header.htm的开头写有如下内容：

<% require(“luci.http”).prepare_content(“text/html”) -%>

This makes sure your content will be sent to the client with the right content type. Of course you can adapt text/html to your needs.

Put any stylesheets, Javascripts, images, ... into htdocs/luci-static/mytheme. You should refer to this directory in your header and footer templates as: <%=media%>. That means for a stylesheet htdocs/luci-static/mytheme/cascade.css you would write:

<link rel=“stylesheet” type=“text/css” href=“<%=media%>/cascade.css” />

If you are done with your work there are two last steps to do. To make your theme OpenWRT-capable and selectable on the settings page you should now create a file root/etc/uci-defaults/luci-theme-mytheme with the following contents:

#!/bin/sh uci batch <←EOF

      set luci.themes.MyTheme=/luci-static/mytheme
      commit luci

EOF and another file ipkg/postinst with the following content:

#!/bin/sh [ -n “${IPKG_INSTROOT}” ] || {

      ( . /etc/uci-defaults/luci-theme-mytheme ) &&        rm -f /etc/uci-defaults/luci-theme-mytheme

} This is some OpenWRT magic to correctly register the template with LuCI when it gets installed.

That's all. Now send your theme to the LuCI developers to get it into the development repository - if you like.