Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#1 2011-01-17 04:05:00

MiceofMu
New Member
Registered: 2011-01-17
Posts: 2

Logical Tab Structure in Textpattern

Hello, new user here.

I’m having some trouble wrapping my head around this problem in terms of textpattern structure. I’m trying to populate jquery tab panes with textpattern articles. Here’s the schematic. The following would represent a single page:

- – - – - – - – - – - – - – - – - – - -

Section (a header article)

- Article 1
— tab 1
— tab 2
— tab 3

- Article 2
— tab 1
— tab 2
— tab 3

- Article 3
— tab 1
— tab 2
— tab 3

- – - – - – - – - – - – - – - – - – - -

I’m having trouble figuring out how to associate the tabs to their parent articles. I think it’s the looping that throwing me for a loop.
(My goal is to make the content management as simple as possible for the party taking over the administrative duties).

Thanks.

Offline

#2 2011-01-17 09:35:55

Dragondz
Moderator
From: Algérie
Registered: 2005-06-12
Posts: 1,549
Website GitHub Twitter

Re: Logical Tab Structure in Textpattern

Hi

How jquery hendel the tab? by a wrapping div?

I am not surre i have understund your structure but maybe you can do like this:

Article 1, Article 2 : could be a cetgory, and then tab1, tab 2, … are articles assigned to right category!

Another go could be :

Article 1, Article 2: are article but the body of each article must write :

<div class="tab 1">
bla bla
</div>
<div class="tab 2">
bla bla
</div>
<div calss="tab 3">
blablja lnalnal
</div>

Hope that help.

Offline

#3 2011-01-17 13:17:49

uli
Moderator
From: Cologne
Registered: 2006-08-15
Posts: 4,315

Re: Logical Tab Structure in Textpattern

I’d leave an article an article and do it like that:

p(tab1). some text

p(tab2). some text

p(tab3). some text

That gives three paragraphs with their respective classes. ( Note the empty lines between each paragraph. Couldn’t get Textile to display that like I wanted: in one block. Probably my fault.)

Edit: Sorry, dragondz, that was essentially what you proposed. I just skimmed your post.

Last edited by uli (2011-01-17 13:44:07)


In bad weather I never leave home without wet_plugout, smd_where_used and adi_form_links

Offline

#4 2011-01-17 15:38:25

MiceofMu
New Member
Registered: 2011-01-17
Posts: 2

Re: Logical Tab Structure in Textpattern

Thanks for the answers.

Associating the tabs using categories might be the way to go – mostly because of the extra html around the tabs. The tab content is wrapped in divs, and those divs are wrapped in another div that enables the user to toggle the visibility of the tabs (triggered by a link). Here’s the general structure of the article:

<p>Article body</p>
<p><a href=”#” id=“button1”>More</a>.</p>

<div id=“wrap1”>
<ul class=“tabset”> <li><a href=”#”>Tab 1</a></li> <li><a href=”#”>Tab 2</a></li> <li><a href=”#”>Tab 3</a></li>
</ul>
<div class=“tab”><p>Tab content</p></tab>
<div class=“tab”><p>Tab content</p></tab>
<div class=“tab”><p>Tab content</p></tab>
</div>

Keeping everything in one article would simplify things from my perspective, but the extra markup in the article editor might be daunting to an admin.

Offline

Board footer

Powered by FluxBB