PDA

View Full Version : BB Code Enhancements - IBP BB Code Style For vBulletin 3.8x


SEOvB
15 Jan 2009, 19:16
//////////////
// 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: http://www.vbulletin.org/forum/showpost.php?p=1722716&postcount=26

dmknights
15 Jan 2009, 19:25
screenshots?

SEOvB
15 Jan 2009, 19:30
Knew that was coming :D

https://www.vbulletin.org/forum/external/2009/04/155.jpg

steve1966
15 Jan 2009, 19:57
thanks

KevinL
16 Jan 2009, 01:57
Interesting links in your first post....

Brandon Sheley
16 Jan 2009, 02:42
I'm glad I could inspire you..haha

you feeling okay today Dave?

SEOvB
16 Jan 2009, 02:48
Yep, feeling just fine thanks for asking though.

Have a good day ;)

SEOvB
16 Jan 2009, 03:23
...


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
16 Jan 2009, 03:28
If reported it or not has no baring on the question I had..

SEOvB
16 Jan 2009, 03:32
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
16 Jan 2009, 03:34
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
16 Jan 2009, 08:36
Just installed on 3.7.5 :D Works fine and Of course looks Sexy. ;)

Shishir

Leo Brazil
16 Jan 2009, 14:44
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
16 Jan 2009, 16:37
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
16 Jan 2009, 19:27
Thanks ! :)

jeefo
17 Jan 2009, 00:27
what about right-to-left forums ??

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

SEOvB
17 Jan 2009, 02:17
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
17 Jan 2009, 12:25
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
18 Jan 2009, 20:50
Installed, thank you :)

faantastic
19 Jan 2009, 10:09
Thanks very cool:)

Leo Brazil
19 Jan 2009, 11:08
Great Idea. Installed !!

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

Thanks for sharing.

tehPARADOX
20 Jan 2009, 07:55
Any way to make this into the BBCODE Code block?

Blue.Extreme
21 Jan 2009, 12:30
How about HTML - Quote - PHP ...

SEOvB
22 Jan 2009, 18:47
How about HTML - Quote - PHP ...

This is for Quote,

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

liselotte
23 Jan 2009, 21:56
works great

nul7
23 Jan 2009, 22:39
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
25 Jan 2009, 14:49
Nice work, I like it./

Madlike
23 Mar 2009, 17:40
Thank you ;)

Indyaboard
31 Mar 2009, 14:54
Now this is good stuff, thanks bro. :up:

ShawneyJ
02 Apr 2009, 01:50
thank you sir ;)

sheppardzwc
05 Apr 2009, 01:58
Just installed it and tweaked it a bit to blend in with my other skins. Great job! :up:

islam2all
05 Apr 2009, 04:58
thank's

Indyaboard
05 Apr 2009, 15:10
superb!!!

kopukmelih
20 Dec 2010, 10:06
wo is html,code,php bbcode ?

danke