BB Code Enhancements - Glow BB Code

WARNING: There is a "Cosmetic Exploit" in this BBCode.
Someone who knows what they are doing can use it to add arbitrary CSS attributes to the text such as custom font sizes and background colors. It in no way affects site security but can be annoying if your users use it improperly. Use at your own risk.

This is a simple bbcode that if searched for you can find in various forms but in my search it appears never to have been written out as a bbcode mod, so here it is... No 'programming' was needed for this, Aside from the button I don't consider it 'mine' anymore than the <font> tag is mine because I may use it from time to time. I am simply releasing this for those who may be searching for bb codes and not the general forum.

Shadow (the css behind this) is not supported by Internet Explorer 7 or 8, it will hopefully be part of 9 though. This works fine in Chrome, Firefox, Safari, and Opera.
Update: a work-around has been added for use with IE8.

Demo: here.

Add a new BBCode

Title: Glow
BB Code Tag Name: glow
Replacement:

<!--[if IE]>
<div style="filter:progid:DXImageTransform.Microsoft.Glow(color={option}, strength=1);width:100%">{param}</div>
<![endif]-->
<![if !ie]>
<span style="text-shadow: {option} 0px 0px 5px;">{param}</span>
<![endif]>

Example: [glow="red"]test glow[/glow]
Description: This code makes text "Glow" (Actually a shadow attribute)
Use Option: Yes
Button Image: (optional)
Remove Tag If Empty: Yes
All Disable Options: No

You can use standard color names in the option such as red, blue, green, yellow, etc...
You can also use hex color codes preceded by the # sign for exact colors, such as #0000FF
Click here for common hex color codes.

Please mark as installed if you use this.

Screenshot attached- note for some reason in the screen capture the green glow is barely visible. The effect is much nicer in the live demo above.

[trotskid]

Nice BBcode, thanks!

[sulasno]

tagged and thanks

[mgurain]

Hi,
that didn't work in Chrome !
I used this code and it works in chrome :

<span style="background: #FFF; color: #FFF; text-shadow: 0 0 24px #C00, 0 0 4px #C00, 1px 1px 2px #333;">{param}</span>

But I need a way to give users ability to choose color, how could I do that ?
Thanks,,

[BirdOPrey5]

I use Chrome as my default browser and it most certainly works for me... Are you using the latest version? 5?

To have the user pick a color replace the color you want to be user selectable in your code with {option} for example:

<span style="background: #FFF; color: {option}; text-shadow: 0 0 24px #C00, 0 0 4px #C00, 1px 1px 2px #333;">{param}</span>

They would then enter the # sign and color code in the option part of the bbcode [glow="color"]glow text here[/glow].
Personally I've never seen 3 digit hex color codes before but if you say they work I believe you, you'd use [glow="#FFF"] in your example... if you want to replace both the background and color with the same color you can use option twice, but I can't see how this would work:

<span style="background: {option} color: {option}; text-shadow: 0 0 24px #C00, 0 0 4px #C00, 1px 1px 2px #333;">{param}</span>

Or it may be the last color you want to change, I don't know I can't follow your logic... but if so use:

<span style="background: #FFF; color: #FFF; text-shadow: 0 0 24px #C00, 0 0 4px #C00, 1px 1px 2px {option};">{param}</span>

Unfortunately you can only use 1 option per bbcode, though you can use the same option in more than 1 place.

[mgurain]

Yes, I used the {option} at first but I realized that many users don't know how to use it,
it would be great if ability to choose color same as (font color) is applicable ?

Thank,

[BirdOPrey5]

There's no way I know of to add a color picker/drop down box to custom bb codes. I just have a thread in my forum with examples so people figure out how to use it if they care enough.

[Da-Vinci]

Nice little mod that, thanks installed.

[BirdOPrey5]

Note: If you prefer not to use the "option" to choose a color and just want the glow color to be set, say to red, to simplify use; [glow] as opposed to [glow="red"] for example then use the following replacement code instead:

<span style="text-shadow: red 0px 0px 5px;">{param}</span>

Replace "red" with whatever color or hex color code you want.
Also under the "Use Option" choose "No"
For example use: [glow]glow text[/glow]

Do everything else the same.

[s-p0k]

nice mod...how do i get the one on your site [mod] warning <~~~~one