Link to plugin page: https://zeroqode.com/plugin/css-tools-1528970497931x299713501226598400
CSS Tools plugin - offers the possibility of adding custom CSS to your page using visual elements and actions.
Prerequisites
Knowledge of CSS styling in web development - https://www.w3schools.com/css/
2. Create a simple workflow when the page is loaded, to add a custom style
3. Done. You will find the newly added style on your page at the head of the document.
This plugin has 2 visual elements CSS Tools and Find Dad which should be used on page.
CSS tools does not come with proprieties
Find Dad, proprieties fields:
CSS Tools element
Properties:
For example: .mytext { color: green; }
This css will be added to the head of the page, and this will set the color of all the elements that have ‘mytext’ class, to ‘green’. 2. Change Element Size Over Time - use this action to change width and height of certain elements on your page.
Properties:
3. Get Browser Info - use this action to get info about the current browser, browser platform, operating system and preferred language (see corresponding exposed states below)
4. Add Class by ID (NEW!) - use this action to add a class to an element by its id
Properties:
5. Remove Class by ID (NEW!) - use this action to remove a class from an element by its id
Properties:
Find Dad element
CSS Tools
Find Dad
Action properties
2. Add/Edit Head Tags
Action properties
As an example, you can use the Change Element Size Over Time CSS Tool plugin element action and the Add/Remove class by ID actions to change some elements on the page to attract the user’s attention. Example workflow that changes an image opacity and size would look like this:
2. Set a ‘Do every … seconds’ workflow to periodically trigger some actions that will attract the user’s attention. In this workflow:
Update: 26/10/2020 –
Live Demo: https://zeroqode-demo-01.bubbleapps.io/css-tool