Six Common Mistakes When Writing CSS For WordPress Themes

Irrespective of how widespread the use of WordPress has been, a lots of users are still making simple mistakes while writing the CSS for WordPress themes. In this article, we will take you through 6 common mistakes which we have found being made even by professional developers. Firstly, let's get a clearer view of what we mean by CSS errors in WordPress theme customization projects.

Consider a scenario where you have found your favourite WordPress theme and installed it,then after realising that it requires some small changes. Than, what you do? You simply open the custom file editor and make the changes , by hitting the 'Save' button. It's only that you realise that your website has broken down. The reason for this is the other mistake made while writing the CSS for the installed WordPress theme.

1. Choosing the incorrect selector

While tweaking the layout of your WordPress theme, there might be situations after you choose to put all of your designs in #content instead of #content-text. Doing this may not help your layout in any way. All the unwanted changes created to the theme using such an approach will be visible once the theme is being previewed. the easy fix for this is cutting and pasting these styles within the appropriate tag, in addition to deleting the styles from the #content tag.

2. Incorrect template module

Often, WordPress developers tend to create modifications in the comments.php file rather than comments-popup.php file. So, even with the existence of multiple standard templates in WordPress, there are chances of messing everything. it's suggested to check the standard section you are supposed to be working on throughout your WP theme customization project.

3. Forgetting important details about CSS

Despite being surprisingly creative with the CSS, there are times when developers swing to forget the bottom rules they need to follow. as an example, it's necessary for every selector to be known as an ID or class unless and until it's a HTML TAG. Plus, this selector must be set move into the format shown below:

selector { property:value; property:value; }

Here, the braces, colon and semi-colon should be enclosed without fail. Missing even a single detail can create things go away. fortunately, the CSS Validators will catch up all the small details that you simply tend to forget but it's better to get it right in the 1st instance.

4. Putting the files incorrectly

If you are new to CSS then it is a good plan to get a good understanding of file placement. you need to understand about the files that you'll be working on  with all CSS styles being available within the style.css file of the WP theme folder, you need to be aware of the fact that the HTML code may be found in the index.php file and PHP files stored in the theme's folder. So, you\'ll be able to simply create changes to specific CSS selector tags within your PHP files, rather than touching your PHP files.

5. Writing system mistakes

Just as some use 20pc rather than 20px, there are several spelling mistakes that became a common part of every CSS writing project. even if you're an expert, everyone can create typos. In simple terms, using 20pc for a margin will not fetch you any results however 20px will. Since it's quite simple to overlook spelling errors, i like to recommend you using the CSS Validators which is able to simply catch a majority of spelling mistakes you have created.

6. Multiple decisions

As a WordPress developer, you may have create the mistake of assigning more than one reference to a single selector. this is often a situation wherever multiple selectors get loaded with some conflicting information, creating it quite difficult to decide that one to use for fetching the desired results. This drawback occur after you will bring your default original style sheet over a new one.

Share on Google Plus

About Admin

All type of IT Information such as Latest Technology, Web Design and Development tips, Graphic and Logo Design tools and tips, SEO tips and tricks.