Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We've moved the forum!

Please use forum.silverstripe.org for any new questions (announcement).
The forum archive will stick around, but will be read only.

You can also use our Slack channel or StackOverflow to ask for help.
Check out our community overview for more options to contribute.

Themes /

Discuss SilverStripe Themes.

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba

Twitter bootstrap accordion not working


Go to End


3 Posts   8741 Views

Avatar
MarkusM

Community Member, 11 Posts

24 April 2013 at 9:27am

I want to add a Twitter Bootstrap accordion to my SilverStripe-website. I am using SS 3.0.5 on Ubuntu and the Twitter Bootstrap theme from http://www.silverstripe.org/twitter-bootstrap-theme/. What I did was:

I added the following two lines at the top of my template (.ss) file:

<% require javascript(themes/aep-bootstrap/js/bootstrap.js) %>
<% require javascript(themes/aep-bootstrap/js/bootstrap-collapse.js) %>
Then I added a new "row-fluid" and copied the sample code from http://twitter.github.io/bootstrap/javascript.html#collapse inside it:

<div class="row-fluid">
<div class="accordion" id="accordion2">
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
Collapsible Group Item #1
</a>
</div>
<div id="collapseOne" class="accordion-body collapse in">
<div class="accordion-inner">
Anim pariatur cliche...
</div>
</div>
</div>
</div>
</div>
The result is that the text displays in my site, but it is not collapsible. I guess the probem is that the javascript can not be found, but the reference to it is correct and AFAIK the standard way to include javascript in SS templates.

Avatar
MarkusM

Community Member, 11 Posts

26 April 2013 at 10:40am

Edited: 03/07/2013 10:33am

[replying myself]

I added

<script src="$ThemeDir/js/bootstrap-collapse.js"></script>

to the end of my document and then it worked.

Avatar
Mattes

Community Member, 1 Post

26 June 2013 at 9:53pm

Danke!