Topic prefix Button Hitskin_logo Hitskin.com

This is a Hitskin.com skin preview
Install the skinReturn to the skin page

The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.
2 posters

    Topic prefix Button

    Winging
    Winging
    Forumember


    Female Posts : 149
    Reputation : 4
    Language : traditional chinese

    Topic prefix Button Empty Topic prefix Button

    Post by Winging September 14th 2020, 9:54 am

    Forum version : #phpBB2
    Position : Founder
    Concerned browser(s) : Google Chrome
    Who the problem concerns : Yourself
    Forum link : https://ekin-ek.666forum.com/

    ---------------

    I have posted an "unresolved" issue.
    https://help.forumotion.com/t159404-about-the-topic-buttonand-statistics-related-items?highlight=Topic

    And I find An idea very close to me,
    I want to change code,And better achieve the goal I want to solve.
    https://help.forumotion.com/t148745-topic-prefix-for-phbb2?highlight=topic

    I have tried and used the prefix in my forum now.
    I want to ask if this code can be turned into a button.
    (Need to change Javascript or CSS?)

    Code:
     
    $.prefijos = function () {
        var i, a = document.querySelectorAll('a:not(#logout), h1,.postdetails,.cattitle'),
            copyright = 'written by Chalo  http://www.opensourcephpbb3.com';
        for (i = 0; i < a.length; i++) {
            var b = a[i].innerHTML;
            if (/\[([^\[\]]+)\]/.test(b)) {
                var c = b.match(/\[(.*?)\]/)[1].toLowerCase().replace(/\W+/g, '-'),
                    d = b.match(/\[(.*?)\]/)[1].toLowerCase(),
                    e = b.replace(/\[.*?\]/, '<span class="prefijo ' + c + '">' + d + '</span>');
                a[i].innerHTML = e
            }
        }
    };
    $(function () {
        $.prefijos()
    });


    Code:
     /* Topic prefix */
    .prefijo {
     background: #22b7e0;
      color: #FFF;
      border-radius: 2px;
      display: inline-table!important;
      line-height: 20px;
      padding: 1px 4px 0;
      font-weight: 700!important;
      font-size: 14px!important;
      text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
      margin-left: 2px;
      font-family: arial;
    }


    Topic prefix Button Ou0010

    And will show different links with the theme, they are separate
    I mean, by clicking the button on the theme, only the "same type" theme can appear
    Such as [Sports], [Music], [Video], [Picture]... etc.

    (My forum)
    (Other website diagrams)

    Topic prefix Button Ou0110

    Topic prefix Button Ou410
    Topic prefix Button Ou510


    I believe that the code can be optimized step by step, and I am trying hard,
    I hope I can make progress with everyone and make the code more diverse.

    Thanks

    SLGray
    SLGray
    Administrator
    Administrator


    Male Posts : 51474
    Reputation : 3523
    Language : English
    Location : United States

    Topic prefix Button Empty Re: Topic prefix Button

    Post by SLGray September 14th 2020, 6:38 pm

    The topic was posted in the wrong section, so I have moved it to the correct section.
    Please read our forum rules:  ESF General Rules



    Topic prefix Button Slgray10

    When your topic has been solved, ensure you mark the topic solved.
    Never post your email in public.