Replace html with bbcode (in posts)

Technical Details

Forum version : #phpBB3
Position : Founder
Concerned browser(s) : Mozilla Firefox, Google Chrome, Internet Explorer
Forum link : http://mayo.forumpolish.com

Description of problem

I want to replace this code:

Code:

<div class="tele_bg">
<div class="tele_ico">
<img src="OBRAZEK LUB GIF"></div>
<div class="tele_name">IMIĘ POSTACI</div><div class="tele_msn">

<p>Treść wiadomości</p>
<p>Treść wiadomości</p>
<p>[img="link"]OBRAZEK W WIADOMOŚCI[/img]</p>

</div><div class="tele_field"></div></div>

with something more or less like this:

Code:

[tele]
[teleimg]OBRAZEK LUB GIF[/teleimg]
[telename]IMIĘ POSTACI[/telename]

[p]Treść wiadomości[/p]
[p]Treść wiadomości[/p]
[p][img="link"]OBRAZEK W WIADOMOŚCI[/img][/p]
[/tele]

I saw this topic: https://help.forumotion.com/t153342-tutorial-create-new-bbcode-tags?highlight=bbcode , but it looks more complicated than what I want.

Any ideas?

Edit: I have something like this - but maybe is better way to do that?

Code:

(function() {
    BBParser = {
        initialize: function() {
            $(function() {
                BBParser.setupBBParser()
            })
        },
        add: [{
            tag: 'zapro',
            close: true,
            replacement: '<div class="wizmot zapro">{content}</div>'
        }, {
            tag: 'kom',
            close: true,
            replacement: '<div class="wizkom">{content}</div>'
        }, {
            tag: 'status',
            close: true,
            replacement: '<div class="wizmot stat">{content}</div>'
        }, {
            tag: 'zaczep',
            close: true,
            replacement: '<div class="wizmot czep">{content}</div>'
        }, {
            tag: 'lubie',
            close: true,
            replacement: '<div class="wizcyt">{content}</div>'
        }, {
            tag: 'inne',
            close: true,
            replacement: '<div class="wizmot inne">{content}</div>'
        }],
        validateTag: function(a) {
            if (!/^\w+$/.test(a)) throw new RangeError("You added an invalid tag: " + a)
        },
        replacers: function(a, b, c) {
            return (a || "").replace(/{option}/g, b || "").replace(/{content}/g, c || "")
        },
        optionReg: /.*?=("|'|)(.*?)\1\]/,
        parsedContent: function(a, b, c) {
            return a.replace(c ? RegExp("(\\[" + b.tag + "[^\\]]*\\])([\\s\\S]*?)\\[/" + b.tag + "]", "g" + (b.insensitive ? "i" : "")) : RegExp("\\[" + b.tag + "[^\\]]*\\]", "g" + (b.insensitive ? "i" : "")), function(d, e, f) {
                c || (e = d);
                e = BBParser.optionReg.test(e) ? e.replace(BBParser.optionReg, "$2") : b.defaultOption;
                if ("undefined" !== typeof b.replace) {
                    d = c ? b.replace(e, f) : b.replace(e);
                    "string" === typeof d ? c ? f = d : e = d : d;
                    "object" === typeof d && (e = d.option || e, f = d.content || f)
                }
                return BBParser.replacers(b.replacement, e, f)
            })
        },
        setupBBParser: function() {
            var postBody = $(".postbody, .blog_message");
            for (var i = 0, e;
                (e = postBody[i++]);) {
                for (var j in BBParser.add) {
                    var item = BBParser.add[j];
                    BBParser.validateTag(item.tag);
                    e.innerHTML = BBParser.parsedContent(e.innerHTML, item, item.close)
                }
            }
        }
    };
    BBParser.initialize()
})();

hello

how about this https://help.forumotion.com/t160451-moderation-tools-for-the-message-editor

If I read it correctly, it's something only for administrators and moderators, and it isn't editable solution. But something "static" - not changeable in every post?

I need something which my users can edit themself. The bold text is for users to edit.

[tele]
[teleimg]IMAGE OR GIF LINK[/teleimg]
[telename]RPG CHARACTER NAME[/telename]

[p]TEXT[/p]
[p]TEXT[/p]
[p][img="link"]IMAGE LINK[/img][/p]
[/tele]

Good afternoon!

How about this tutorial? You can tweak it a bit and a good basis for creating bbcode

A slightly simplified code on the French support forum: tutorial

Again, it's for moderators and admins only.

I guess I'll have to leave the html for users to use then. Anyway, thank you for your help. I mark it as solved even though it wasn't solved, but you can close the topic. xD

The user role check can be removed and the buttons become available to all users.

Problem solved & topic archived. Please read our forum rules: ESF General Rules