In this article, we will discuss How to Use Particles Section Addon with Background Transition Widget in the same Elementor Section.
First of all, you have to know that using Premium Particles Section Addon will generate a CSS ID (automatically) to its Elementor Section, so it overrides any CSS ID you set (manually) for Elementor Section.
On the other hand, to use Background Transition Widget for Elementor you will have to Add Specific CSS ID to each Elementor Section (manually) so that Elementor sections get that seamless colorful transitioning effect. Click here to check Premium Background Transition Widget tutorial.
Particles Section Addon generated CSS ID would override any CSS ID you have set for Background Transition Section, this would result in a conflict in the section that is using Background Transition Widget, both Background Transition Widget, and Particles Addon will not work.
To resolve this issue please check the following steps carefully, so you can get Background Transition Widget and Particles Section Addon to work together.
Steps to Resolve Background Transition Widget and Particles Section Addon Conflict
- Enable Particles and add the JSON Code for the Particles in the Section. Click here to check steps on Premium Particles Addon Section Tutorial.
- On the webpage [Right Click] and Inspect the Section where Particles Addon and Background Transition Widget are used.
- Use your browser inspect to get the new CSS ID generated by Premium Particles Section Addon.
- Copy the new CSS ID of the section “premium-section-particles-XXXXX” which was generated by Premium Particles Addon for Elementor.
- In both Background Transition Widget [Content –> Elements –> CSS ID] and Section’s Advanced CSS ID, paste or type the generated CSS ID . In my example, the CSS ID is “premium-section-particles-77f8632”
Following these few steps should resolve the conflict between Elementor Particles Addon and Background Transition Widget for Elementor, and make them work together harmoniously.