css3-logo

Customize your Theme

All our premium themes include a theme options panel that allows you to change the main appearance of your theme.

But if you want to customize a specific element that can’t be modified in the theme options, the following tip may be helpful.

First off, if you want to modify the theme’s files and/or edit the main stylesheet, it is strongly recommended to create a child theme.

That being said, let’s say you want to know how to change a specific styling element (ie: changing font from black to red), but you can’t find the corresponding line in the CSS.

I highly recommend to use your browser code inspector*.

In short, this tool will allow you to quickly find an element in the design and “inspect it” by Right Clicking it, revealing the CSS that’s styling it and providing you with an exact location in the template where you can make your own edits and customization.

dev-tool

Once you have found the element CSS selector name, you can search the corresponding CSS rule(s) in your text editor. (Ctrl+F in most text editor)

If you don’t know which text editor to use, I recommend you Sublime Text 2. It is free, and it is awesome.

You can also add a CSS rule to overwrite the theme style, if your theme has a custom CSS box. (in the theme options)

* For chrome, this tool is enabled by default. Simply right click on an element and select “Inspect element”

For Safari, you need to enable the developper tool first.

For Firefox, you’ll need to get an addon: Firebug. It doesn’t need any configuration. Just click the obvious links and Firefox will install it and restart.

Need some help? Contact Envato Studio to hire freelancer for theme customization.

http://studio.envato.com/