4 Places To Edit WordPress CSS | WP Learning Lab - Best Webhosting

Thanks! Share it with your friends!

URL

You disliked this video. Thanks for the feedback!

Sorry, only registred users can create playlists.

ULTRAFAST, CHEAP, SCALABLE AND RELIABLE! WE STRONGLY RECOMMEND ACCU WEB HOSTING COMPANY

4 Places To Edit WordPress CSS | WP Learning Lab

Watch Wordpress WPLearningLab Video: 4 Places To Edit WordPress CSS | WP Learning Lab.
Grab Your Free 17-Point WordPress Pre-Launch PDF Checklist: http://vid.io/xqRL
4 Places To Edit WordPress CSS | WP Learning Lab

To edit WordPress CSS you first need to know all the places you can find CSS. There are 4 common places. You may not have all these locations on your website because some of them are theme-dependent.

The possible CSS locations are:

1. The WordPress theme or child theme stylesheet (this one you have for sure)
2. The theme options panel (this one you may or may not have)
3. A CSS editor on each page and post (this one you may or may not have)
4. Inline CSS applied directly to HTML elements on the page (this one you will have only if you're written it)

Let's go through each one.

The WordPress theme or child theme stylesheet

When inside your WordPress dashboard if you click on Appearance then Editor you will be able to edit theme or child theme files.

Usually the style.css is loaded first by default. If it's not loaded find the style.css file in the list of files on the right side of the editor page. When you find it, click on it.

That will open the CSS file in WordPress editor.

At this point you can make edits to the file and click on the Update button to save your changes.

How to actually code CSS is beyond the scope of this tutorial, but you can check out my CSS channel over here (https://www.youtube.com/channel/UCeFLITjl2v9vtIkftw9UMsw)

The danger in editing CSS directly in the stylesheet of the main theme is that what you create may be over written when the theme updates. You get around this problem by creating a child theme (see a tutorial on how to create a WordPress child theme here: https://www.youtube.com/watch?v=Z8n1h-85SMQ).

The theme options panel

Not every theme has a theme options panel, but the ones that do make WordPress CSS so much easier to edit. You can simply add CSS to the CSS box in the theme options and click save changes.

The upside is that theme updates won't erase the CSS code you create.

A CSS editor on each page and post

Some themes, like Avada and Divi, give you the option of insert CSS code right into the individual posts and pages of your website.

This is great for CSS that you want to be only one page. I would only recommend doing this if you're putting more than 100 lines of CSS into the page.

If it's less than 100 lines of CSS you're better to put into the main stylesheet so you stay organized.

If it's more than 100 lines of CSS code that only need to exist on one page then your site will load a little bit faster overall by not loading all that CSS into every page.

Inline CSS

The last place in our list and the last place you'd want to create CSS code is right in your HTML elements.

This is called inline CSS and can be difficult to work with for two big reasons.

First, you can't apply the CSS to more than one element at a time. So if you want to style all the paragraphs on the page in the same way you have to apply the same CSS code over and over again to each p tag.

This is a pain to administer and will result in larger than needed page sizes.

Second, if you add inline CSS to lots of pages it will be come difficult to remember what CSS you applied where. Then trying to find it an make edits will become a pain.

Inline CSS also takes precedent over CSS in the stylesheet. So you might be make changes to CSS in the stylesheet, but nothing is happening on the page. You'll go through a frustrating few minutes before you figure out the CSS is actually inline on the page.

I hope this information helps you! If you have any questions leave a comment below or ping me @WPLearningLab on Twitter.

--------------

If you want more excellent WordPress information check out our website where we post WordPress tutorials daily.

https://wplearninglab.com/

Connect with us:

WP Learning Lab Channel: http://www.youtube.com/subscription_center?add_user=wplearninglab

Facebook: https://www.facebook.com/wplearninglab

Twitter: https://twitter.com/WPLearningLab

Google Plus: http://google.com/+Wplearninglab

Pinterest: http://www.pinterest.com/wplearninglab/

Published:
Category: Wordpress WPLearningLab
103 Views

Related Videos

  • How To Edit The WordPress Footer | WP Learning Lab

    How To Edit The WordPress Footer | WP Learning Lab

    by Best Webhosting Added 89 Views / 0 Likes

    Grab Your Free 17-Point WordPress Pre-Launch PDF Checklist: http://vid.io/xqRL How To Edit The WordPress Footer | WP Learning Lab To edit the WordPress footer all you have multiple options available to you. You can use the WordPress editor, which is what I show you in this video. You can also edit the footer in the cPanel file manager and via FTP. No matter which method you use to edit your footer, he trick is open the footer.php file. That is where a

  • How To Edit The WordPress Header | WP Learning Lab

    How To Edit The WordPress Header | WP Learning Lab

    by Best Webhosting Added 74 Views / 0 Likes

    Grab Your Free 17-Point WordPress Pre-Launch PDF Checklist: http://vid.io/xqRL How To Edit The WordPress Header | WP Learning Lab The WordPress header is one of those place where a lot of important things happen. Scripts are called, integrations are set up and validated, stylesheets are imported, and so on. Usually, leaving the header.php file alone is the best plan, but sometimes you have to make additions or changes. Before you do, keep in mind that

  • Edit wp-config.php To Add WordPress Database Credentials | WP Learning Lab

    Edit wp-config.php To Add WordPress Database Credentials | WP Learning Lab

    by Best Webhosting Added 97 Views / 0 Likes

    Download our exclusive 10-Point WP Hardening Checklist: http://bit.ly/10point-wordpress-hardening-checklist Edit wp-config.php To Add WordPress Database Credentials | WP Learning Lab In another video (here: https://youtu.be/wtG1IJ1Wbvs) I showed you how to create a MySQL database for your WordPress site. In this video I'm going to show you how to edit wp-config.php file to include the database credentials. Although many people will be intimidated by i

  • Popular Create & Edit WordPress User Permissions Using The User Role Editor Plugin | WP Learning Lab

    Create & Edit WordPress User Permissions Using The User Role Editor Plugin | WP Learning Lab

    by Best Webhosting Added 106 Views / 0 Likes

    Grab Your Free 17-Point WordPress Pre-Launch PDF Checklist: http://vid.io/xqRL Create & Edit WordPress User Permissions Using The User Role Editor Plugin | WP Learning Lab Grab your free 17-Point WordPress Pre-Launch PDF Checklist: http://vid.io/xqRL Download your exclusive 10-Point WP Security Checklist: http://bit.ly/10point-wordpress-hardening-checklist WordPress user permissions give you a lot of flexibility in determining what specific users and

  • How To Use An FTP Client To Edit Files | WP Learning Lab

    How To Use An FTP Client To Edit Files | WP Learning Lab

    by Best Webhosting Added 98 Views / 0 Likes

    Grab Your Free 17-Point WordPress Pre-Launch PDF Checklist: http://vid.io/xqRL How To Use An FTP Client To Edit Files | WP Learning Lab FTP stands for File Transfer Protocol. An FTP client is a program that allows you to transfer and edit files on your server. FTP makes it super easy and you can quickly connect directly from your computer rather than signing into cPanel. You first have to establish a FTP connection with your server, which you can do b

  • Ten Great Places to Find and Buy the Best WordPress Themes

    Ten Great Places to Find and Buy the Best WordPress Themes

    by Best Webhosting Added 86 Views / 0 Likes

    With so many places online claiming to have the best WordPress themes, knowing where to really get good quality themes can be confusing at best! Today, we'll show you ten great places you can be sure to get superb quality premium WordPress themes - note: these are just ten of many! Other great places include the likes of Elegant Themes, Themify, and many more, for a much larger list of over 45 companies, take a look at: https://winningwp.com/best-word

  • 11 Online Places To Learn WordPress Inside And Out

    11 Online Places To Learn WordPress Inside And Out

    by Best Webhosting Added 87 Views / 0 Likes

    In today’s video we take a look at 11 online places to learn WordPress inside and out. This list includes free and paid options. Blog post: https://www.elegantthemes.com/blog/wordpress/learn-wordpress Like us on Facebook: https://www.facebook.com/elegantthemes/

  • My Top 3 Places to Buy a Domain Name!

    My Top 3 Places to Buy a Domain Name!

    by Best Webhosting Added 13 Views / 0 Likes

  • My Favorite Places to Eat and Explore

    My Favorite Places to Eat and Explore

    by Best Webhosting Added 80 Views / 0 Likes

    My absolute favorite places to travel and eat. •Subscribe: https://goo.gl/ScRTwc to learn more secret SEO tips. Find me on Facebook: https://www.facebook.com/neilkpatel/ Read more on my blog: https://neilpatel.com/blog 0:05 You do a lot of traveling, Neil. Where're your favorite places to travel and eat and why? 0:30 I'm a creature of habit. Most of you guys don't know this about me. I eat at the same places most of the time. So like here in Hollywood

  • Three Places Where You’d Never Expect to Get Hacked | The Journey

    Three Places Where You’d Never Expect to Get Hacked | The Journey

    by Best Webhosting Added 22 Views / 0 Likes

    For every fancy new digital device that hits the market, a hacker somewhere is figuring out how to compromise it. Today, even routine mundane activities can put you and your bank account at risk. ✅ Read about it on our blog ➜ https://bit.ly/3I0V889GoDaddy Let’s look at three real-life scenarios where you’d never expect to get hacked — but just might. Waiting to check out Modern payment cards have a built in EMV chip that transmits the cards' informati

  • SEO Your H1 Tag In WordPress | WP Learning Lab

    SEO Your H1 Tag In WordPress | WP Learning Lab

    by Best Webhosting Added 80 Views / 0 Likes

    Grab Your Free 17-Point WordPress Pre-Launch PDF Checklist: http://vid.io/xqRL Download our exclusive 10-Point WP Hardening Checklist: http://bit.ly/10point-wordpress-hardening-checklist SEO Your H1 Tag In WordPress | WP Learning Lab The H1 tag is one of the most important places to add your main focus keyword. Usually WordPress themes are coded in such a way that the title you choose for the post or page becomes the H1 tag. To optimize h1 all you hav

  • Popular WordPress Media Settings Walkthrough - WordPress Admin Area Tutorial | WP Learning Lab

    WordPress Media Settings Walkthrough - WordPress Admin Area Tutorial | WP Learning Lab

    by Best Webhosting Added 105 Views / 0 Likes

    Grab Your Free 17-Point WordPress Pre-Launch PDF Checklist: http://vid.io/xqRL Download our exclusive 10-Point WP Hardening Checklist: http://bit.ly/10point-wordpress-hardening-checklist WordPress Media Settings Walkthrough - WordPress Admin Area Tutorial | WP Learning Lab In this tutorial I'm going to show you the default WordPress media settings. There isn't much to them, so it'll be quick WordPress tutorial. To get the Media Settings page first log

RECOMMENDED WEB HOSTING

FASTCOMET

Fastcomet

HOSTGATOR

HOSTGATOR

BLUEHOST

BLUEHOST

SITEGROUND

SITEGROUND

A2 HOSTING

A2 HOSTING

HOSTINGER

HOSTINGER

DREAMHOST

DREAMHOST

ACCU WEBHOSTING

ACCU WEBHOSTING

MILESWEB

MILESWEB

HOSTPAPA

HOSTPAPA


RSS