BB Code Enhancements - IBP Style bbCode: Quote

//////////////
// For SEO Chat and Webmaster Forums
// By: vBulletin Services
// Released for free use @ vB.org only!
/////////////

This will change the boring vBulletin quote into something with a little more life and spice for your forums. Change the boring quote bbCode to a little more snazz.

go to your styles and templates and locate the bbCode template group.
Double click the bbcode_quote template and replace the entire contents with

<div style="margin:20px; margin-top:5px; <if condition="$show['iewidthfix']">width: 100%;</if>">

<div style="width:100%">
		
			<if condition="$show['username']">

				<div class="quotetop">
					$vbphrase[quote]: <phrase 1="$username">$vbphrase[originally_posted_by_x]</phrase>
					<if condition="$postid"><a href="showthread.php?$session[sessionurl]p=$postid#post$postid" rel="nofollow"><img class="inlineimg" src="$stylevar[imgdir_button]/viewpost.gif" border="0" alt="$vbphrase[view_post]" /></a></if>
				</div>
				<div style="font-style:italic" class="quotemain">$message</div>
			<else />
	<div class="smallfont quotetop">$vbphrase[quote]:</div>
				<div class="quotemain">$message</div>
			</if>
</div>
</div>

Save your new template, and open up the Main CSS editor (choose Main CSS From drop down)

All the way at the bottom under additional CSS enter

.quotetop
{
	width=98%
	color: #000;
	margin: 8px auto 0px auto;
	font-weight:bold;
	font-size:10px;
	padding: 8px;
	background-color:#E4EAF2;
	border-left: 4px solid #8394B2;
	border-top: 1px dotted #000;
	border-right: 1px dotted #000;
}
.quotemain
{
	width=98%
	color: #465584;
	background-color: #FAFCFE;
	border-left: 4px solid #8394B2;
	border-right: 1px dotted #000;
	/*border-top: 1px dotted #000;*/
	border-bottom: 1px dotted #000;
	padding: 4px;
	margin: 0px auto 8px auto;
}

End result is the attached image.

[SEOvB]

Reserved for future changes.

Demo: http://seotips4.com/forum/t2514/

[rizelim]

thanks

[puertoblack2003]

installed..thanks for the share i most say it looks cleaner...:up:

[SEOvB]

Thanks, i'll be releasing the code, html, php layouts soon as well. Should look alot better all around

[ricky_s]

hey great mod. I am a beginer in with vb, so I had a question. I already have some stuff in the "Additional CSS Definitions", should i just add this above it?

Here's what I have in the upper box

/* ***** styling for 'big' usernames on postbit etc. ***** */
.bigusername { font-size: 14pt; }

/* ***** small padding on 'thead' elements ***** */
td.thead, th.thead, div.thead { padding: 4px; }

/* ***** basic styles for multi-page nav elements */
.pagenav a { text-decoration: none; }
.pagenav td { padding: 2px 4px 2px 4px; }

/* ***** de-emphasized text */
.shade, a.shade:link, a.shade:visited { color: #777777; text-decoration: none; }
a.shade:active, a.shade:hover { color: #FF4400; text-decoration: underline; }
.tcat .shade, .thead .shade, .tfoot .shade { color: #DDDDDD; }

/* ***** define margin and font-size for elements inside panels ***** */
.fieldset { margin-bottom: 6px; }
.fieldset, .fieldset td, .fieldset p, .fieldset li { font-size: 11px; }

lower box:

.warning-box,
.attention-box,
.notice-box,
.help-box,
.information-box
{
	color: #000;
	border: 1px solid #000;
	-moz-border-radius: 5px;
	background-color: #FCF8C7;
	padding: 6px;
	text-align:left;
}

.warning-box img,
.attention-box img,
.help-box img,
.notice-box img,
.information-box img
{
	float:left;
	margin-top: 10px;
	margin-right: 5px;
	vertical-align:middle;
	border: 0px;
}

.warning-box h2,
.warning-box p,
.notice-box h2,
.notice-box p,
.attention-box h2,
.attention-box p,
.help-box h2,
.help-box p,
.information-box h2,
.information-box p
{
	padding: 0px;
	margin:  0px;
	margin-left: 60px;
}

.warning-box h2,
.attention-box h2,
.notice-box h2,
.help-box h2,
.information-box h2
{
	padding-bottom: 4px;
	font-size: 14px;
	border-bottom: 1px solid #000;
}

.warning-box h1,
.attention-box h1,
.notice-box h1,
.help-box h1,
.information-box h1
{
	padding: 0px;
	margin:  0px;
	margin-left: 60px;
	font-size: 12px;
        font-weight:normal;
}

.warning-box h6,
.attention-box h6,
.notice-box h6,
.help-box h6,
.information-box h6
{

	margin:  20px;
	padding: 0px;
	margin-left: 60px;
	font-size: 12px;
        font-weight:normal;
}

.warning-box
{
	background-color: #FFCCCC;
}

.help-box
{
	background-color: #d5eeb6;
}

.warning-box ul,
.attention-box ul,
.notice-box ul,
.help-box ul,
.information-box ul
{
	margin-left: 30px;
}

thanks

[SEOvB]

Put it in your lower box, all the way at the very end

[Senzuri]

Installed

But how do I remove the italics?

[Senzuri]

nvm, found it

change:

<div style="font-style:italic" class="quotemain">$message</div>

to:

<div style="font-style:normal" class="quotemain">$message</div>

[SEOvB]

<div class="quotemain">$message</div>

Should also work