Building themes

Building themes

Understanding themes

Understanding themes Theme building isn't that hard once you know the basic principle. Every theme contains one or more layouts. A layout is the type of page. For example a contact, agenda or blog page. Every layout on its way is build of several parts. A part is for example the header, content, right side and footer.

This same structure corresponds in the directory structure. So, the theme folder contains the folders of the layouts and every layout folder contains the folders of the parts. Every folder contains in their way several files. These files correspond to the H4 Frameworks MVC model.

Model view controller

Model view controller Every theme, layout and part can contain several types of scripts. The controller (control.php), the view (view.tpl) and the model (model.php). Only the theme is an exception. Since the theme is the root containing all the layouts the theme doesn't need a view file.

The MVC model of the H4 Framework is probably a bit different from your standard MVC model (Since the view doesn't communicate with the model). In the image to the right the communication between the different parts is visualized. As you can clearly see the controller file is the central part and communicates to the front- (user) and back- (server) end. The main reason for this model is to offer the developer a structured and controlled environment.

Server and Client side

Server and Client side

Every theme has a server and a client side. The server side contains the theme scripts, setups and templates. The client side contains only the graphical parts like the style sheets (CSS files) and images used in the CSS. Important to know is that the client side can be on a different server then the server side. This because the client retrieves its data remotely where the framework functions like an API. Besides these files the client side also contains an automatically generated index.php and .htaccess file. We start with explaining how a server sided theme is build. At the end we will explain how the client side functions.