1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

XF 1.2 Looking for a simple way to put links to a persons website under avatar

Discussion in 'Styling and Customization Questions' started by LurkerLou, Jan 17, 2014.

  1. LurkerLou

    LurkerLou Active Member

    What I'm looking to do is create a custom user field that will be appear under the person's avatar in threads. Under the avatar will be a graphic, such as an Imgur logo, and if someone clicks the logo it goes to the person's Imgur page. Can anybody point me in the right direction?
     
  2. katsulynx

    katsulynx Well-Known Member

    You can create Custom User Fields in your ACP -> Users -> user Customization -> Custom User Fields. Set it to "Viewable in message user info" under "General Options" to appear in the Postbit. You can use the "Value Display HTML" below to style it as you like.
     
  3. LurkerLou

    LurkerLou Active Member

    That's what I was doing but I had custom fields disabled in the style. Now, another question. The custom field name still appears with the linked graphic under the avatar. Anyway to have it just display the graphic not the name and graphic?
     
  4. katsulynx

    katsulynx Well-Known Member

    Add the following code to your Extra.css:
    Code:
    .thread_view .messageUserBlock .extraUserInfo dl.userField_YOURFIELDID {
    display: none
    }
    Remember to fill in your user field id in the code above.
     
  5. LurkerLou

    LurkerLou Active Member

    Tried it. Replaced YOURFIELD with the Field Id but no go. Is below correct?

    Code:
    .thread_view .messageUserBlock .extraUserInfo dl.userField_IMGUR {
    display: none
    }
     
  6. katsulynx

    katsulynx Well-Known Member

    Sorry, messed something up there. Your code must be:
    Code:
    .thread_view dl.userField_IMGUR dt {
    display: none;
    }
    That should do it.
     
  7. LurkerLou

    LurkerLou Active Member

    Dang it. Still there.
     
  8. katsulynx

    katsulynx Well-Known Member

    Works in my example:

    image.png
     
  9. LurkerLou

    LurkerLou Active Member

    I'll create the field from scratch and try again.
     
  10. LurkerLou

    LurkerLou Active Member

    Still no go. It's working for you so I have to have something funky going on on my end. I'll try it on a different style.

    Another question, anyway to flush left the graphic, text in your example, or is it always going to have to be on the right?
     
  11. katsulynx

    katsulynx Well-Known Member

    Use the following:
    Code:
    .thread_view dl.userField_IMGUR dd {
    float: left;
    
    However it will only work combined with the snipped above when you hide the dt-tag. You could also try to add an !important to all of the definitions above. Whole could would look like this then:
    Code:
    .thread_view dl.userField_IMGUR dt {
    display: none !important;
    }
    .thread_view dl.userField_IMGUR dd {
    float: left !important;
    
    If you provide a link to your forum, I can have a look at your code and if you have done everything right btw.
     

Share This Page