How to render an Episerver ContentArea as an Accordion (using Bootstrap 2.x)

AccordionContentArea.cshtml

@using EPiServer.Core
@using EPiServer.Editor
@using EPiServer.Web.Mvc.Html
@model EPiServer.Core.ContentArea

@* Note! Put this file in /Shared/DisplayTemplates/ to make it available as a template *@

@{
    var idAccordion = Guid.NewGuid().ToString("N");
    var first = true;
}

<div class="accordion" id="@idAccordion">
    @foreach (ContentAreaItem item in Model.Items)
    {
        var content = item.GetContent();
        var accordionGroupId = Guid.NewGuid().ToString("N");
        <div class="accordion-group">
            <div class="accordion-heading">
                <a class="accordion-toggle" data-toggle="collapse" data-parent="#@idAccordion" href="#@accordionGroupId">
                    @content.Name
                </a>
            </div>
            <div id="@accordionGroupId" class="accordion-body collapse @(first || PageEditing.PageIsInEditMode ?"in":"")">
                <div class="accordion-inner">
                    @{
                        Html.RenderContentData(item.GetContent(), true);
                    }

                </div>
            </div>
        </div>
        first = false;
    } 
</div>

Index.cshtml

@model PageViewModel<StandardPage>

...

@* Use this in your Page Template to render a ContentArea with your custom template *@

@Html.PropertyFor(x => x.CurrentPage.MainContentArea, "AccordionContentArea")

StandardPage.cs

using EPiServer.Core;
using EPiServer.DataAbstraction;
using EPiServer.DataAnnotations;
using System.ComponentModel.DataAnnotations;

namespace AlloyDemo.Models.Pages
{
    ... 
    
    public class StandardPage : SitePageData
    {
        ...
        
        // Or add the UIHint attribute to your property to change the default template so
        // you do not have to name the template every time you render it

        [Display(
            GroupName = SystemTabNames.Content,
            Order = 320)]
        [UIHint("AccordionContentArea")]
        public virtual ContentArea MainContentArea { get; set; }
    }
}