| Responsible | System |
|---|---|
| Last Update | 07/21/2026 |
| Completion Time | 3 days 3 hours |
| Members | 1 |
Themes & Design
Theme Selection
Go to Website > Configuration > Themes. Quickenerp ships with dozens of ready-made themes to choose from, covering common industries out of the box (retail, real estate, restaurant, professional services, e-commerce storefronts, and more) — pick one as a starting point instead of building every page from a blank layout, then customize colors, fonts, and content on top.
Switching themes later is possible but re-applies the new theme's default styling — customized pages built with individually-edited blocks are generally preserved, but heavily theme-specific layouts may need touch-ups after a switch. Preview a theme before committing on a production site.
Customizing Theme Colors
In Edit mode:
- Click Theme button (top toolbar).
- Color Palette – Choose from presets or define custom colors.
- Fonts – Heading and body font families.
- Button Style – Default button shape (rounded, square, pill).
- Layout – Container width, gutter spacing.
- Header – Transparent, fixed, classic.
- Footer – Minimal, detailed, with social links.
Custom CSS / SCSS
For advanced styling:
- Go to Website > Configuration > Settings > Custom Code.
- Add Custom CSS or Custom JavaScript.
- Changes apply site-wide. Use browser DevTools to inspect elements.
Responsive Preview
In Edit mode, click the device icons (Desktop, Tablet, Mobile) to preview responsive behavior. Adjust block visibility per device in block settings.
Website Overview
View allThemes & Design
Theme Selection
Go to Website > Configuration > Themes. Quickenerp ships with dozens of ready-made themes to choose from, covering common industries out of the box (retail, real estate, restaurant, professional services, e-commerce storefronts, and more) — pick one as a starting point instead of building every page from a blank layout, then customize colors, fonts, and content on top.
Switching themes later is possible but re-applies the new theme's default styling — customized pages built with individually-edited blocks are generally preserved, but heavily theme-specific layouts may need touch-ups after a switch. Preview a theme before committing on a production site.
Customizing Theme Colors
In Edit mode:
- Click Theme button (top toolbar).
- Color Palette – Choose from presets or define custom colors.
- Fonts – Heading and body font families.
- Button Style – Default button shape (rounded, square, pill).
- Layout – Container width, gutter spacing.
- Header – Transparent, fixed, classic.
- Footer – Minimal, detailed, with social links.
Custom CSS / SCSS
For advanced styling:
- Go to Website > Configuration > Settings > Custom Code.
- Add Custom CSS or Custom JavaScript.
- Changes apply site-wide. Use browser DevTools to inspect elements.
Responsive Preview
In Edit mode, click the device icons (Desktop, Tablet, Mobile) to preview responsive behavior. Adjust block visibility per device in block settings.
Creating & Editing Pages
Adding a Page
- Enter Edit mode on the website.
- Click + New (top left) → New Page.
- Enter page Name (used for menu if selected).
- Select a Layout (Full Width, Boxed, With Sidebar).
- Start with blank or Duplicate an existing page.
- The page URL auto-generates from the name (e.g. /about-us).
Using the Builder
- Snippets – Panel on the left. Drag blocks onto the page.
- Block Types: Paragraph, Title, Image, Video, Button, Separator, Table, Bullet List, Quote.
- Structure Blocks: Columns, Grid, Slider, Accordion, Tabs, Counters, Timeline.
- Content Blocks: Features, Team Grid, Pricing Table, Testimonials, Call to Action.
Editing Blocks
Click any block to select it. The inline editor allows:
- Text editing with rich formatting (bold, italic, links).
- Image replacement.
- Column width resizing.
- Custom CSS class (for advanced users).
- Move (drag handle), Duplicate, Delete.
- Animation (fade, slide, zoom on scroll).
Page Properties
In Edit mode, click Page Options (gear icon). Set:
- SEO – Meta title, meta description, canonical URL, og:image.
- Indexation – Allow or prevent search engine indexing.
- Follow – Follow or nofollow links.
- Translations – Link to translated versions.
- Header / Footer – Override per page or inherit from theme.
Page Versions & Publishing
A page can be Unpublished (only visible to internal users while you work on it) or Published (live to the public). Toggle with the switch top-right of the builder. Unpublished pages are a safe way to draft new content without visitors seeing a half-finished page.
The Website Module
The Website module provides a drag-and-drop website builder with responsive themes, SEO tools, forms, blogs, and eCommerce integration.
Core Concepts
| Concept | Model | Description |
|---|---|---|
| Website | website | A website instance. You can run multiple separate websites (different domains/languages) from one database. |
| Page | website.page | A URL on the website with HTML content. |
| Menu | website.menu | Navigation entries. Can have sub-menus. |
| Theme | website.theme | Visual design: colors, fonts, layouts. |
| Block / Snippet | UI component | Draggable content elements (text, image, button, form, slider). |
| Form | website.form | Contact forms, lead generation forms. |
Accessing the Website Builder
- Go to Website from the main dashboard.
- Toggle Edit mode (top right) to enter the builder.
- The Website menu also has:
- Site – Manage pages, menus, domains.
- Configuration – Settings, themes, analytics.
- Content – Blog posts, news, galleries.
Navigation & Menus
Go to Website > Site > Menus. Create main menu items and submenus. Each item links to a page, URL, or app. Reorder by sequence. Multi-level menus appear as dropdowns.