Simple Custom CSS

Simple Custom CSS

Sometimes You want to customize some elements of theme such as: changing font size of the paragraph, changing color of the link , etc. In this tutorial, I will guide you how to do it. We will use Titan WordPress theme.

  • Firstly, You need to login into WordPress admin.
  • Click on Appearance->Customize
  • Locate Logo & Header -> Custom CSS
  • Now, Mouse on the element, which you wish to change, example: We will change the Post Title

  • Right-click and choose Inspect Element. Now you will see   window  display at bottom of your browser

  • <a href=”…”>…</a> is our target – It called a tag. It has a special background. We need mention 2 notes below:
  1. If our target contains class like this: <a href=”…” class=”ourtarget”>…</a>, We will use this class. Now if you want to change font size and color for this element, We will put the code below into Custom Css

 

.ourtarget{
font-size: 20px !important;
color: red !important;
}

2. If our target doesn’t contain any CSS class yet, We will use the CSS class of the closest ancestor, which contains CSS class. In this example, it’s  <div class=”post-title text-uppercase”> … </div>. We will put the code below into Custom Css:

.post-title a{
font-size: 20px !important;
color: red !important;
}
  • Finally, Click Save Button.

To know more about CSS properties, please refer this link http://www.w3schools.com/cssref/default.asp.

I hope you understand how to customize an element in our theme! If you have any question, feel free contact with our developer : piratesmorefun@gmail.com.

 

 

NEWSLETTERS

Subscribe to our email list and stay up-to-date with all our awesome releases and latest updates.
MailChimp Icon