Thursday, September 16, 2010

How to Customize Quotes in Blogger

WHAT ARE QUOTES?
Quotes are used for quoting. Heh. Quoting defines:

► repeating or copying the words of another, usually with acknowledgment of the source
► citing or referring for illustration or proof
► repeating a brief passage or excerpt

DEFAULT QUOTES IN BLOGGER AND HOW TO USE THEM
Default quotes ain't much of a fun. Really. They are rather dull. And blank.
When you're composing the Post, and want to make a quotation, you will:

► highlight the part of the text that will be a quote
► and click on the quote button in the Blogger toolbar

SO, WHAT CAN WE DO?
Well, a lot! First, let's see what part of the code (CSS style)..
.post blockquote {
margin:1em 20px;
}
.post blockquote p {
margin:.75em 0;
}
..that's the one! You can find it easily going to LAYOUT ► EDIT HTML ► and scroll until you find it (use CTRL + F to make it easier)... and Replace by the Code Below
}
.post-body blockquote {
line-height: 1.3em;
}
.comment-link {
margin-left: .6em;
}
.post img {
padding: 10px;
}
.post blockquote {
background: #F2F1F1 url(http://lh6.ggpht.com/_RIzFJK_lvO0/TJMTaXl59JI/AAAAAAAAAEw/VPc71N-FgaM/ALLJECTS_Q_HOME.gif)top left repeat-y;
margin: 0 20px;
padding: 10px 20px 10px 45px;
border-top: 1px solid #DDD;
border-right: 1px solid #666;
border-left: 1px solid #DDD;
border-bottom: 1px solid #666;
font-size: 0.9em;
}
.post blockquote p {
margin: 0;
padding: 0 0 15px;
}
.post blockquote:hover {
background: #F2F1F1 url(http://lh4.ggpht.com/_RIzFJK_lvO0/TJMQUMIw_wI/AAAAAAAAAEo/PIzwev6odvM/ALLJECTS_QOUTES.gif)top left repeat-y;
}
.gapad {
background: #FFF url(http://2.bp.blogspot.com/_7wsQzULWIwo/Sq7DUXa4jvI/AAAAAAAAB1g/3tkae3UMJ10/s1600/homepagetop2.gif) top no-repeat;
float: left;
width: 590px;
margin: 0 0 10px;
padding: 10px;
border: 1px solid #DDD;
}
Your Done Save Now..
remember to change the URL address of the pic with your own , you have lots of options here....be creative... trial and error