I want to add a Custom field in the "Knowledge Article - Portal View".

Gooty Haindhavi
Kilo Contributor

When I am creating and publishing an article, On the portal I am able to see body, But my requirement is: I need to add one more additional field on portal (Its a cutom field not OOB).

6 REPLIES 6

Vamsi Sreenivas
Giga Guru

Hi @Gooty Haindhavi ,

 

Did you checked the following articles from ServiceNow:

https://support.servicenow.com/kb?id=kb_article_view&sysparm_article=KB0724351

https://support.servicenow.com/kb?id=kb_article_view&sysparm_article=KB0955875

 

Mark my answer as HELPFUL / CORRECT if this help resolve your issue.

Regards,

Vamsi S

No Vamsi, Unable to understand whee I have add the code line with the resource you provided..

The script we have is:

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
    <g2:evaluate>
        var contentClass = 'snc-article-content-text ';
        if(knowledgeRecord.article_type == 'wiki')
            contentClass += 'knowledge-wiki-text';
        else
            contentClass += 'row';
        
        var articleContent = kbViewModel.getArticleViewData();
    </g2:evaluate>
    
    <j2:if test="$[!articleContent.isTemplate]">
        <article id="article" class="$[contentClass]">
            <g2:no_escape>$[NS:articleContent.data]</g2:no_escape>
        </article>
    </j2:if>
    <j2:if test="$[articleContent.isTemplate]">
        <article id="article" class="$[contentClass]">
            <j2:forEach items="$[articleContent.data]" var="jvar_field">
                <section class="kb-article-field" style="$[jvar_field.field_style]">
                    <j2:if test="$[jvar_field.collapsible]">
                        <header class="collapsible-title" tabindex="0" onclick="toggleSection('$[jvar_field.column]')">
                            <h3 style="$[jvar_field.heading_style]" tabindex="-1">$[jvar_field.label]</h3>
                            <j2:if test="$[jvar_field.collapsed]">
                                <i class="icon-chevron-up rotate down" tabindex="-1"/>
                            </j2:if>
                            <j2:if test="$[!jvar_field.collapsed]">
                                <i class="icon-chevron-up rotate" tabindex="-1"/>
                            </j2:if>
                        </header>
                    </j2:if>
                    <j2:if test="$[!jvar_field.collapsible]">
                        <h3 style="$[jvar_field.heading_style]">$[jvar_field.label]</h3>
                    </j2:if>
                    <j2:if test="$[jvar_field.type == 'html']">
                        <j2:if test="$[jvar_field.collapsed]">
                            <section id="$[jvar_field.column]" style="display:none;">
                                <g2:no_escape>$[NS:jvar_field.content]</g2:no_escape>
                            </section>
                        </j2:if>
                        <j2:if test="$[!jvar_field.collapsed]">
                            <section id="$[jvar_field.column]">
                                <g2:no_escape>$[NS:jvar_field.content]</g2:no_escape>
                            </section>
                        </j2:if>
                    </j2:if>
                    <j2:if test="$[jvar_field.type != 'html']">
                        <j2:if test="$[jvar_field.collapsed]">
                            <p id="$[jvar_field.column]" style="display:none;">
                                <span>$[NS:jvar_field.content]</span>
                            </p>
                        </j2:if>
                        <j2:if test="$[!jvar_field.collapsed]">
                            <p id="$[jvar_field.column]">
                                <span>$[NS:jvar_field.content]</span>
                            </p>
                        </j2:if>
                    </j2:if>
                </section>
            </j2:forEach>
        </article>
    </j2:if>
    
    <j2:if test="$[readOnlyPage]">
        <script>
            $j(".snc-article-content-text").find("a").attr("target","_blank");
        </script>
    </j2:if>
    
</j:jelly>

@Gooty Haindhavi , you have to place your custom field within div tags. You can place at the top or bottom as you want. Below example I placed it at bottom so it displays after 'Article Body'.

Note replace u_custom_content with your custom field name.

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
    <g2:evaluate>
        var contentClass = 'snc-article-content-text ';
        if(knowledgeRecord.article_type == 'wiki')
            contentClass += 'knowledge-wiki-text';
        else
            contentClass += 'row';
        
        var articleContent = kbViewModel.getArticleViewData();
    </g2:evaluate>
    
    <j2:if test="$[!articleContent.isTemplate]">
        <article id="article" class="$[contentClass]">
            <g2:no_escape>$[NS:articleContent.data]</g2:no_escape>
        </article>
    </j2:if>
    <j2:if test="$[articleContent.isTemplate]">
        <article id="article" class="$[contentClass]">
            <j2:forEach items="$[articleContent.data]" var="jvar_field">
                <section class="kb-article-field" style="$[jvar_field.field_style]">
                    <j2:if test="$[jvar_field.collapsible]">
                        <header class="collapsible-title" tabindex="0" onclick="toggleSection('$[jvar_field.column]')">
                            <h3 style="$[jvar_field.heading_style]" tabindex="-1">$[jvar_field.label]</h3>
                            <j2:if test="$[jvar_field.collapsed]">
                                <i class="icon-chevron-up rotate down" tabindex="-1"/>
                            </j2:if>
                            <j2:if test="$[!jvar_field.collapsed]">
                                <i class="icon-chevron-up rotate" tabindex="-1"/>
                            </j2:if>
                        </header>
                    </j2:if>
                    <j2:if test="$[!jvar_field.collapsible]">
                        <h3 style="$[jvar_field.heading_style]">$[jvar_field.label]</h3>
                    </j2:if>
                    <j2:if test="$[jvar_field.type == 'html']">
                        <j2:if test="$[jvar_field.collapsed]">
                            <section id="$[jvar_field.column]" style="display:none;">
                                <g2:no_escape>$[NS:jvar_field.content]</g2:no_escape>
                            </section>
                        </j2:if>
                        <j2:if test="$[!jvar_field.collapsed]">
                            <section id="$[jvar_field.column]">
                                <g2:no_escape>$[NS:jvar_field.content]</g2:no_escape>
                            </section>
                        </j2:if>
                    </j2:if>
                    <j2:if test="$[jvar_field.type != 'html']">
                        <j2:if test="$[jvar_field.collapsed]">
                            <p id="$[jvar_field.column]" style="display:none;">
                                <span>$[NS:jvar_field.content]</span>
                            </p>
                        </j2:if>
                        <j2:if test="$[!jvar_field.collapsed]">
                            <p id="$[jvar_field.column]">
                                <span>$[NS:jvar_field.content]</span>
                            </p>
                        </j2:if>
                    </j2:if>
                </section>
            </j2:forEach>
        </article>
    </j2:if>
    
    <j2:if test="$[readOnlyPage]">
        <script>
            $j(".snc-article-content-text").find("a").attr("target","_blank");
        </script>
    </j2:if>
    
<div>
    $[NS:knowledgeRecord.u_custom_content]
</div>
</j:jelly>

 

Regards,

Vamsi S

Gooty Haindhavi
Kilo Contributor

@Vamsi Sreenivas I will try your suggestion once, Thanks for taking time 🙂