Earcontra

Earcontra.com is a blog for everyone who's curious about Blogging Tips, SEO, Making Money Online. We share fresh and updated information related to Bogger Templates, Layouts, Blogger Widgets, HTML & CSS Tips, jQuery Tweaks, JavaScript Scripts, and other related keywords.

  • About
  • Contact Us
  • Disclaimer
  • Privacy Policy

Adding Costume Quote To Blogger Posts

Posted by OG Superman in: Blog Design
styling blogger quote


The design of blogs is very essential. We take a good look at the type of fonts and every other thing and discover something needs to be fixed. We do this until our template is perfect. You can feel like I need to change my quote style an you probably found yourself in this page.

Throwing one or two quotes in a post just to show off your template design is a very good strategy for trapping visitors to your website, because apart from content, visitors also check the design before they decide if they will visit again.

To have made this tutorial to help you edit your quote to your taste. Before proceeding, make sure you have backed up your template in case you mess up you just need to restore it again. To backup your template, open the blog you want to make customization on and go to; Template. By the upper right of  your screen, click on the Backup/Restore button.

Follow the steps carefully.

Step 1- Go to Template and click on the Edit HTML button


Step 2- On the new page that comes  up, click on the box and press crtl + F on your keyboard

Step 3- Search for the ]]></b:skin>  If you do not find it, search for </b:skin>  You will see something like the below screenshot. Just click on the arrow and search for ]]></b:skin>  again.



Step 4- Just before the ]]></b:skin> tag, paste the below code.


blockquote {
background: #f4f4f4;
margin: 7px 0px 15px;
padding: 20px 25px;
font-color: #333333;
font-style: italic;
font-size: 0.9375rem;
font: inherit;
text-rendering: optimizelegibility;
border:none;
}

After you have pasted the code, Save your template and check your website to see the new design.

To edit the color of the background - #f4f4f4
To edit the color of the font - #333333
To edit the size of the font - 0.9375rem



0 comments:

Post a Comment

Note: only a member of this blog may post a comment.

Newer Post Older Post Home
Earcontra

Popular Posts

  • How To Create A separate Label or Tag page In blogger
    Sometimes ago, I thought that it would be nice to have a standalone or separate page where you can display the labels, then add the page t...
  • 7 Add-ons Needed For Bloggers to Make Blogging Easier
    Having add-on gives us extra ability and flexibility for writing a rich post. As a blogger, you may find yourself in difficult situations so...

ABOUT EARCONTRA

Earcontra.com is a blog for everyone who's curious about Blogging Tips. We share fresh and updated information related to Bogger Templates, Layouts, Blogger Widgets, HTML & CSS Tips, jQuery Tweaks, Javascript scripts, and other related keywords.

QUICK NAVIGATION

  • About Us
  • Contact Us
  • Disclaimer
  • Privacy Policy

FEATURED CONTENT

  • Adding Related Posts Widget In Your Blog
  • Automatic Date Counter Widget
  • Setup Blogger With a Custom Domain Name
  • How to Create a Demo Page

© Copyright 2016 Earcontra · All Rights Reserved · And Our Sitemap · All Logos & Trademark Belongs To Their Respective Owners·
Template Developed By Blogging Recipes.