Tutorial – How To Quickly & Easily Change CSS Colors Using The Search & Replace Function
This tutorial shows how to quickly & easily Change CSS Colors in a (Joomla) CSS Style sheet using the search & replace function. I am using screenshots of the hwdVideoShare template CSS as an example, but it will be exactly the same process for editing any other CSS in a Joomla website (and probably others too...... In fact, a similar search function can be found within Cpanel's "file browser", and in Windows OS (using "WordPad", etc), and so you can also do the same as is detailed below - just look for the familiar binoculars icon).
Rather than manually looking for each instance of a color in order to replace it with a color of your choice, you can use the search & replace function in eXtplorer- not only is this much faster & easier, but it will ensure you find ALL instances of the color that you wish to replace......
Step 1: Access the CSS file via eXtplorer (Note: you will find this listed in "Components", not "utilities" as in our image)
Step 2- Go to the file you wish to edit, right click on it & select "Edit"
You will then be presented with the CSS - see below....
Step 3 -Select the Binoculars (Search) Icon....
Step 4 - Put the # of the color you wish to search for (& replace) in the "Search" box, and put the # of the color you wish to replace it with in the "Replace" box....
(BIS Tip: If you don't know what the actual numbers of the colors that you want to find or replace are, then I suggest you read our article "3 Great (Free) Tools For Webmasters & Web Design" in our BIS Product Reviews Section- and download the great free tool called "Pixie" - the other free tools I reviewed in that article I have personally found to also be invaluable, so you might want to check them out, too...)
Each time you press "Find Next", you will be presented with an instance in the CSS of the particular color you are searching for.... - see below
You can then replace each instance of the 'searched-for' color with your desired replacement color........This ensures that you won't miss any instances of the color you are wanting to replace (which can easily happen if you are doing it "the hard way" - manually...)
Step 5- Tick the "Return to directory after saving" option & press "Save" & your done!
What Others On This Site Are Reading:
Latest posts by Karen Banting (see all)
- Free Return Shipping: PayPal Refunded Return Shipping Service - August 18, 2016
- Marketing Methods for Small Business – List - June 27, 2014
- WordPress eStore Plugin – Features and Video - May 10, 2014