Forum Discussion

iftomkins's avatar
iftomkins
Maven
11 years ago

Mobile profile header on My Kudos page

I'm modifying our mobile site, and I want to have this component <component id="profile-header"/> appear at the top of the MobileMyKudosPage (both received and given).   I've added it to the XML bu...
  • ChiaraS's avatar
    ChiaraS
    11 years ago

    Hi,

     

    you can use the following component:

    <@component id="common.widget.user-name" user="conv:${user.login}" /> 

     

    it take care of showing the username, linking to the user profile page and adds the left and right rank icons if present.

    Just did a quick test and seems to work fine on mobile as well...

iftomkins's avatar
iftomkins
Maven

Hi Chiara, one last question.

 

I'm trying to output that same username with icons code using the widget, but this time its in a slide-over menu, and all the additional HTML formatting around it is making it complicated. Is there a way to output the information but strip all the HTML that comes with it?

 

Thanks!

ChiaraS's avatar
ChiaraS
Lithium Alumni (Retired)
11 years ago

Hi,

 

I don't think there's a way to use a standard component for that, you will need to create a custom component. Here's a similar example I did (may need some adjustments):

 

<#assign user_rank = rest("/users/id/${user.id}/ranking")>
<span class="UserName lia-user-name">
	<#if user_rank.ranking.display.left_image?? && !(user_rank.ranking.display.left_image.@null[0]?? && user_rank.ranking.display.left_image.@null=="true")>
		<img class="lia-user-rank-icon-left" title="${user_rank.ranking.name}" alt="${user_rank.ranking.name}" src="${user_rank.ranking.display.left_image.url}">
	</#if>
	<a class="lia-link-navigation lia-page-link lia-user-name-link" style="color: #${user_rank.ranking.display.color}" target="_self" href="/t5/user/viewprofilepage/user-id/${user.id}">${user.login}</a>
	<#if user_rank.ranking.display.right_image?? && !(user_rank.ranking.display.right_image.@null[0]?? && user_rank.ranking.display.right_image.@null=="true")>
		<img class="lia-user-rank-icon-right" title="${user_rank.ranking.name}" alt="${user_rank.ranking.name}" src="${user_rank.ranking.display.right_image.url}">
	</#if>
</span>