Posted on 2 Comments

How to add Beautiful MyBB Thread Prefix tags

Have you ever wanted to add beautiful thread prefix to your MyBB forums? If you have wanted to add such prefix or tags, the answer is here. In this tutorial, you will learn about how to add MyBB Thread Prefix and Style them to bring a fresh feeling to your forums.

For this tutorial, make sure to have a complete backup before following this tutorial for any theme.

Note – This tutorial is moderate level and requires knowledge of CSS to make advanced modifications

Tutorial

  • Go to your Admin CP > General Settings > Select Thread Prefix from left side of your forum.
  • Click Add new prefix and you will see a form like this –
  • Fill the above form with Prefix and Display style
    • Prefix – Its an option which shows thread prefix on thread prefix option list on new thread pages and edit post pages.
    • Display Style – This is how the prefix will appear next to thread subjects. You may enter HTML markup here or simply use the same as the plain text version above.
    • Available in forums – If you wish to show that prefix in all forums then select “All Forums” option, otherwise, if you want to show in selective forums then select “Select forums” and then select the forums you wish to add that prefix in.
    • Available to groups – Similarly, If you wish to show that prefix to all usergroups then select “All groups” option, otherwise, if you want to show to selective usergroups then select “Select groups” and then select the usergroups you wish usergroups to show that prefix.
  • Write Prefix as Peach Theme and Display Style as (Note: We are using Font Awesome 5, so make sure you have added font awesome icons to your forum.
<span class="theme_orange"><i class="fas fa-hand-peace" aria-hidden="true"></i> Peach Theme - </span>
  • Save Thread Prefix, now we need to add the style for the newly created thread prefix
  • Go to Admin CP > Template and Style > Theme > Add Stylesheet
  • Write the Name of Stylesheet as tags.css and Select Write my own content. Write the below code in the newly appeared dialog box

.theme_orange {
    color: #000;
    background: #ffc391;
    padding: 2px 4px;
    font-size: 10px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
  • Save the above template and now to go to your forum and try creating a new thread. You will see the new Thread prefix with a beautiful style.

Congratulations, you have now added a new thread prefix with a unique style. You can modify the above CSS to your liking and match it with your theme design. You can see Thread Prefix live on WallBB support forums

For more tutorials follow me on Twitter @WallBB

2 thoughts on “How to add Beautiful MyBB Thread Prefix tags

  1. This is great, hope it works on other FREE themes too. Though if my theme doesn’t show “tags ” already in the theme layout, what code is used to add them? (Maybe this should be added to ur Tut), as most ppl reading this will be using other FREE themes from myBB community….

    I think you should do a whole CSS Tutorial series every weekend/Or fortnightly (it’ll be massive cos ppl want to update their themes with FontAwesome Icons on Menus and Forum Name & Categories & Footers info for example, plus cool looking CSS to change basic looking areas of themes 🙂

    P.S some AJAX and JS/jQuery will look sweet on MENUS etc too btw 😉

    Thanks, can’t wait for next CSS Tutorial to put into action and share link with our Crowd-Sourced Web Project Collaborative Twitter & Blog followers @Code_Collective

    1. The above tutorial will allow Thread prefix style in every theme. This tutorial is irrespective of theme you are using 🙂

      I will try to add more tutorials every week 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.