PDA

View Full Version : BB Code Enhancements - Tooltip or Abbreviation Custom BBCode

CvP
10-28-2011, 10:00 PM
Originally posted here (https://www.vbulletin.com/forum/showthread.php/390277-How-to-Make-a-Tooltip-or-Abbreviation-BBCode).
Pretty simple bbcode that uses pure html (no js) :)

AdminCP -> Custom BBCodes -> Add New BBCode

Tag Name: abbr
Replacement: <abbr title="{option}">{param}</abbr>
Example: VBSI
Description: This tag allows you to put a "tooltip" over a text. You can use this for words like UN (United Nations) or WWW (World Wide Web) etc.
Use Option: YES

Settings Screenshot and preview attached.


If the abbr word does not look different than normal text (it should look like the preview image), you can add this code to
admincp > style manager > edit templates > additional.css

abbr {
border-bottom: 1px dotted black;
cursor: help;
}

Note: Tested on vB 4.1.7 but should work for all vB4 and even vB3.
MyPeSePe
10-29-2011, 11:38 AM
This pretty well, but as he realizes the user if that text is a description?

http://img846.imageshack.us/img846/6614/sinttulo2ysd.png
CvP
10-29-2011, 01:08 PM
Can you please rephrase your question?

Depending on the browser, the text will have dotted underline (as shown in preview image). You can also apply custom styles on it. Would you like me to provide some?
RonH.
10-29-2011, 04:01 PM
I like it. Marked Installed.
MyPeSePe
10-29-2011, 05:34 PM
<abbr title="{option}"><em><strong><u>{param}</u></strong></em></abbr>

put it this way, to make it. thanks
stator
10-29-2011, 05:39 PM
Wrong section, post it here: vBulletin 4.x Template Modifications
abdobasha2004
10-29-2011, 08:51 PM
nice idea
thanks
CvP
10-30-2011, 03:31 PM
<abbr title="{option}"><em><strong><u>{param}</u></strong></em></abbr>

put it this way, to make it. thanks
Understood. You are free to use it that way but I wont put it like that. I don't like tag soup.

vBulletin 4 has default css codes what will make it look as the preview. If it does not for you, add this to additional.css template:
abbr {
border-bottom: 1px dotted black;
cursor: help;
}


Wrong section, post it here: vBulletin 4.x Template Modifications
I'm pretty sure this is the right place for bbcodes. Moderators can move it if needed. Thanks.
grey_goose
10-30-2011, 05:06 PM
1. Awww, I don't even get a mention for prompting this? :D

2. The css didn't work for me. I added a <span class="abbr"> in the bbcode and then it worked.
CvP
11-01-2011, 10:20 PM
1. Awww, I don't even get a mention for prompting this? :D

2. The css didn't work for me. I added a <span class="abbr"> in the bbcode and then it worked.
that means you put a . before abbr in css. There should not be any dots.
Dr.osamA
11-14-2011, 11:52 PM
thanxx bro

installed