Building a Theme Project
The first question that needs to be answered when using WireBootstrap with a new Bootstrap themes is how best to integrate the two. While every theme is different in some way including how assets are organized or what is included in each, there are some best practices and things to consider that have worked well in the past. These are shared here on this page.
Examples
Existing WireBootstrap theme projects are a great reference for how to go about integrating with a new theme. The WireBootstrap for Gentelella project can be download for free. This project is a TypeScript project but a theme project can also be written in plain JavaScript and include integrations with other frameworks.
Scaffolding
Start development by creating an empty page that will be used as a template for all pages in the theme project. This is usually a page with references to web frameworks such as Bootstrap and the core WireBootstrap library with an empty body
tag.
Below is an excerpt from the WireBootstrap for Gentelella empty-page.html
template page.
Cards/Panels
Cards or panels are a staple UI component that provide the boxed borders for most content inside of an application developed using a theme. Its a good idea to also create an empty card template for this purpose.
Below is an excerpt from the WireBootstrap for Gentelella empty-panel.html
card template.
Project
Concerns related to the theme project center mainly on the project assets relative to the theme assets. This includes both application code and references to theme files such as CSS and JavaScript libraries.
Theme Assets
Deploying assets is a little easier if the theme is open source and the theme files can be distributed with the WireBootstrap theme project. If not, the project will have to be unzipped into an existing directory containing the theme. WireBootstrap for Gentelella contains the theme assets in the download while a theme such as WireBootstrap for Color Admin needs to be unzipped into a directory containing the purchased/licensed theme.
Code
The application code for theme projects are usually written in TypeScript or plain JavaScript. There may also be server-side components written in PHP, C# or other languages needed but these would most likely be specialty features that exist outside of the theme.
Web Frameworks
Components
Questions
Last updated
Was this helpful?