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

Linking to info tab from membercard template

Discussion in 'Styling and Customization Questions' started by ForestForTrees, Mar 20, 2012.

  1. ForestForTrees

    ForestForTrees Well-Known Member

    Hello,

    I'm trying to add a very prominent link to the Information tab of a member's profile from the member's membercard. This is the first time I've ever tinkered with the xen templating language, so it didn't take very long at all to figure out that I was over my head.

    Clearly the following won't work, but hopefully it makes it clear where I'm starting from. The bold text is what would be added to the membercard template.
    Code:
            <div class="userTitleBlurb">
                <h4 class="userTitle">{xen:helper userTitle, $user}</h4>
                <div class="userBlurb">{xen:helper userBlurb, $user, 0}</div>
            </div>
     
            <div class="userTitleBlurb">
                <h4 class="userTitle"><a href="{xen:link 'http://xenforo.com/community/members/brogan.521/#info'}">My Info</a></h4>
            </div>
     
            <blockquote class="status">{xen:helper bodytext, $user.status}</blockquote>
    
    Any ideas on how to get this to work? It doesn't have to be pretty (not that I don't like pretty code; I just want it to work).
     
    Breixo likes this.
  2. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    Before we try to modify the member card...

    The individual tabs on a user's profile page cannot be linked to directly. They don't anchor. I have tried to do this before but was unsuccessful.

    Is there some specific information in that tab that you want to display?
     
  3. ForestForTrees

    ForestForTrees Well-Known Member

    Thank you very much for helping out, Jake. I've heard that you probably know the answer. ;-)

    Yes, the "About You" field on the info tab is very important for our specific community. We are a support community for people who are recovering from chronic pain, and when someone posts their story of recovery (or the progress they've made so far) to their profile, it greatly increases engagement with the community. We want those stories to be front and center, so people can learn about one another and develop a sense of connection. Here's my story (the bloody anchor link fails, as you note):
    http://tmswiki.org/forum/members/forest.6/#info

    If it would be possible to add that field to the default Profile Posts tab and then rename the tab, I think that that would be a terrific solution.

    Plan B, I guess, would be to copy the following line in the "member_view" template from the "<li id="info" class="profileContent">" section to the "<li id="profilePosts" class="profileContent">" section:
    HTML:
    <xen:if is="{$user.about}"><div class="baseHtml ugc">{xen:raw $user.aboutHtml}</div></xen:if>
    
    I'm totally happy to have it in both places. As I mentioned, we really want to highlight this info.

    Does that sound like a feasible approach? Guidance very much appreciated, as our forum team is pretty maxed out these days.
     
  4. Morgain

    Morgain Well-Known Member

    I had much the same issue as I didn't want personal info to be hidden behind tabs.
    I made member_view split the main content area into 2 columns. The first has profile posts - a lot less useful in my opinion, and the second column has the components like About Me and some custom fields.
    It wasn't easy to do and in the end I got help. But it was possible and I think it works well.

    [EDIT] It means that when you click Profile off the membercard it shows this info on the front page of the Profile page.
    I also made that profile link on the membercard much more prominent.
     
  5. ForestForTrees

    ForestForTrees Well-Known Member

    Hello, Shan,

    That sounds very much like what I am thinking of. Would you be willing to share some of the code or the tips that you used? It might save me a lot of work.
     
  6. ForestForTrees

    ForestForTrees Well-Known Member

    I ended up adding the following at the very top of the profile posts tab:
    Code:
    <div class="section">
                            <h3 class="textHeading"><a href="{xen:link account/personal-details}#story">{xen:phrase about}</a></h3>
                            <div class="secondaryContent">
                                    <xen:if is="{$user.about}"><div class="baseHtml ugc">{xen:raw $user.aboutHtml}</div></xen:if>
                            </div>
    </div>
    
    This works fine for people who have filled out their "About You" field, like me:
    http://www.tmswiki.org/forum/members/forest.6/
    However, it looks bad for people who have left it blank:
    http://www.tmswiki.org/forum/members/eliuri.35/
    (Note the blank space at the top.)

    Is there any way to make it so that field doesn't show up at all if it's empty?

    It seems like a <xen: if> </xen:if> pair would fix this, but I have no idea how this would be applied.

    Can anyone help me out with this? Any help you can provide for syntax of the <xen: if> command and the relevant variables would be very helpful.
     
  7. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    Code:
    <xen:if is="{$user.about}">
    <div class="section">
                            <h3 class="textHeading"><a href="{xen:link account/personal-details}#story">{xen:phrase about}</a></h3>
                            <div class="secondaryContent">
                                    <div class="baseHtml ugc">{xen:raw $user.aboutHtml}</div>
                            </div>
    </div>
    </xen:if>
    
     
  8. ForestForTrees

    ForestForTrees Well-Known Member

    Thank you for your patience with such a noobish question! That worked perfectly.
     
    Breixo likes this.
  9. Breixo

    Breixo Active Member

  10. Breixo

    Breixo Active Member

    Hi! I tried adding last code at the top of profile_post tab but it just repeat the story before each profile comment.
    Can you help me showing your actual config?
    Thanks @ForestForTrees !
     
  11. ForestForTrees

    ForestForTrees Well-Known Member

    Hi @Breixo,

    Based on what you've described, it sounds like you may have put the code in the wrong place.

    I put the code in the member_view template, right after the following code:
    Code:
    <ul id="ProfilePanes">
    <li id="profilePosts" class="profileContent">
    If you search for <ul id="ProfilePanes">, you should find the right place quickly. Put the following code after both of the above lines:
    Code:
    <div class="section">
    <h3 class="textHeading"><a href="{xen:link account/personal-details}#story">{xen:phrase about}</a></h3>
    
    <div class="secondaryContent">
    <xen:if is="{$user.about}">
    <div class="baseHtml ugc">{xen:raw $user.aboutHtml}</div>
    <xen:else />
    <div class="baseHtml ugc">This user has not yet added their story. To add your story, <a href="{xen:link account/personal-details}#story">click here</a> and scroll down.</div>
    </xen:if>
    </div>
    </div>
    About 10 lines above, I also replaced "<li><a href="{$requestPaths.requestUri}#profilePosts">{xen:phrase profile_posts}</a></li>" with "<li><a href="{$requestPaths.requestUri}#profilePosts">My Story and Profile Posts</a></li>." I did this so that the tab is appropriately labeled. Theoretically, I should have updated the profile_posts phrase instead.
     
    Breixo likes this.
  12. Breixo

    Breixo Active Member

    Great! Thank you so much!
    It worked like a charm.
    I'll try to make more changes so it looks more like #info tab. That's a perfect starting point.
    Thanks!
     
  13. ForestForTrees

    ForestForTrees Well-Known Member

    Glad to hear it worked.
     
    Breixo likes this.

Share This Page