Creating FAQ Page Based on FAQ Content Type

I’m trying to set up a FAQ page in which you would have a list of questions at the top of the page followed by a question/answer portion on the lower half of the same page.

I have a Content Type called FAQ in which there are two allowed snippet templates: SnQuestion, SnAnswer.

The SnQuestion template simply formats the question as:

  #field("displaytitle")

While the SnAnswer template repeats the question and is followed by the answer directly underneath:

  #field("displaytitle")
  #field("body")

My question is, what is the best way to create an anchor from the questions list at the top of the page to the respective question/answer portion on the same page? Are there any code samples for this?

I prefer doing this type of operation with an auto index so that you don’t need to create an entire content type just to display FAQ items (and to reuse the anchor link template for other content item snippets). The drawback to this is the order cannot be specified other than query ordering such as by publish date, alphabetical order, or by a sort order specified on the item.

Either way you could use code like this to display your FAQ items with anchor links:


{html}
	{body}
#set($oldChar = "-1")##
		#initslot($slotname $params)##
		{ul}
		#foreach($result in $sys.currentslot.relresults)##
			#if($result.getNode().primaryNodeType.name == "rx:erauContact")##
				#set($currChar = $result.getNode().getProperty("rx:lastname").String.substring(0,1).toUpperCase())##
			#elseif($result.getNode().primaryNodeType.name == "rx:erauExpertCategory")##
				#set($currChar = $result.getNode().getProperty("rx:displaytitle").String)##
			#else##
				#set($currChar = $result.getNode().getProperty("rx:displaytitle").String.substring(0,1).toUpperCase())##
			#end##
			#if($currChar != $oldChar)#set($oldChar = $currChar){li}{a href="#$currChar"}$currChar{/a}{/li} #end##
		#end##
		{/ul}
		#set($oldChar = "-1")##
		#foreach($result in $sys.currentslot.relresults)##
			#if($result.getNode().primaryNodeType.name == "rx:erauContact")##
				#set($currChar = $result.getNode().getProperty("rx:lastname").String.substring(0,1).toUpperCase())##
			#elseif($result.getNode().primaryNodeType.name == "rx:erauExpertCategory")##
				#set($currChar = $result.getNode().getProperty("rx:displaytitle").String)##
			#else##
				#set($currChar = $result.getNode().getProperty("rx:displaytitle").String.substring(0,1).toUpperCase())##
			#end##
			#if($currChar != $oldChar)#set($oldChar = $currChar)##
				#slot($slotname "{h3}{a name='$currChar'}{/a}$currChar{/h3}{dl}" "" "" "{/dl}" "list='${currChar}%'&max_results=${max_results}&sitepath=${sitepath}&folderpath=${folderpath}")##
			#end
		#end##
{/body}
{/html}


*all opening and closing html symbols replaced with { or } for forum readability.

The code above was taken from an auto index template that is used for multiple content types (you can see the explicit rules for erauContact and erauExpertCategory within if statements) that all provide anchor links to the full snippet item listed under the anchor list. The template would be very similar for a manual slot.

There is no real difference (in the Template code) between an auto-slot and a manual slot.

There is also no reason why you cannot assemble the same slot twice on the FAQ page (once with the questions, and once with the answers). You can use either the content id or the item title to generate the “anchor” in the snippet (so that you can click on the question to jump down to the answer).