Difference between revisions of "Custom CSS"

From Help Wiki
m
 
(18 intermediate revisions by 4 users not shown)
Line 1: Line 1:
−
==== Customize the CSS of your theme with Custom CSS ====
 
  
−
You can write custom CSS (Cascading Style Sheets) to override the theme's CSS.  
+
<div class="container-fluid">
−
#Activate the Slim JetPack plugin in your site
+
<div class="row">
−
#Go to '''Settings > Jetpack"
+
<div class="col-md-8">
−
# Activate '''Custom CSS'''
+
<div class="lead">
−
#Go '''Appearance > Custom CSS''' and begin creating your own style sheet to override the built-in theme's style sheet
+
Customize the CSS of your theme to change colors, fonts, and more
 +
</div>
 +
 
 +
====You can write custom CSS (Cascading Style Sheets) to override the theme's CSS. ====
 +
#Activate the '''Simple Custom CSS''' plugin in your site
 +
#Go '''Appearance > Edit CSS''' and begin creating your own style sheet to override the built-in theme's style sheet
 
#You'll need to learn how your theme's HTML and CSS is structured, primarily what are the names of the IDs and Classes used so you can override them in your style sheet. Some great tools for this are:
 
#You'll need to learn how your theme's HTML and CSS is structured, primarily what are the names of the IDs and Classes used so you can override them in your style sheet. Some great tools for this are:
 +
#*[http://getfirebug.com/ Firefox Firebug]
 +
#*[http://osxdaily.com/2011/11/03/enable-the-develop-menu-in-safari/ Safari's Develop Menu] 
 +
#*[https://chrome.google.com/webstore/detail/firebug-lite-for-google-c/ehemiojjcpldeipjhjkepfdaohajpbdo?hl=en Firebug for Chrome]
 +
#To learn CSS basics try [http://www.w3schools.com/css/DEFAULT.asp w3schools.com]
 +
 +
 +
<!-- end col-md-8 -->
 +
</div>
 +
<div class="col-md-1"></div>
 +
<div class="col-md-3 sidebar">
 +
{{WordPress Tutorial Header}}
 +
 +
 +
{{WordPress DesigningYourSite Sidebar}}
 +
 +
 +
----
 +
 +
{{WordPress AddingFunctionalityToYourSite Sidebar}}
 +
 +
 +
----
 +
 +
 +
{{WordPress Help Sidebar}}
  
−
*[http://getfirebug.com/ Firefox Firebug]
+
<!-- end col-md-3-->
−
*Safari's Develop Menu 
+
</div>
−
*Firebug for Chrome
+
<!-- end row-->
 +
</div>
 +
<!-- end container-->
 +
</div>
 +
<!-- Generator=Template:TwoColumn -->
 +
__NOTOC__
 +
__NOEDITSECTION__
  
−
{{WordPress Help}}
+
[[Category:Wordpress Tutorial]]
−
[[category:Wordpress]]
+
[[category:Wordpress]]
 +
[[category:CSS]]

Latest revision as of 12:58, 2 October 2018

Customize the CSS of your theme to change colors, fonts, and more

You can write custom CSS (Cascading Style Sheets) to override the theme's CSS.

  1. Activate the Simple Custom CSS plugin in your site
  2. Go Appearance > Edit CSS and begin creating your own style sheet to override the built-in theme's style sheet
  3. You'll need to learn how your theme's HTML and CSS is structured, primarily what are the names of the IDs and Classes used so you can override them in your style sheet. Some great tools for this are:
  4. To learn CSS basics try w3schools.com


Blue-l.png

WordPress Tutorial


Designing Your Site


Adding Functionality To Your Site



Still have WordPress questions?

Retrieved from "http://helpwiki.evergreen.edu/wiki/index.php?title=Custom_CSS&oldid=37405"

The Evergreen State College