IBP BB Code Style For vBulletin 3.8x

[SEOvB]

//////////////
// By: vBulletin Services (http://seovb.com/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.

You are free to reuse this code for any modification that is free to vBulletin.org users

For a look thats a little more and different you can check out this post: https://vborg.vbsupport.ru/showpost.php?p=1722716&postcount=26

[dmknights]

screenshots?

[SEOvB]

Knew that was coming :D

https://vborg.vbsupport.ru/external/2009/04/155.jpg

[steve1966]

thanks

[KevinL]

Interesting links in your first post....

[Brandon Sheley]

I'm glad I could inspire you..haha

you feeling okay today Dave?

[SEOvB]

Yep, feeling just fine thanks for asking though.

Have a good day ;)

[SEOvB]

...


If you have questions about the service I run, then I suggest asking at http://seovb.com/contact if you need help with starting out learning the ins and outs of vBulletin, I'd be more than happy to assist.

If you have questions about default vBulletin code, I can also assist with that, or you can ask in the support forums here, or on vBulletin.com

PS, if that was your intention to learn about default vBulletin code, then you wouldn't have reported it or went around posting every where it was cookie stuffing :up:

[Brandon Sheley]

If reported it or not has no baring on the question I had..

[SEOvB]

If reported it or not has no baring on the question I had..

Thanks, after careful review of the vBulletin.org signature rules, it seems to fit in the guidelines.

Thanks

[Brandon Sheley]

Thanks, after careful review of the vBulletin.org signature rules, it seems to fit in the guidelines.

Thanks

no it doesn't and you know that ;)

[Shishir]

Just installed on 3.7.5 :D Works fine and Of course looks Sexy. ;)

Shishir

[Leo Brazil]

Just a question:

Am I supposed to have adictional images for this ?

I've noticed that there is a viewpost.gif on you code that's not Vb by default.

Edited: My bad, it's there. Sorry.

Thanks for sharing this, I liked the idea.

[SEOvB]

Just a question:

Am I supposed to have adictional images for this ?

I've noticed that there is a viewpost.gif on you code that's not Vb by default.

Edited: My bad, it's there. Sorry.

Thanks for sharing this, I liked the idea.

No problem, dont forget to hit install.

If your looking for the image from the screenshot is provided in the "Fam Fam Fam" icon pack thats available for free download.

If I have the path wrong to the image let me know as well and I'll look into it.

Best regards ;)

[Emrah Kaya]

Thanks ! :)

[jeefo]

what about right-to-left forums ??

it is really look great..
installed but waiting for right to left support..

[SEOvB]

what about right-to-left forums ??

it is really look great..
installed but waiting for right to left support..

Do you have a screenshot of what it results to in the RtL forums.

Or if you can send the bbCode_quote template I'll modify it for right to left forums as I wasn't aware it was different.

[jeefo]

Do you have a screenshot of what it results to in the RtL forums.

Or if you can send the bbCode_quote template I'll modify it for right to left forums as I wasn't aware it was different.

screen shoot attached ,,
& i'm using ur template ..

thanks alot :)

_______________
edited ,,

I'm sorry FRDS ,it's so easy ..
just making this changes in CSS to be like that :

.quotetop
{
border-right: 4px solid #8394B2;
border-left: 1px dotted #000;
}

.quotemain
{
border-right: 4px solid #8394B2;
border-left: 1px dotted #000;
}

thank you ,,

[Ascor]

Installed, thank you :)

[faantastic]

Thanks very cool:)

[Leo Brazil]

Great Idea. Installed !!

I've just changed some colors to fit my stile and that's it, perfect.

Thanks for sharing.

[tehPARADOX]

Any way to make this into the BBCODE Code block?

[Blue.Extreme]

How about HTML - Quote - PHP ...

[SEOvB]

How about HTML - Quote - PHP ...

This is for Quote,

I'll be making the others soon as I get a few free minutes.

[liselotte]

works great

[nul7]

Just wanted to say thanks, and to share a little modification I did:

Images

See Attached. Upload q.gif and q2.gif to your misc images directory (Example: http://www.yoursite.com/forum/images/misc).



CSS

You'll need to make an edit to apply to your forum. Just replace PATHTOYOURMISCIMAGEDIR in the code below with the full path to your misc images directory (Example: http://www.yoursite.com/forum/images/misc).
.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: #FAFCFE url("PATHTOYOURMISCIMAGEDIR/q2.gif") no-repeat bottom right;
min-height: 75px;
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;
}



bbcode_quote

No edits necessary.
<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">
<img class="inlineimg" src="$stylevar[imgdir_misc]/q.gif" border="0" alt="$vbphrase[quote]" />&nbsp;&nbsp;
$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"> <img class="inlineimg" src="$stylevar[imgdir_misc]/q.gif" border="0" alt="$vbphrase[quote]" />&nbsp;&nbsp;$vbphrase[quote]:</div>
<div class="quotemain">$message</div>
</if>
</div>
</div>


Note: There is one small caveat. To make things look right with the larger blue quotation mark, I had to set a min-height to the cell. This means that when there's only a few lines of text, it looks a little oversized (See attached sample). The quotation mark will stay in the lower right hand corner, no matter how big the quote it.

[SEOvB]

Nice work, I like it./

[Madlike]

Thank you ;)

[Indyaboard]

Now this is good stuff, thanks bro. :up:

[ShawneyJ]

thank you sir ;)

[sheppardzwc]

Just installed it and tweaked it a bit to blend in with my other skins. Great job! :up:

[islam2all]

thank's

[Indyaboard]

superb!!!

[kopukmelih]

wo is html,code,php bbcode ?

danke