Hosting Forums Market
Osclass

Customization

Osclass provides a robust customization system that allows administrators to modify the design and behavior of their website without altering core theme files. This ensures that custom changes are preserved even after theme updates - that's critical information for most users trying to customize their themes and do not lose option to do theme updates. Customization options include adding custom CSS, JavaScript, and HTML.

Accessing Customization Settings

Customization settings are available under Appearance > Customization.

Customizations
Customizations

From this section, administrators can:

  • Add custom CSS to modify site design.
  • Insert JavaScript for enhanced functionality.
  • Embed custom HTML code without altering theme files.

Custom CSS

Administrators can apply custom CSS rules to modify fonts, colors, spacing, and other design elements. The entered CSS is automatically included in the site’s footer within <style> tags, ensuring it is applied correctly.

Custom CSS Hook

To control where the custom CSS is loaded, administrators can select a hook location:

  • Footer (default): Ensures CSS is loaded at the bottom of the page.
  • Header: Loads CSS at the top of the page.
  • Before HTML: Inserts CSS before the main HTML structure.
  • After HTML: Loads CSS at the end of the HTML structure.

Custom JavaScript

JavaScript can be added to extend website functionality, such as tracking scripts, animations, or form validations.

Custom JavaScript Hook

Administrators can specify where the JavaScript should be loaded:

  • Footer (default): Ensures the script loads after the page content.
  • Header: Loads JavaScript before page rendering.
  • Before HTML: Inserts JavaScript at the beginning of the page structure.
  • After HTML: Loads JavaScript after all page content.

Custom HTML

Custom HTML allows administrators to insert additional elements such as tracking codes, meta tags, or embedded content without modifying theme files.

Custom HTML Hook

HTML can be inserted at various locations:

  • Footer (default): Inserts custom HTML before the closing </body> tag.
  • Header: Adds HTML before the closing </head> tag.
  • Before HTML: Loads content at the start of the page.
  • After HTML: Inserts content after the main HTML structure.

Best Practices for Customization

  • Use CSS for styling changes instead of modifying theme files.
  • Place JavaScript in the footer for better performance.
  • Avoid adding PHP code in customization fields.
  • Keep backups of custom code in case of accidental changes.

Conclusion

Osclass customization options allow administrators to personalize their site’s design and functionality without affecting theme files. By utilizing custom CSS, JavaScript, and HTML effectively, website owners can maintain unique branding and enhanced user experiences.