Files
odoo-docs/content/developer/tutorials/website_theme.rst
2025-03-31 17:44:11 +02:00

54 lines
1.7 KiB
ReStructuredText

:show-content:
:show-toc:
:hide-page-toc:
=====================
Build a website theme
=====================
| For this project, we'll collaborate on creating a custom website theme fully integrated with Odoo.
| Our client, Airproof, has provided their latest design for their waterproof drone e-commerce,
which we'll replicate.
To start, you must have :doc:`installed Odoo locally <../../../administration/on_premise/source>`.
You will also need some knowledge in:
- XML
- JavaScript (not mandatory)
- Bootstrap 5.1.3
- SCSS
- QWeb (Odoo's own templating system)
- OWL (JavaScript framework, not mandatory)
| **Goal**
| Replicate the Airproof design.
.. image:: website_theme/airproof-home.png
:alt: Airproof homepage.
:align: center
| In the :file:`README.md` of the `Airproof module
<https://github.com/odoo/tutorials/tree/{CURRENT_MAJOR_BRANCH}/website_airproof>`_, you can find
the various Airproof designs that you will replicate throughout the different exercises in this
tutorial.
| You can also find all the code necessary for creating the Airproof website there. You should also
obtain this by the end of the tutorial. It is recommended to try solving the exercices first
without looking at the solution!
| **Don't go too fast!**
| Follow the exercises step by step and you will reach the final design at the end of the tutorial.
Read the documentation linked in the :doc:`How-to guide: Website theme <../howtos/website_themes>`.
Ready? Let's get started!
.. toctree::
:maxdepth: 2
website_theme/01_theming
website_theme/02_build_website
website_theme/03_customisation_part1
website_theme/04_customisation_part2
website_theme/05_dynamic_templates
website_theme/06_going_live