How do I add a colored bar based on group? 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

    How do I add a colored bar based on group?

    Kratos
    Kratos
    Forumember


    Male Posts : 328
    Reputation : 24
    Language : English
    Location : United States

    In progress How do I add a colored bar based on group?

    Post by Kratos January 24th 2016, 4:37 am

    Hello, I would like to have a bar above each post a moderator or admin makes colored, APE said it in this topic
    Kratos
    Kratos
    Forumember


    Male Posts : 328
    Reputation : 24
    Language : English
    Location : United States

    In progress Re: How do I add a colored bar based on group?

    Post by Kratos January 26th 2016, 7:01 am

    Bump. Topic is revived after a long hiatus!
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13246
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    In progress Re: How do I add a colored bar based on group?

    Post by Ange Tuteur January 26th 2016, 4:57 pm

    Hi @Kratos,

    This topic should answer your question, but if you need any help let me know.
    Kratos
    Kratos
    Forumember


    Male Posts : 328
    Reputation : 24
    Language : English
    Location : United States

    In progress Re: How do I add a colored bar based on group?

    Post by Kratos January 26th 2016, 5:09 pm

    @Ange Tuteur, in the topic you linked me, I couldn't find the CSS in my stylesheet.
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13246
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    In progress Re: How do I add a colored bar based on group?

    Post by Ange Tuteur January 26th 2016, 5:19 pm

    That's because you're supposed to add it in yourself. What a Face
    Kratos
    Kratos
    Forumember


    Male Posts : 328
    Reputation : 24
    Language : English
    Location : United States

    In progress Re: How do I add a colored bar based on group?

    Post by Kratos January 26th 2016, 5:46 pm

    Ange Tuteur wrote:That's because you're supposed to add it in yourself. What a Face
    Okay then. Add your example too?
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13246
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    In progress Re: How do I add a colored bar based on group?

    Post by Ange Tuteur January 26th 2016, 5:57 pm

    To make it simple, add these to your CSS :
    Code:
    .post {
      border-top:14px solid #CCC;
    }

    .post.st-answer {
      border-color:#39C;
    }

    Then add this to a rank title :
    Code:
    <span class="st-rang"></span>

    Lastly add this to a JavaScript with placement in the topics :
    Code:
    $(function() {
      $('.st-rang').closest('.post').addClass('st-answer');
    });
    Kratos
    Kratos
    Forumember


    Male Posts : 328
    Reputation : 24
    Language : English
    Location : United States

    In progress Re: How do I add a colored bar based on group?

    Post by Kratos January 26th 2016, 6:24 pm

    Added the Javascript, copy and pasted with my phone and it didn't look like what you showed. Instead when I looked at a post it showed a white line and when I saw the js, it was straight.(No line breaks)
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13246
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    In progress Re: How do I add a colored bar based on group?

    Post by Ange Tuteur January 26th 2016, 6:30 pm

    Everything looks okay, but did you add this HTML to your rank title ?
    Code:
    <span class="st-rang"></span>
    Kratos
    Kratos
    Forumember


    Male Posts : 328
    Reputation : 24
    Language : English
    Location : United States

    In progress Re: How do I add a colored bar based on group?

    Post by Kratos January 26th 2016, 7:06 pm

    Ange Tuteur wrote:Everything looks okay, but did you add this HTML to your rank title ?
    Code:
    <span class="st-rang"></span>
    Yeah, added it to Moderator.
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13246
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    In progress Re: How do I add a colored bar based on group?

    Post by Ange Tuteur January 26th 2016, 7:08 pm

    Did you give yourself this rank ? You need to apply it to a member to give them a color related to the rank.
    Kratos
    Kratos
    Forumember


    Male Posts : 328
    Reputation : 24
    Language : English
    Location : United States

    In progress Re: How do I add a colored bar based on group?

    Post by Kratos January 26th 2016, 7:30 pm

    Ange Tuteur wrote:Did you give yourself this rank ? You need to apply it to a member to give them a color related to the rank.
    Gave it to Luffy. I think I'm a moderator of that group or someone else. Should I remove the moderator?
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13246
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    In progress Re: How do I add a colored bar based on group?

    Post by Ange Tuteur January 26th 2016, 7:55 pm

    I'm looking at the HTML and it appears to be formatted incorrectly.
    How do I add a colored bar based on group? Captur17

    Did you make sure to include the ending span tag ? Like this :
    Code:
    <span class="st-rang">Moderator</span>
    Kratos
    Kratos
    Forumember


    Male Posts : 328
    Reputation : 24
    Language : English
    Location : United States

    In progress Re: How do I add a colored bar based on group?

    Post by Kratos January 26th 2016, 8:26 pm

    Yeah, still wasn't blue though.
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13246
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    In progress Re: How do I add a colored bar based on group?

    Post by Ange Tuteur January 26th 2016, 8:30 pm

    Could you provide me with a test account that has administrative privileges ? Just so I can have a closer look to make sure everything is setup correctly. Think
    Kratos
    Kratos
    Forumember


    Male Posts : 328
    Reputation : 24
    Language : English
    Location : United States

    In progress Re: How do I add a colored bar based on group?

    Post by Kratos January 26th 2016, 11:46 pm

    Ange Tuteur wrote:Could you provide me with a test account that has administrative privileges ? Just so I can have a closer look to make sure everything is setup correctly. Think
    Test Account made Smile.
    Kratos
    Kratos
    Forumember


    Male Posts : 328
    Reputation : 24
    Language : English
    Location : United States

    In progress Re: How do I add a colored bar based on group?

    Post by Kratos January 28th 2016, 12:06 am

    Bump
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13246
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    In progress Re: How do I add a colored bar based on group?

    Post by Ange Tuteur January 28th 2016, 12:08 am

    Kratos wrote:
    Ange Tuteur wrote:Could you provide me with a test account that has administrative privileges ? Just so I can have a closer look to make sure everything is setup correctly. Think
    Test Account made Smile.
    Could you send the information via PM ? Thanks.
    Kratos
    Kratos
    Forumember


    Male Posts : 328
    Reputation : 24
    Language : English
    Location : United States

    In progress Re: How do I add a colored bar based on group?

    Post by Kratos January 28th 2016, 12:28 am

    Ange Tuteur wrote:
    Kratos wrote:
    Ange Tuteur wrote:Could you provide me with a test account that has administrative privileges ? Just so I can have a closer look to make sure everything is setup correctly. Think
    Test Account made Smile.
    Could you send the information via PM ? Thanks.
    Sent it.
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13246
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    In progress Re: How do I add a colored bar based on group?

    Post by Ange Tuteur January 28th 2016, 6:24 pm

    Thanks, sorry for the wait. I hit the snooze last night. tongue

    Anyway, you had everything set correctly, but for some reason the tag wasn't formatting correctly. I reformatted it and it worked now. Think ( As you can see Luffy has a blue bar )
    Kratos
    Kratos
    Forumember


    Male Posts : 328
    Reputation : 24
    Language : English
    Location : United States

    In progress Re: How do I add a colored bar based on group?

    Post by Kratos January 28th 2016, 9:55 pm

    Ange Tuteur wrote:Thanks, sorry for the wait. I hit the snooze last night. tongue

    Anyway, you had everything set correctly, but for some reason the tag wasn't formatting correctly. I reformatted it and it worked now. Think ( As you can see Luffy has a blue bar )
    Thanks Ange Tuteur. For Admins, Graphic Designers do the same thing to their ranks?

    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13246
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    In progress Re: How do I add a colored bar based on group?

    Post by Ange Tuteur January 29th 2016, 12:34 am

    Yes, for each rank you want colored you do the same thing. For example, we have these ranks :

    Code:
    <span class="st-admin">Admin</span>
    <span class="st-desi">Designer</span>

    Then we add to the JS :
    Code:
    $(function() {
      $('.st-rang').closest('.post').addClass('st-answer');
      $('.st-admin').closest('.post').addClass('st-admin');
      $('.st-desi').closest('.post').addClass('st-desi');
    });

    and add some more CSS :
    Code:
    .post.st-admin {
      border-color:#F33;
    }

    .post.st-desi {
      border-color:#C6C;
    }
    Kratos
    Kratos
    Forumember


    Male Posts : 328
    Reputation : 24
    Language : English
    Location : United States

    In progress Re: How do I add a colored bar based on group?

    Post by Kratos January 30th 2016, 5:03 am

    Added everything. I still don't see the orange and green bar.