Adding New BBcode Tags

The time now is Sat 21 Dec, 2024 16:49 • All times are UTC + 1 Hour

Adding New BBcode Tags

Page 1 of 1

glenflet Joined: May 2008 Posts: 16 Location: Gosford	Adding New BBcode Tags Ok now that I've got my code 2 html BBcode working, I would like to try adding some whole new BBcode tags, to use a few Java functions for some cool text effects. Could some one explain what I need to do to define new BBcode tags.
#1 Sat 27 Sep, 2008 06:55

Sponsors	Icy Phoenix is an open source project, you can show your appreciation and support future development by donating to the project.

Inactive User	Re: Adding New BBcode Tags You should be able to find that in the docs section - And it's a whole lot different from the usual way of doing it.
#2 Sun 28 Sep, 2008 02:13

glenflet

Joined: May 2008
Posts: 16
Location:

Gosford

Re: Adding New BBcode Tags

Lopalong wrote: [View Post]
You should be able to find that in the docs section - And it's a whole lot different from the usual way of doing it.

I had a look there, but could find any thing about how to add the new tags.

Can you provide a direct link to the topic please.

Edit: I would also like to replace phpBB3 BBcode, with Icy Phoenix BBcode, as phpBB 3 is to hard to modify to my own needs, any suggestions on how I should go about this?

#3 Sun 28 Sep, 2008 06:34

Inactive User	Re: Adding New BBcode Tags You're right mate, difficult to locate for the uninitiated. There's a lot of work being done on docs now - but that's not going to help short-term. Though this should help. hp://*.icyphoenix.com/viewtopic...&p=29850#p29850
#4 Sun 28 Sep, 2008 08:09

glenflet

Joined: May 2008
Posts: 16
Location:

Gosford

Re: Adding New BBcode Tags

I had a look at that topic, but I don't see how that tells, me how to add ne BBcode tags.

I've got some javascript I want to use with BBcode.

i.e.

Code: [Download] [Hide] [Select]

<script language="javascript">

var text = "Hello World!"

var speed = 80

rainbow()

</script>

Where the BBcode would be

Code: [Download] [Hide] [Select]

[rainbow speed=80]Hello World![/rainbow]

i.e.

Code: [Download] [Hide] [Select]

<script language="javascript">

var text = "Hello World!"

var speed = 80

var basecolor = "#808080"

var textcolor = "#00ffff"

neonText()

</script>

Where the BBcode would be

Code: [Download] [Hide] [Select]

[neon speed=80 basecolor=128,128,128 textcolor=0,255,255]Hello World![/neon]

I also want to rename the existing rainbow to gradient.

I can make the php to generate the HTML output just fine, it just how to add the tags to the BBcode that I can't do, and how to tell it what variable I'm look for, to cofirm I understant that propely.

#5 Sun 28 Sep, 2008 08:28

Inactive User

Re: Adding New BBcode Tags

This is an unreleased MOD that I've done for the next version of IP (Though it's basically the same) and it should contain all of the examples you need - Plus put you in the right places to compare other bbCode entries that switch other params as well.

And this example adds a url option - You only want simple tags.

Spoiler: [ Show ]

Code: [Download] [Hide] [Select]

############################################################## 

## MOD Title: High Slider

## MOD Author: Lopalong  h**p://***.icythemes.com

## MOD Description: Adds the bbCode for Highslider

## 

## MOD Version: 1.0.0

## 

## Installation Level: (Easy) 

## Installation Time: ~5 Minutes

## Files To Edit:      includesbbcb_mg.php

##          includesbbcb_mg_small.php

##          includesbbcode.php

##          includesalbum_modalbum_bbcode.php

##          languagelang_englishbbcb_mg.js

##          languagelang_englishlang_bbcb_mg.php

##          templatesmg_themesoverall_include.tpl

##          templatesmg_themesbbcb_mg.tpl

##

############################################################## 

##

## Example: [slider]Image URL[/slider]

##

############################################################## 

##

## Version log

## 

## 1.0.0 --> First release 12th September 2008

## 

##

############################################################## 

## Before Adding This MOD To Your Forum, You Should Back Up All Files Related To This MOD 

##############################################################

#

#-----[ COPY ]------------------------------------------

#

highslide folder to /your_forum_Root/highslide

#-----[ COPY ]------------------------------------------

#

slider*.gif to images/bbcb_mg/images/gif/

#

#-----[ OPEN ]---------------------------------

#

includes/bbcb_mg.php

#

#-----[ FIND ]---------------------------------

#

    'L_BBCB_MG_YOUTUBE' => $lang['bbcb_mg_youtube'],

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

    'L_BBCB_MG_SLIDER' => $lang['bbcb_mg_slider'],

// END HighSlider

#

#-----[ FIND ]---------------------------------

#

    'L_YOUTUBE_HELP' => $lang['s_youtube_help'],

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

    'L_SLIDER_HELP' => $lang['s_slider_help'],

// END HighSlider

#

#-----[ OPEN ]---------------------------------

#

includes/bbcb_mg_small.php

#

#-----[ FIND ]---------------------------------

#

    'L_BBCB_MG_YOUTUBE' => $lang['bbcb_mg_youtube'],

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

    'L_BBCB_MG_SLIDER' => $lang['bbcb_mg_slider'],

// END HighSlider

#

#-----[ FIND ]---------------------------------

#

    'L_YOUTUBE_HELP' => $lang['s_youtube_help'],

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

    'L_SLIDER_HELP' => $lang['s_slider_help'],

// END HighSlider

#

#-----[ OPEN ]---------------------------------

#

includes/bbcode.php

#

#-----[ FIND ]---------------------------------

#

            'youtube' => array(

                    'nested' => true,

                    'inurl' => true,

                    'allow_empty' => false,

                    ),

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

            'slider' => array(

                    'nested' => true,

                    'inurl' => true,

                    'allow_empty' => false,

                    ),

// END HighSlider

#

#-----[ FIND ]---------------------------------

#

            if( ($tag === 'flash') || ($tag === 'swf') || ($tag === 'video') || ($tag === 'ram') || ($tag === 'quick') || ($tag === 'stream') || ($tag === 'emff') || ($tag === 'mp3') || ($tag === 'youtube') || ($tag === 'googlevideo') )

#

#-----[ IN LINE FIND ]---------------------------------

#

| ($tag === 'youtube') |

#

#-----[ IN LINE,AFTER ADD ]---------------------------------

#

| ($tag === 'slider') |

#

#-----[ FIND ]---------------------------------

#

                elseif ($tag === 'youtube')

                {

                    $html = '<object width="425" height="350"><param name="movie" value="h**p://***.youtube.com/v/' . $content . '" /><embed src="h**p://***.youtube.com/v/' . $content . '" type="application/x-shockwave-flash" width="425" height="350"></embed></object><br /><a href="h**p://youtube.com/watch?v=' . $content . '" target="_blank">Link</a><br />';

                }

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

                elseif ($tag === 'slider')

                {

                    $html = '

<div>

<a id="thumb1" href="' . $content . '" class="rounded-white" onclick="return hs.expand(this, {captionId: 'caption1'})"><img src="' . $content . '" style="height:100px; width:auto;" alt="Highslide JS" title="Click to enlarge"></a>

<div class="highslide-caption" id="caption1">

HighSlide modification by icythemes.com

</div>

</div>';

}

// END HighSlider

#

#-----[ OPEN ]---------------------------------

#

includesalbum_modalbum_bbcode.php

#

#-----[ FIND ]---------------------------------

#

            'youtube' => array(

                    'nested' => true,

                    'inurl' => true,

                    'allow_empty' => false,

                    ),

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

            'slider' => array(

                    'nested' => true,

                    'inurl' => true,

                    'allow_empty' => false,

                    ),

// END HighSlider

#

#-----[ FIND ]---------------------------------

#

        if($tag === 'flash' || $tag === 'swf' || $tag === 'video' || $tag === 'ram' || $tag === 'quick' || $tag === 'stream' || $tag === 'emff' || $tag === 'youtube' || $tag === 'googlevideo')

#

#-----[ IN LINE FIND ]---------------------------------

#

| $tag === 'youtube' |

#

#-----[ IN LINE,AFTER ADD ]---------------------------------

#

| $tag === 'slider'|

#

#-----[ FIND ]---------------------------------

#

                elseif ($tag === 'youtube')

                {

                    $html = '<object width="425" height="350"><param name="movie" value="h**p://***.youtube.com/v/' . $content . '" /><embed src="h**p://***.youtube.com/v/' . $content . '" type="application/x-shockwave-flash" width="425" height="350"></embed></object><br /><a href="h**p://youtube.com/watch?v=' . $content . '" target="_blank">Link</a><br />';

                }

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

                elseif ($tag === 'slider')

                {

                    $html = '

<div>

<a id="thumb1" href="' . $content . '" class="rounded-white" onclick="return hs.expand(this, {captionId: 'caption1'})"><img src="' . $content . '" style="height:100px; width:auto;" alt="Highslide JS" title="Click to enlarge"></a>

<div class="highslide-caption" id="caption1">

HighSlide modification by icythemes.com

</div>

</div>';

}

// END HighSlider

#

#-----[ OPEN ]---------------------------------

#

languagelang_englishbbcb_mg.js

#

#-----[ FIND ]---------------------------------

#

s_youtube_help = 'Insert YouTube video file: [youtube]YouTube ID[/youtube]';

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

s_slider_help = 'Insert image: [slider]h**p://image_url[/slider]';

// END HighSlider

#

#-----[ FIND ]---------------------------------

#

var youtube = 0;

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

var slider = 0;

// END HighSlider

#

#-----[ FIND ]---------------------------------

#

'[youtube]','[/youtube]',

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

'[slider]','[/slider]',

// END HighSlider

#

#-----[ FIND ]---------------------------------

#

function BBCyoutube()

{

    var FoundErrors = '';

    var enterURL = prompt(s_youtube_insert, s_id_insert_tip);

    if (!enterURL)

    {

        FoundErrors += s_id_insert_error;

    }

    if (FoundErrors)

    {

        alert(s_gen_error + FoundErrors);

        return;

    }

    var ToAdd = "[youtube]"+enterURL+"[/youtube]";

    PostWrite(ToAdd);

}

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

function BBCslider()

{

    var FoundErrors = '';

    var enterURL = prompt(s_url_insert, s_url_insert_tip);

    if (!enterURL)

    {

        FoundErrors += s_file_insert_error;

    }

    if (FoundErrors)

    {

        alert(s_gen_error + FoundErrors);

        return;

    }

    var ToAdd = "[slider]"+enterURL+"[/slider]";

    PostWrite(ToAdd);

}

// END HighSlider

#

#-----[ OPEN ]---------------------------------

#

languagelang_englishlang_bbcb_mg.php

#

#-----[ FIND ]---------------------------------

#

$lang['bbcb_mg_youtube'] = 'YouTube';

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

$lang['bbcb_mg_slider'] = 'HighSlider';

// END HighSlider

#

#-----[ FIND ]---------------------------------

#

$lang['s_youtube_help'] = 'Insert YouTube file: [youtube]YouTube ID[/youtube]';

#

#-----[ AFTER ADD ]---------------------------------

#

// BEGIN HighSlider

$lang['s_slider_help'] = 'Insert image: [slider]h**p://image_url[/slider]';

// END HighSlider

#

#-----[ OPEN ]---------------------------------

#

templatesmg_themesoverall_include.tpl

#

#-----[ FIND ]---------------------------------

#

<!-- END switch_lightbox -->

#

#-----[ AFTER ADD ]---------------------------------

#

<!-- BEGIN HighSlider -->

<script type="text/javascript" src="{FULL_SITE_PATH}highslide/highslide-with-gallery.js"></script>

<link rel="stylesheet" type="text/css" href="{FULL_SITE_PATH}highslide/highslide-with-gallery.css">

<script type="text/javascript">

    hs.graphicsDir = 'highslide/graphics/';

    hs.align = 'center';

    hs.transitions = ['expand', 'crossfade'];

    hs.outlineType = '';

    hs.fadeInOut = true;

    hs.dimmingOpacity = 0.75;

    // Add the controlbar

    if (hs.addSlideshow) hs.addSlideshow({

        //slideshowGroup: 'group1',

        interval: 5000,

        repeat: false,

        useControls: true,

        fixedControls: true,

        overlayOptions: {

        opacity: .75,

        position: 'top center',

        hideOnMouseOut: true

    }

    });

</script>

<!-- END HighSlider -->

#

#-----[ OPEN ]---------------------------------

#

templatesmg_themesbbcb_mg.tpl

#

#-----[ FIND ]---------------------------------

#

                    <!-- END switch_postimage_org -->

                    <span class="genmed">&nbsp;&nbsp;</span>

#

#-----[ AFTER ADD ]---------------------------------

#

<!-- BEGIN HighSlider -->

                    <a href="javascript:BBCslider()"><img src="{BBCB_MG_IMG_PATH}slider{BBCB_MG_IMG_EXT}" name="slider"  onMouseOver="helpline('slider')" alt="{L_BBCB_MG_SLIDER}" title="{L_BBCB_MG_SLIDER}" class="bbimages" /></a>

                    <span class="genmed">&nbsp;</span>

<!-- END HighSlider -->

#

#-----[ SAVE/CLOSE ALL FILES ]------------------------------------------

#6 Sun 28 Sep, 2008 08:56

Mighty Gorgon

Luca Libralato

Joined: August 2006
Posts: 7192
Location:

Borgo San Michele

Re: Adding New BBcode Tags

You need to add the tag into this array: var $allowed_bbcode = array (follow what has been done for others...)

Then you need to add the IF statement into the function process_tag(&$item) adding the HTML you want to output.

That should be enough for your BBCode to work.

____________
Luca
SEARCH is the quickest way to get support.
Icy Phoenix ColorizeIt - CustomIcy - HON

#7 Sun 28 Sep, 2008 11:59

glenflet

Joined: May 2008
Posts: 16
Location:

Gosford

Re: Adding New BBcode Tags

Ok,I've got the BBcode working now, thanks for the help

How to Add Rainbow and Neon Text

EXTRACT texteffects.zip to templates/common/js

OPEN includes/bbcode.php
FIND

Code: [Download] [Hide] [Select]

            'rainbow' => array(

                    'nested' => true,

                    'inurl' => true,

                    'allow_empty' => false,

                    ),

REPLACE WITH

Code: [Download] [Hide] [Select]

            'gradient' => array(

                    'nested' => true,

                    'inurl' => true,

                    'allow_empty' => false,

                    ),

ADD AFTER

Code: [Download] [Hide] [Select]

            'neon' => array(

                    'nested' => false,

                    'inurl' => false,

                    ),

            'rainbow' => array(

                    'nested' => false,

                    'inurl' => false,

                    ),

FIND

Code: [Download] [Hide] [Select]

        // RAINBOW

        if($tag === 'rainbow')

        {

            /*

            if($this->is_sig)

            {

                return $error;

            }

            */

            $html = rainbow($content);

            return array(

                'valid' => true,

                'html' => $html,

                'allow_nested' => false,

            );

        }

REPLACE WITH

Code: [Download] [Hide] [Select]

        // GRADIENT

        if($tag === 'gradient')

        {

            /*

            if($this->is_sig)

            {

                return $error;

            }

            */

            $html = rainbow($content);

            return array(

                'valid' => true,

                'html' => $html,

                'allow_nested' => false,

            );

        }

ADD AFTER

Code: [Download] [Hide] [Select]

        // RAINBOW

        if($tag === 'rainbow')

        {

            /*if($this->is_sig)

            {

                return $error;

            }*/

            $speed = 80;

            if(isset($item['params']['speed']))

            {

                try

                {

                    $speed = intval($item['params']['speed']);

                } catch (Exception $e) {

                    break;

                }

            }

            $text = $content;

            if(strpos($text,"n") !== false)

            {

                return $error;

            }

            $html = "n<script language="javascript" type="text/javascript">nvar text = "". $text . ""nvar speed = " . $speed . " nrainbow()n</script>n<noscript>" . $text . "</noscript>n";

            return array(

                'valid' => true,

                'html' => $html,

            );

        }

        // NEON

        if($tag === 'neon')

        {

            /*if($this->is_sig)

            {

                return $error;

            }*/

            $speed = 80;

            if(isset($item['params']['speed']))

            {

                try

                {

                    $speed = intval($item['params']['speed']);

                } catch (Exception $e) {

                    break;

                }

            }

            $colors = array();

            $red = 128;

            $green = 128;

            $blue = 128;

            if(isset($item['params']['basecolor']))

            {

                try

                {

                    $colors = split(",",$item['params']['basecolor']);

                    for($i=0;$i<3;$i++)

                    {

                        if (intval($colors[$i]) > 255)

                        {

                            $colors[$i] = "255";

                        }

                        elseif (intval($colors[$i]) < 0)

                        {

                            $colors[$i] = "0";

                        }

                    }

                    $red = intval($colors[0]);

                    $green = intval($colors[1]);

                    $blue = intval($colors[2]);

                } catch (Exception $e) {

                    break;

                }

            }

            $basecolor = "rgb(" . $red . ", " . $green . ", " . $blue . ")";

            $red = 64;

            $green = 64;

            $blue = 255;

            if(isset($item['params']['textcolor']))

            {

                try

                {

                    $colors = split(",",$item['params']['textcolor']);

                    for($i=0;$i<3;$i++)

                    {

                        if (intval($colors[$i]) > 255)

                        {

                            $colors[$i] = "255";

                        }

                        elseif (intval($colors[$i]) < 0)

                        {

                            $colors[$i] = "0";

                        }

                    }

                    $red = intval($colors[0]);

                    $green = intval($colors[1]);

                    $blue = intval($colors[2]);

                } catch (Exception $e) {

                    break;

                }

            }

            $textcolor = "rgb(" . $red . ", " . $green . ", " . $blue . ")";

            $text = $content;

            if(strpos($text,"n") !== false)

            {

                return $error;

            }

            $html = "n<script language="javascript" type="text/javascript">nvar text = "". $text . ""nvar speed = " . $speed . " nvar basecolor = "" . $basecolor . ""nvar textcolor = "" . $textcolor . ""nneon()n</script>n<noscript>" . $text . "</noscript>n";

            return array(

                'valid' => true,

                'html' => $html,

            );

        }

OPEN templates/mg_themes/overall_include.tpl
FIND

Code: [Download] [Hide] [Select]

{UPI2DB_FIRST_USE}

ADD BEFORE

Code: [Download] [Hide] [Select]

<script type="text/javascript" src="{FULL_SITE_PATH}{T_COMMON_TPL_PATH}js/texteffects.js"></script>

NOTE: If you have other base template, You'll need to modify them as well.

BBcode Info
Key
{optional=Defualt Value}
required=Format

Neon
Highlight letter by letter at given speed, stays lit for a bit thte restarts.

Code: [Download] [Hide] [Select]

[neon {speed=80} {basecolor=128,128,128} {textcolor=0,0,255}]Text here[/neon]

Rainbow
Text changes colour at given speed

Code: [Download] [Hide] [Select]

[rainbow {speed=80}]Text here[/neon]

NOTE: the old rainbow is now gradient

texteffects.zip
Description:	Text effects Java Script	Download
Filename:	texteffects.zip
Filesize:	871 Bytes
Downloaded:	212 Time(s)

#8 Mon 29 Sep, 2008 04:48

Page 1 of 1

Was this topic useful?

Link this topic
URL
BBCode
HTML

The time now is Sat 21 Dec, 2024 16:49 • All times are UTC + 1 Hour

Permissions List

You cannot post new topics
You cannot reply to topics
You cannot edit your posts
You cannot delete your posts
You cannot vote in polls
You cannot attach files
You can download files
You cannot post calendar events