How to add icons to custom BBCodes?

@halilesen · 11 Apr 2024 · 966 views
Post Reply
User avatar
halilesen
#1 ·
Posts: 57
Joined: 24 Mar 2024, 18:09
Full Name: Halil ESEN
Has liked: 12
Been liked: 9
When you add a custom BBcode to your phpBB forum, it will appear in the editor with text, not with an icon like the others. In this topic, I will tell you how you can add the icon you want to the BBcodes you have added.

First, select a BBCode and find its tag. For example, for [hashtag][/hashtag] it is hashtag. Then find an icon for your BBcode from Font Awesome 4.

The code that will display your BBcode as an icon instead of text in editor is as follows.

Code: Select all

$(document).ready(function(){
    $('.bbcode-hashtag').html("<i class='icon fa-hashtag fa-fw'></i>");
});
Notice the .bbcode-hashtag. It should be .bbcode-BBcodeTag. Change <i class='icon fa-hashtag fa-fw'></i> or even just fa-hashtag depending on the icon you choose.

Then open the /template/ajax.js file of the style you are using. Find the following line at the bottom of the file:

Code: Select all

})(jQuery); // Avoid conflicts with other libraries
Add your code before this line. Save changes and clear the phpBB cache.

Now your BBcode is shown with an icon.
Post Reply