Using quotes – How to add a background color
-
On many blogs I see the quotes indented, but also they are offset by a separate background color. Does anyone know how I would go about doing this????
Thanks!
-
can we have a link to your blog and to a couple blogs where you see the formatting that you want to duplicate?
-
http://ronniedigital.wordpress.com/
NBC’s SNL Viciously Mocks Palin As Incest Family From Small Town Alaska
Here is an example from a diff’t site which shows what I’m talking about, amazingly I couldn’t find an example on WordPress so maybe it isn’t an option, but I swear I’ve seen people do it.
The second link is the example of another way that I would like to know how to set off quotes, my blog is the first link.
Thanks for all your help!
-
I am thinking that this is something that you can do in CSS, but that requires CSS knowledge and a paid upgrade in WordPress.com.
-
The example you give is a blockquote, and the option is readily available as a button in your post editor.
For highlighting text with a different color in a post, this is the code model:
<div style="background-color:#HEX_NUMBER_HERE;">TEXT_HERE</div>For information on hex color numbers see either one of these:
http://www.colourlovers.com/blog/2007/06/30/ultimate-html-color-hex-code-list/
http://www.december.com/html/spec/color.html
http://www.colorschemer.com/online.html -
-
-
-
-
“@beemeister: No CSS – just plain HTML for your html post editor! “
In fact, it is CSS. This approach is called “inline CSS” or “inline style” which, as you already know, is accomplished by using the style HTML attribute.
HTH
-
On WordPress, if you’re using the Visual Editor, select the text you want included in the blockquote (or just click in that line or paragraph) and click on the large quotation mark above the text box. To remove the blockquote, repeat this. It looks about the same in the editor, other than moving slightly, but it changes the look on the page.
In the HTML editor, select the text and click on b-quote. Clicking within the line or paragraph doesn’t work the same way in this mode. Also, to undo the blockquote in HTML mode you’ll have to manually remove the code – clicking on b-quote simply adds another set of tags. (You can also add the code manually in this mode.)
Adding the blockquote tag indents text on both sides. In WordPress it also places the selected text on a colored background, with a large opening quotation mark on the left. (Since there is no closing mark, that bothers me a bit.) The color of the background varies with the template used, and apparently the presence of the large quotation mark also depends on which template you have selected, since I have seen some WordPress pages with quotation-mark-free blockquotes. (But then again, maybe they have the CSS upgrade.)
I haven’t tried out just changing the background color as suggested above, without using the blockquote tag, but I probably will.
-
-
In WordPress it also places the selected text on a colored background, with a large opening quotation mark on the left.
Not all themes have the colored background nor do all themes have the quotation mark. The link given above shows the text indented with a grey line to the left. How a blockquote appears is totally dependent on the theme design.
-
Another way of achieving changing the color of the block quote wording
is to highlight the text click on the color pallet icon, & pick your color.
- The topic ‘Using quotes – How to add a background color’ is closed to new replies.
WordPress.com Forums 