Public
cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
Director

Post preview on LinkedIn

Hi experts,

I experience this annoying behavior every time I want to link a Community post on LinkedIn: the preview displays the avatar of the author instead of the cover image.

linkedin_postings.png

 

Do you know how to overcome this undesired behavior? Do I miss something?

Thanks for any hints,

Karolina

Karolina
6 Replies 6
Khoros Staff

Hello @karolinalinda,
This is how we are dealing with it in our community:

<#assign images = (liql('SELECT large_href FROM images WHERE messages.id = "${page.context.message.uniqueId}"').data.items) />
<#if images?? && (images?size gt 0) >
<#assign img_url = images[0].large_href />
<#assign lengthOfDomain = page.context.message.webUi.url?index_of("/t5") />
<#assign communityDomain = page.context.message.webUi.url?substring(0,lengthOfDomain) />
<#assign message_img_url = communityDomain + img_url />
<meta property="og:image" content="${message_img_url}" />
<#else>
<meta property="og:image" content="${asset.get("/html/assets/<some default image>")}"/>
</#if>

The above code should be added to the head.ftl file.

Code Explanation: First we are pulling the image from the message body and check if any image exist, then use it otherwise use a default image from assets.

Let me know if that helps or we can connect sometime if you want me to replicate same on your community.

Regards,
Abhishek Gupta

Thank you, Abhishek - we'll test it! 🙂 

Karolina
Expert

hello @AbhishekGu 

We're having the same issue. Can you tell me where is the head.ftl? Is Studio? 

 

Khoros Staff

Hello @stehrani71 
Yes, that's in studio. Exact location is as follows:

Studio > Community Style > Wrapper 

Here choose your community skin and on the right hand side you can see Page Head Bottom Content (head.ftl).


Hi Abhisek,

I tried to implement this script on our staging site, but i get an error:

InvalidReferenceException:The following has evaluated to null or missing:
==> page.context.message  [in template "HeadBottomCustom" at line 5, column 79]

 

Do you have any idea what could go wrong? 

Hello @nbalogh 
Can you update the code with the following:

<#if page.context.message??>
<#assign images = (liql('SELECT large_href FROM images WHERE messages.id = "${page.context.message.uniqueId}"').data.items) />
<#if images?? && (images?size gt 0) >
<#assign img_url = images[0].large_href />
<#assign lengthOfDomain = page.context.message.webUi.url?index_of("/t5") />
<#assign communityDomain = page.context.message.webUi.url?substring(0,lengthOfDomain) />
<#assign message_img_url = communityDomain + img_url />
<meta property="og:image" content="${message_img_url}" />
<#else>
<meta property="og:image" content="${asset.get("/html/assets/<some default image>")}"/>
</#if>
</#if>

Or
you can add the below code for the specfic pages like ForumTopicPage, BlogArticlePage, ForumPageCategoryPage, ViewProfilePage, UserBadgesPage etc. where you have message object so that opengraph code will not execute over non-message page.

<#assign images = (liql('SELECT large_href FROM images WHERE messages.id = "${page.context.message.uniqueId}"').data.items) />
<#if images?? && (images?size gt 0) >
<#assign img_url = images[0].large_href />
<#assign lengthOfDomain = page.context.message.webUi.url?index_of("/t5") />
<#assign communityDomain = page.context.message.webUi.url?substring(0,lengthOfDomain) />
<#assign message_img_url = communityDomain + img_url />
<meta property="og:image" content="${message_img_url}" />
<#else>
<meta property="og:image" content="${asset.get("/html/assets/<some default image>")}"/>
</#if>


Regards,
Abhishek Gupta 

Welcome to the Technology board!

Curious about our platform? Looking to connect on social technology? You've come to the right place!

Are you a Khoros customer? For direct assistance from our Support team, please visit the Support Forum.