The best way to implement frequently asked questions on a SharePoint site

Question

What is the best or common way to implement a frequently asked questions page in a SharePoint collection?

Answer 1

What we did in the past:

• Create your own list
• Rename the title column to the question
• Add a new column of type Multi-Line Text and name it Answer
• Change the default view to display only those 2 columns and set the style in Newsletter

You end up with something like:

You can then place this on the page using the listview webpage.

Update: I wrote this on my blog with an example of SharePoint 2010: http://thechriskent.com/2012/03/09/simple-sharepoint-faq-in-5-minutes/

Answer 2

It is recommended that you use the solution while retaining frequently asked questions in a SharePoint list. It consists of:

• customizable question list template with content type with questions and answers .
• FAQ List View for rendering as Accordion

Figure 1. List of frequently asked questions with an accordion view (SharePoint 2013)

Figure 2. List of frequently asked questions with an accordion view (SharePoint 2010)

Implementation

1 Create your own content type for entries in the FAQ

<ContentType ID="0x0100fb1027dc96a44bf280f6cb823a8da5ae" Name="FAQ" Group="SE" Description="FAQ Content Type" Inherits="TRUE" Version="0"> <FieldRefs> <FieldRef Name="LinkTitle" ID="{82642ec8-ef9b-478f-acf9-31f7d45fbc31}" DisplayName="Question" Sealed="TRUE"/> <FieldRef Name="LinkTitleNoMenu" ID="{bc91a437-52e7-49e1-8c4e-4698904b2b6d}" DisplayName="Question" Sealed="TRUE"/> <FieldRef Name="Title" ID="{fa564e0f-0c70-4ab9-b863-0177e6ddd247}" DisplayName="Question" Sealed="TRUE"/> <FieldRef ID="{b0747420-54bc-41b2-a1b3-8432f2dbdc70}" Name="Answer"/> </FieldRefs> </ContentType> 

2 Create a client-side visualization in the frequently asked questions list (for SharePoint 2013)

 (function () { loadCss('http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.10/themes/redmond/jquery-ui.css'); function OnAccordionViewPostRender(renderCtx) { jQuery(function() { jQuery( "#accordionFAQ" ).accordion(); }); } function loadCss(url){ var link = document.createElement('link'); link.href = url; link.rel = 'stylesheet'; document.getElementsByTagName('head')[0].appendChild(link); } function OnAccordionViewPreRender(renderCtx) { } function RenderAccordionViewBodyTemplate(renderCtx) { var listData = renderCtx.ListData; if (renderCtx.Templates.Body == '') { return RenderViewTemplate(renderCtx); } var accordionHtml =''; accordionHtml = '<div id="accordionFAQ">'; for (var idx in listData.Row) { var listItem = listData.Row[idx]; accordionHtml += '<h3>'; accordionHtml += listItem.Title; accordionHtml += '</h3>'; accordionHtml += '<div>'; accordionHtml += listItem.Answer; accordionHtml += '</div>'; } accordionHtml += '</div>'; return accordionHtml; } function _registerAccordionViewTemplate() { var accordionViewContext = {}; //accordionViewContext.BaseViewID = 'Accordion'; accordionViewContext.Templates = {}; accordionViewContext.Templates.View = RenderAccordionViewBodyTemplate; accordionViewContext.OnPreRender = OnAccordionViewPreRender; accordionViewContext.OnPostRender = OnAccordionViewPostRender; SPClientTemplates.TemplateManager.RegisterTemplateOverrides(accordionViewContext); } ExecuteOrDelayUntilScriptLoaded(_registerAccordionViewTemplate, 'clienttemplates.js'); })(); 

3 Apply the client-side rendering template to the existing view through JSLink

For more information about creating a list of frequently asked questions, see the following posts:

• Customize list view rendering in SharePoint 2010: Display list items in Accordion
• Customize list view rendering in SharePoint 2013: display list items in Accordion

Answer 3

Another possible solution is to use the "Preview Window Style" parameter to get a list of questions in the left column, and mousing over to display the (selected) fields.

I have a Q with long answers, so I think that in some situations this can improve (until it can harmonize at a separate recording level or in a specific field).