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.

General Questions /

General questions about getting started with SilverStripe that don't fit in any of the categories above.

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

Tabs Navigation


Go to End


4 Posts   798 Views

Avatar
Tiaan

Community Member, 4 Posts

4 June 2015 at 6:29pm

Hi Guys, A Question that i cannot really find an answer for is the following:
I am using bootstrap for my website and on my home page i have navigation tabs with 3 tabs filled with content.

So in the admin section yes, i have a page called home page but how do i edit all 3 tabs using the cms?
The tabs have all a title, icon, and description. Anyone up for this challenge?

Just in case you are wondering i am trying to build a conference website the layout will always stay the same just content that will change :)

<ul class="nav nav-tabs nav-justified">
<li class="active"><a href="#first-tab" data-toggle="tab"><i class="icon icon-office-03"></i>Conference</a></li>
<li><a href="#second-tab" data-toggle="tab"><i class="icon icon-faces-users-01"></i>Attendees</a></li>
<li><a href="#last-tab" data-toggle="tab"><i class="icon icon-education-science-18"></i>Conference Venue</a></li>
</ul>

<div id="tab-content-headings" class="tab-content">
<div id="first-tab" class="tab-pane fade in active"></div>
<div id="second-tab" class="tab-pane fade"></div>
<div id="last-tab" class="tab-pane fade"></div>
</div>

Avatar
Pyromanik

Community Member, 419 Posts

5 June 2015 at 9:30am

Edited: 05/06/2015 9:32am

Related DataObject via has_many & GridField on the HomePage

I an reasonably sure that there will be an example in the tutorials (http://docs.silverstripe.org)
If not exactly then something similar that will answer the question.

The only issue is that you can then have more than three tabs. But that's ok, it's up to the content editor not to be silly about it!

Avatar
Tiaan

Community Member, 4 Posts

5 June 2015 at 5:11pm

Hi There, Thanks for the Info, i know that i can add those tabs in the CMS Area and it works perfectly fine for me when adding my list of speakers to the website, but what i am trying to accomplish here is to create tabs on the Front-End like this : http://getbootstrap.com/javascript/#tabs but i want to manage the content of those tabs in the CMS all on one page like lets say : the home page, so the home page is only 1 page on the CMS but i want to fill all three tabs with content from that one page.

See attached for my speakers.

Attached Files
Avatar
Pyromanik

Community Member, 419 Posts

5 June 2015 at 10:36pm

Yes, it's the same thing.
You need to make a 'Tabs' object with Content, etc. and relate it to the HomePage.
Then you can manage them in the same way you manage speakers on the Speakers page.

Otherwise if you don't want to do that you can add 2 more HTMLEditorFields (an db fields to save them into) to the HomePage. It's not a pretty solution, but it will work.
You could even put them on a different tab in the CMS.