Iconuri multiple in profil

Pasul 1:

Utilizatori ~> Profiluri ~> Camp din profil ~> Adauga:

Zona de text

Cod:

<span class="first tooltipstered">?</span>

Pasul 2:

Cod:

span.profile_rows[role="awords"] span.first, .field_uneditable span.first {
    padding: 5px 8px;
    clear: both;
    display: inline-block;
    background: #2CA1CE;
    border-radius: 25px;
    color: white;
    font-size: 15px;
}

span.profile_rows[role="awords"] {
    margin-top: 7px;
    overflow: auto;
    position: relative;
    display: block;
}

Pasul 3:

Cod:

<!-- BEGIN profile_field -->
{postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
<!-- END profile_field -->

Cod:

<!-- BEGIN profile_field -->
                                           <span class="profile_rows">{postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}</span>
 <!-- END profile_field -->

Pasul 4:

Creeaza un cod JavaScript

Cod:

// Multiple Icons, Ranks, List, Text.
// SSYT Power 2016 !
!function(_, $) {
    _.FA = {
      onTopic: function() {
         var j = $('.post'), str, html;
         $('span.profile_rows:contains("Multitple :")', j).each(function() {
            $('span.label', this).remove();
            str = $(this).text();
            $(this).html(str);
            $(this).attr('role','awords').append('<br />');
         });
      },
   
      onProfile: function() {
         $('dl[id*="field_"]:contains("Multitple :")', $('div#profile-advanced-details')).each(function() {
            $('dt:eq(0)', this).remove();
            str = $('dd .field_uneditable', this).text();
            $('dd .field_uneditable', this).html(str);
         });
         console.log("on profile");
      }
   };
   
   $(function(){
      (/\/t(\d+)-/.test(window.location.pathname) || /\/t(\d+)p(\d*)-/.test(window.location.pathname) ) && _.FA.onTopic();
      (/\/u(\d+)/.test(window.location.pathname)) && _.FA.onProfile()});
}({}, jQuery);

Demonstratie !