List of Khoros Community OOTB and Custom components

AndyK JohnD  How about the search results page? I see that you allow filtering results by Label. Is this configurable OOTB or a customization?

Cloudera  filtering by labels on search page is present OOB

while looking at a post in a thread, if you hover over the username, a pop out with the username is displayed. Which componet needs to be modified to include first and last name? Is it member profile?

The mark-up inside the profile card is produced by an endpoint.  If you want to customize this beyond the admittedly barebones content included by default, add an override for the theme-lib.profile-card endpoint in Studio -> Macros (or res/controllers/theme-lib.profile-card.ftl via Community SDK), and start with this code:

<#compress>
<#setting number_format="0.######"/>
<#include "theme-lib.common-functions.ftl" />

<#assign userId = getRequestField("userId", "-1", true)?number />

<#if userId gt 0 && validEndpointRequest(false, true, false)>
	<#assign userQry = "SELECT login, view_href, rank.name, rank.color, avatar.profile FROM users WHERE id='${userId}'" />
	<#assign userProfileData = executeLiQLQuery(userQry) />
	<#if userProfileData?size gt 0>
		<#assign userProfileData = userProfileData[0] />
	</#if>
	
	<div class="lia-message-author-avatar lia-component-author-avatar">
		<div class="UserAvatar lia-user-avatar lia-component-common-widget-user-avatar">
			<span class="UserAvatar lia-link-navigation">
				<img class="lia-user-avatar-message" title="${(userProfileData.login)!""}" alt="${(userProfileData.login)!""}" src="${(userProfileData.avatar.profile)!""}" />
      </span>
		</div>
	</div>
	<div class="user-info">
		<div class="mini-profile-author">${(userProfileData.login)!""}</div>
		<div class="mini-profile-rank">${(userProfileData.rank.name)!""}</div>
	</div>
	<div class="links-area">
		<a href="${(userProfileData.view_href)!""}" class="profile-link">${text.format("custom.mini.profile.view.link")} <i class="lia-fa lia-fa-angle-right"></i></a>
	</div>
</#if>
</#compress>

You can then modify the LiQL call and mark-up as you like. 

See the Khoros Developer Docs for more info:  https://developer.khoros.com/khoroscommunitydevdocs/reference/khoros-communities-platform-apis

Thanks for the reply, seems easy enough. Path taken: STUDIO->ENDPOINT->New Macro

created new macro theme-lib.profile-card@override. Made slight change to the default but change is not being reflected.

Trying naming your component "theme-lib.profile-card", without the "@override".

TysonN When I try and create theme-lib.profile-card as a macro (what you said originally), I get the error: "Duplicate file name." Same when I try to create it as an endpoint. Creating as a component has no effect.

Thanks, phoneboy , you're right!

Since Studio doesn't allow creation of that override, you'll need to use the Community SDK to do it.  And you'll also need to create the endpoint XML file, if you want the override to show up in Studio after creation.  You'd need these two files:

/res/controllers/theme-lib.profile-card.ftl:

<#compress>
<#setting number_format="0.######"/>
<#include "theme-lib.common-functions.ftl" />

<#assign userId = getRequestField("userId", "-1", true)?number />

<#if userId gt 0 && validEndpointRequest(false, true, false)>
	<#assign userQry = "SELECT login, view_href, rank.name, rank.color, avatar.profile FROM users WHERE id='${userId}'" />
	<#assign userProfileData = executeLiQLQuery(userQry) />
	<#if userProfileData?size gt 0>
		<#assign userProfileData = userProfileData[0] />
	</#if>
	
	<div class="lia-message-author-avatar lia-component-author-avatar">
		<div class="UserAvatar lia-user-avatar lia-component-common-widget-user-avatar">
			<span class="UserAvatar lia-link-navigation">
				<img class="lia-user-avatar-message" title="${(userProfileData.login)!""}" alt="${(userProfileData.login)!""}" src="${(userProfileData.avatar.profile)!""}" />
      </span>
		</div>
	</div>
	<div class="user-info">
		<div class="mini-profile-author">${(userProfileData.login)!""}</div>
		<div class="mini-profile-rank">${(userProfileData.rank.name)!""}</div>
	</div>
	<div class="links-area">
		<a href="${(userProfileData.view_href)!""}" class="profile-link">${text.format("custom.mini.profile.view.link")} <i class="lia-fa lia-fa-angle-right"></i></a>
	</div>
</#if>
</#compress>

/res/endpoints/theme-lib.profile-card.endpoint.xml:

<endpoint version="1.0.0" key="theme-lib.profile-card" feature="custom.communitythemes.support">
  <model/>
  <view type="freemarker" contenttype="text/html" macro="false"/>
  <controller id="basic" path="/theme-lib.profile-card"/>
</endpoint>

I tested this out in a sandbox, and I see this in Studio:

Has anything changed to this list in the last couple of years?

There is probably some updates needed. I will meet with the devs and review in the near future