How To Use the Snippets Feature in the Custom CSS Editor of the Widget?

The Snippets feature in Common Ninja widgets allows you to easily customize the appearance and behavior of your widgets using custom CSS. This guide will show you where to find the Snippets feature and how to use it to enhance your widgets.

Snippet set up:

1. Access Snippets:
   • Navigate to the "Look & Feel" subtab of the widget editor:
     
     
     
     
   • Go to the "Custom" field.
     
     
     
     
   • At the bottom, you will see a button labeled "CSS Edit." Click on it.
     
     
     
     
   • Then, you'll see another button in the top-right corner labeled "Snippets." Press it.
     
     
     
     
2. Choose a Snippet: A dropdown menu will appear with different options specific to the widget you are editing. Select the snippet you want to use.
   
   
   
   
3. Edit the CSS: Once you select a snippet, you can then customize the CSS to your liking.
   
   

Save Your Changes:

1. Preview Your Changes: Click on the "Preview" button in the top-right corner to see how your changes look on the widget.
   
   
2. Save Your Changes: If you are satisfied with the changes, click the "Save Changes" button to apply the custom CSS to your widget.
   
   

The Snippets feature in Common Ninja widgets allows you to easily customize various aspects of your widgets using predefined CSS snippets. By following this guide, you can enhance the appearance and functionality of your widgets to better fit your project's needs.