How to enable threaded comments?

[calebmt]

From my understanding, we should be able to enable threaded comments on forum discussions, right? Currently, all comments to any post are all left aligned. I'd like to show replies to each comment as threaded (or indented). Is that possible? If so, can someone give me some guidance? 

[Nava_Schneider]

@ClaudiusH thank you, these are great examples. 🙂

[calebmt]

Thanks for the info, @ClaudiusH!I will see if our developer can wrap his head around this. 

[calebmt]

Very helpful, @VarunGrazitti! I'll see what we can do to implement something similar. 

[calebmt]

@silia, please take a look at the resources on this thread. Thanks! 

[calebmt]

@mitchellworks, now I'd like you to look at this. Thanks! 

[marthasimons]

I've been having the exact same issue with comments so thank you for bringing this up. I'll be waiting for more effective solutions to it and hope that the situation will get better with time.

[TysonN]

Here's how Lithium Professional Services typically deals with indented replies:

1. Add a component named "forums.widget.message-view-two@override" in Studio with the following code:

<#assign exemptPages = ["ReplyPage","PostPage","EditPage"] />
<#if !exemptPages?seq_contains(page.name)>
    <#assign msg = env.context.component.getParameter("message") />
    <#if (msg.uid)?has_content>
        <#if (msg.parent)?has_content>
            <#if (msg.parent.parent)?has_content>
                <#if (msg.parent.parent.parent)?has_content>
                    <#assign msgDepth = 3 />
                <#else>
                    <#assign msgDepth = 2 />
                </#if>
            <#else>
                <#assign msgDepth = 1 />
            </#if>
        <#else>
            <#assign msgDepth = 0 />
        </#if>
    </#if>
    <div class="<#if msgDepth?number gt 0>custom-reply custom-reply-indent custom-reply-indent-${msgDepth}</#if>">
        <@delegate/>
    </div>
<#else>
    <@delegate />
</#if>

2. Add these styles:

.custom-reply {
    padding-left: 0;
    &.custom-reply-indent-2 {
      padding-left: 30px;
    }
    &.custom-reply-indent-3 {
        padding-left: 60px;
    }
}
.lia-component-solution-list {
    .custom-reply-indent-2,
    .custom-reply-indent-3 {
        padding-left: 0;
    }
}

Hope this helps!

[RhysD]

Hey @TysonN, 

I have a customer asking who is curious of this work around in the code. Right now, there is multiple customer requests about having threaded discussions being part of the out of the box product. There question is two fold:

1. Is the code correct (still)?
2. Does it impact past discussions or only post-implementation?

Let me know when you can please and thank you! 

[TysonN]

1. I believe so, yes.  Khoros Services is still using variants of this code in many communities.

2. It will apply to all discussions.  It's an override of the out-of-the-box component which handles rendering for each message within the ForumTopicPage thread.

[Toby]

Thanks @RhysD and @TysonN -

Tyson - have you ever implemented and do you have any screenshots you can share please?

If this is a true threading solution, I would love to implement. Where does this code get added - I am sure the majority of Lithium customers would like to implement.

Thank you,
Toby