Development Book V17: Serving static resources

To handle static resources in a custom module, particularly displaying an image on a web page, follow these steps:

Place your preferred image in the static directory within your custom module. For instance: /store/static/src/img/image.jpg

Proceed to define a controller.

@http.route(['/product], type='http', auth="user", website=True)
def product_details(self):
    product_ids = request.env['product.template'].sudo().search([]])
    image_url = '/store/static/src/img/image.jpg
   return request.render("shop.product_details_template", {product: product_ids, 'image_url': image_url})

In the provided code snippet, replace 'image_url' with the URL of your desired image. Subsequently, from the template, retrieve the 'image_url' and include it as follows:

< div class="form-group col-12 s_website_form">
    < img t-att-src="image_url"/>
< /div>

In this example, the image is showcased directly from /store/static/src/img/image.jpg

In Odoo, all files added within the static directory are recognized as static resources. In the provided example, our image resides within the /static/src/img directory. Similarly, various static resources can be organized within this directory:

For instance, CSS files can be included in the /static/src/css directory, while JavaScript files can reside in the /static/src/js directory, and so on.

whatsapp
location

Calicut

Cybrosys Technologies Pvt. Ltd.
Neospace, Kinfra Techno Park
Kakkancherry, Calicut
Kerala, India - 673635

location

Kochi

Cybrosys Technologies Pvt. Ltd.
1st Floor, Thapasya Building,
Infopark, Kakkanad,
Kochi, India - 682030.

location

Bangalore

Cybrosys Techno Solutions
The Estate, 8th Floor,
Dickenson Road,
Bangalore, India - 560042

Send Us A Message