Mura CMS : Example of how to create a Frequently Asked Questions (FAQ) area/section with Mura CMS and Bootstrap3 markup.

config.xml.cfm

<!--
	1) Drop this in your theme /{SiteID}/includes/themes/{Theme}/config.xml.cfm
-->
<theme>

	<extensions>
		<extension type="Folder" subType="FAQ" availableSubTypes="Page/Question" iconClass="icon-question-sign">
		</extension>
		<extension type="Page" subType="Question" iconClass="icon-question" hasSummary="0" hasBody="0" hasAssocFile="0">
		</extension>
	</extensions>

</theme>

dsp_Folder_FAQ.cfm

<cfsilent><cfscript>
/*
  Example of how to create a Frequently Asked Questions (FAQ) section/area

  1) Create a class extension called 'Folder / FAQ'
  2) Copy the code below and paste it into /{SiteID}/includes/themes/{Theme}/display_objects/custom/extensions/dsp_Folder_FAQ.cfm
  3) Add kids and voila!
  
*/

// The Iterator
	variables.iterator = variables.$.content().getKidsIterator().setNextN(variables.$.content('nextN')).setPage(1);

// Start :: Pagination Variables
	variables.currentNextNIndex=1;
	variables.maxPortalItems = IsNumeric(variables.$.globalConfig('maxPortalItems'))
		? variables.$.globalConfig('maxPortalItems')
		: 100;

	if ( variables.$.event('startRow') > variables.iterator.recordcount() ) {
		variables.$.event('startRow', 1);
	}

	if ( !Len(variables.$.event('nextNID')) || variables.$.event('nextNID') == variables.$.content('contentID') ) {

		if ( variables.$.content('NextN') > 1 ) {
			variables.currentNextNIndex = variables.$.event('startRow');
			variables.iterator.setStartRow(variables.$.event('startRow'));
		} else {
			variables.currentNextNIndex = variables.$.event('pageNum');
			variables.iterator.setPage(variables.$.event('pageNum'));
		}

	}

	variables.nextN = variables.$.getBean('utility').getNextN(
		variables.iterator.getQuery()
		, variables.$.content('nextN')
		, variables.currentNextNIndex
	);

// @END :: Pagination Variables
</cfscript></cfsilent>
<cfoutput>

	<!--- Content / Body --->
	#$.setDynamicContent($.content('body'))#

	<!--- FAQs --->
	<cfif variables.iterator.hasNext()>
		<div class="panel-group" id="accordion">
			<cfloop condition="variables.iterator.hasNext()">
				<cfset item = variables.iterator.next() />
				<div class="panel panel-default">
					<div class="panel-heading">
						<h4 class="panel-title">
							<a data-toggle="collapse" data-parent="##accordion" href="##collapse#variables.iterator.currentIndex()#">
								#HTMLEditFormat(item.getTitle())#
							</a>
						</h4>
					</div>
					<div id="collapse#variables.iterator.currentIndex()#" class="panel-collapse collapse">
						<div class="panel-body">
							#$.setDynamicContent(item.getBody())#
						</div>
					</div>
				</div>
			</cfloop>
		</div>
	</cfif>

	<!--- Pagination Output --->
	<cfif variables.nextn.numberofpages gt 1>
		#variables.$.dspObject_Include(thefile='dsp_nextN.cfm')#
	</cfif>	
</cfoutput>

Thanks Steve! Will definitely be using this in the future!

Awesome! I've been working on a new site with an FAQ section; I'm going to be using this for that!

FYI, I've updated it to account for pagination ;)

Sweet! I have many layouts for this now, but really cool to see how you built pagination into it! I'd love to show you some of the ways i've done mine if you're interested.

@stevewithington -- Is is possible to get the config.xml.cfm docs updated to include iconClass? Might be useful for others.

I've been trying to implement your code. However, I can't seem to get it to work. I've taken all the steps, but the collapse isn't showing. I can see the questions in the menu as a dropdown however. The steps I've taken:

• add code to config.xml.cfm
• created class extension
• created the folder display_objects/custom/extensions/ (it didn't exist yet)
• created the file dsp_Folder_FAQ.cfm in that folder
• created a page in Mura called FAQ
• created children pages with type 'Page / Question'

Can you help me with this? Many thanks in advance!

Marcel