Skip to Content
Menu
This question has been flagged
3 Replies
3145 Views

How to create animated snippets in odoo?

Avatar
Discard
Best Answer

Hi Apple Mahmud im tryng to animate an img with gsap library. I installed it by cdn in header file and in snippet widget too but nothing. The library is correctly loaded. I saw that on inspector and console network too. The status is ok. I wrote the gsap code animation inside js file of odoo website , i can see the markers too. But the animation still not work. Any advice ?

Avatar
Discard
Best Answer

To create animated snippets in Odoo, you can use the built-in animation features provided by the website builder module. Here's a step-by-step guide:

1. Log in to your Odoo instance as an administrator.
2. Go to the website builder module.
3. Create a new page or open an existing one where you want to add the animated snippet.
4. Edit the page and locate the section where you want to add the animated snippet.
5. Click on the "Add Blocks" button or the "+" icon to add a new block.
6. In the block selection window, choose the "Snippet" block.
7. Drag and drop the snippet block into the desired section of the page.
8. Click on the snippet block to edit its content.
9. In the snippet editor, switch to the HTML mode.
10. Write or paste your HTML code for the animated snippet.
11. Save the changes and publish the page.

By adding your custom HTML code for the animated snippet, you can leverage various animation techniques such as CSS animations, JavaScript animations, or external libraries like jQuery or GSAP.

Here's an example of a simple CSS animation for a spinning element:


Animated Snippet






In the above example, the "animated-spin" class is applied to the div element, and the CSS animation "spin" is defined using `@keyframes`. Adjust the code according to your specific animation requirements.

Remember to consider the performance impact of animations on your website and use them judiciously to provide a good user experience.

Once you have added the animated snippet and published the page, you should be able to see the animation in action on your Odoo website.

I hope this helps! Let me know if you have any further questions.

Avatar
Discard
Related Posts Replies Views Activity
1
May 24
1978
2
Jun 23
2129
1
Jul 24
1443
2
Apr 24
3085
2
Jun 23
2285