Custom CSS/JS

Custom CSS allows you to apply your own style rules to the website, giving you the ability to override the default styles of the theme or add new styles to meet your design requirements.

Using Custom CSS

  1. Access Custom CSS: Navigate to 'General Settings' and select 'Custom CSS' from the sidebar menu.

  2. Write Your CSS: In the provided text area, write your custom CSS code. Be sure to use proper CSS syntax. For example:

/* Change the background color of all buttons */ 
button { 
    background-color: #4CAF50;
    }

  1. Comment Your Code: It's a good practice to comment your CSS code to remind you or inform others what the purpose of the style rule is. Comments in CSS are made using the /* comment here */ syntax.

  2. Save Your Changes: Click 'Update Changes' to apply the new styles. These will be loaded with your site's styles and override any existing styles where there's a conflict.

Tips for Custom CSS

  • Specificity: Be mindful of CSS specificity. The more specific your selectors are, the higher the chance they will override existing styles.

  • Testing: Test your CSS in a staging environment before applying it to your live site to avoid any visual issues.

  • Maintenance: Keep track of the custom CSS you add, as it might need to be updated after theme or plugin updates.

Remember, CSS added here will apply to your entire website, so use it wisely to ensure consistency and maintainability of your site's design.

PreviousGDPR SettingsNextCache Settings

Last updated