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

XF 1.5 Profile Page Tab Style Question

Discussion in 'Styling and Customization Questions' started by kingjavo, Jan 6, 2016.

  1. kingjavo

    kingjavo Member

    Anyone know how to change the tabs on the Profile page to be images with nice tooltips? I've located the below add-on, which works for the default tabs but not "Post Areas" or "Gamer Cards" tabs which were add-ons of course.

    https://xenforo.com/community/resources/profile-page-tab-icon-replacement.2445/

    I've posted a comment showing my issue as an example. Se7ensins.com has a perfect example of what I'm after for my site.

    Any help would be greatly appreciated! :)
     
  2. James

    James Well-Known Member

    Looking at that you're just changing the xen: phrase to the link to your image. You'll need to do this in the addon templates for those addons (assuming they're templates and not just injected HTML via PHP)
     
  3. Gemma

    Gemma Well-Known Member

    Not sure about Post Areas as I don't use that add-on (you'll be looking for a post areas template that has member_view in the title).

    For Gamer Cards, make sure Debug is enabled, go to Appearance > Template Modifications > [PE] Gamer Profiles > find member_view (Adds a tab to member view for the gamer cards) - change the contents of the Replace box to this (change the FontAwesome icon fa fa-newspaper-o fa-fw accordingly)

    Code:
    <xen:if is="{$xenOptions.gamerMemberViewCards} AND {$visitor.permissions.peGamerProfiles.canViewMemberGamerCards}">
    <li><a title="{xen:phrase gamer_cards}" href="{$requestPaths.requestUri}#gamer-card" class="Tooltip"><span class="fa fa-newspaper-o fa-fw"></span></a></li>
    </xen:if>
    $0
    My profile layout is different but the concept behind the tabs in the same

    [​IMG]
     
    Last edited: Jan 6, 2016
  4. kingjavo

    kingjavo Member

    That worked perfectly! :)

    Here's how I updated the Post Areas tab.

    Make sure Debug is enabled, go to Appearance > Template Modifications > Post Areas > member_view The Post Areas tab heading

    HTML:
    <li><a title="{xen:phrase post_areas}" href="{$requestPaths.requestUri}#PostAreas" class="Tooltip"><span class="fa fa-area-chart fa-fw"></span></a></li>
    $0
     

Share This Page