In reviewing the Responsive T3 template quickstart I've run into some confusion about creating tabbed content. Your clarifications and recommendations would be appreciated.

1. Assigning modules with the "zentabs" module style to the same grid position will load those modules in tabs. I get this one and am using it successfully.
2. In the Responsive quickstart, there is the grid position defined as "tabs" in which the quickstart instantiates the tabs "Our Services" and "Recent Work". In looking at those two modules, it is not clear to me how they are being styled as tabs. (eg. the Module Style for each is set to inherited rather than zentabs). Is the "tabs" grid position unique in the template in that it always displays modules as tabs in that grid position?
3. In the Responsive quickstart "Tabbed module styles" article, {loadposition tabs} is used to load the modules "This is the first tab" and "Another tab". But I'm confused here... these two modules have their positions set to "belowcontent" yet are mysteriously loaded with {loadposition tabs}. I'd expect that the modules actually loaded would be "Our Services" and "Recent Work" as those are assigned to the "tabs" position but this is not the case. In general I'd expect that if I created some modules using the zentabs module style, assigned them to some user defined position such as "mytabs" then used {loadposition mytabs} in an article, the modules would load as tabs in the article at the loadposition location. I have not had success with this.
4. The ZenKit documentation also describes another method for creating tabbed content using a "tabbed template". I haven't tried this... think I'm confused as to ZenKit vs ZenTools so don't know how to proceed here.
5. In going through the JB documentation at one point, I swore that I saw yet another way of creating tabs that was different than those describe above. I did go back and try and find this reference in the JB documentation but was unable to locate it... so I could be wrong, but I thought I'd mention it anyway.

I guess the main issue here is, given these different methods for creating tabbed content, which method is the most appropriate for:

1. Creating tabbed content inside an article (I'm assuming method 3 above but am confused on how this is supposed to work, so would like some recommendations)
2. Creating tabbed content in a module that loads articles into tabs. (I'm using method 1 above in conjunction with the Articles Anywhere extension to do that now. Is there a better way to do this?)
3. Creating tabbed content in a module that loads category content in various layouts. I'm again assuming method 1 using ZenTools to create the different layouts (Grid etc.) but I guess I'm confused as to how method 4 plays into this using ZenKit (of if I even need to use it at all.)

Lastly... with any/all of these methods how might I include an image in a tab along with the tab title? (ex. an icon to the left of the tab text).

Thanks
Mark

Hi Mark,

Quite a lot here to go through

Icon wise - install jbtype and add an icon from this list
www.joomlabamboo.com/joomla-extensions/jb-type-joomla-typography-plugin

syntax wise for this follow this as an example

{ jb_icon-beer}Our Services{ /jb_icon-beer}

Please not you don't need the space I added that so you could see the code

Regarding other documentation - I think there is some confusion regarding different template frameworks - sorry about this

e.g. the tabs for the responsive zgf framework was a template option to change and the tab titles were found there inside the template admin

There will be lots of references in the forum to the zgf2 framework tab configuration

With the T3 framework this is not the same as you dsecribe in point 1

Zenkit is a k2 template used to organise k2 content that we offer to members

if you check out the moments template and the zenkit options you will see there are a few

www.joomlabamboo.com/joomla-templates/moments

For the zenkit demo site example please take a look at this page

zenkit.joomlabamboo.com/zenkit-layouts/tabs

and for docs here

zenkit.joomlabamboo.com/zenkit-help/item/438-introduction-to-zenkit

With this bit

"Creating tabbed content in a module that loads articles into tabs. (I'm using method 1 above in conjunction with the Articles Anywhere extension to do that now. Is there a better way to do this?)"

Do you mean you are looking to load a module in a module - if so then this is a great solution

- an alternative might be to try a zentools filtered grid in template tab position although not strictly tabs it might well work for you - this uses categories as filters

www.bambootheme.com/showcase/apr13/zentools/filter

or more simply load a zentools grid of articles per tab using the template tab position

Right - this is where it may get a bit tricky

"Assigning modules with the "zentabs" module style to the same grid position will load those modules in tabs. I get this one and am using it successfully."

This is an option for J3 templates and only and works across different J3 templates but not any J2.5 versions

You can find more info in various templates about the available options for this feature - a good example is here

www.bambootheme.com/showcase/apr13/module-overview/module-chrome

With this bit -

"In the Responsive quickstart, there is the grid position defined as "tabs" in which the quickstart instantiates the tabs "Our Services" and "Recent Work". In looking at those two modules, it is not clear to me how they are being styled as tabs. (eg. the Module Style for each is set to inherited rather than zentabs). Is the "tabs" grid position unique in the template in that it always displays modules as tabs in that grid position?"

There is a template position in the template occupies a full 12 grids so is the full width of the template



Different modules published here will be dropped in to this position
So styling for this position will be pulled from template / bootstrap css

In the Responsive quickstart "Tabbed module styles" article, {loadposition tabs} is used to load the modules "This is the first tab" and "Another tab".

But I'm confused here... these two modules have their positions set to "belowcontent" yet are mysteriously loaded with {loadposition tabs}.

"I'd expect that the modules actually loaded would be "Our Services" and "Recent Work" as those are assigned to the "tabs" position but this is not the case."

I think this is a mistake on our part and is about to rectified with the next release - initially we removed the tabs position entirely and its a left over from that but now we re-added it this is incorrect

On the next release the positions are belowcontent for this





"In general I'd expect that if I created some modules using the zentabs module style, assigned them to some user defined position such as "mytabs" then used {loadposition mytabs} in an article, the modules would load as tabs in the article at the loadposition location. I have not had success with this."

Yes I would expect this to work - can you load the module without the zentabs - just so we can rule any issues related to loadposition

Cheers
Paul

Thanks for the detailed response Paul. I'll work through this and post my results when I have them.

Yes we did cover quite a bit

Let me know what I missed

Cheers
Paul

Hi Paul.
I created a test case at dev.femvitale.com/index.php/about/experiences and attached two image files that show how loadposition is working with Module Style set to both zentabs and inherited.

In this example using zentabs I created an article called Experiences with some intro text followed by {loadposition tabs-experiences}. I then created two custom HTML modules with zentabs Module Style, Experience 1 and Experience 2 and assigned then to the tabs-experiences position. As you can see, the tabs do not combine on a single row but are instead displayed sequentially along with the custom module content.

Please advise.
Thanks
Mark

Thanks for the feedback

I can reproduce this error myself on the responsive template but not on the others I tested

I'll dig a bit deeper

Cheers
Paul

Hi Mark,

Can you create a ticket so we can take a close look

Thanks
Paul

Done. Thanks Paul.

thanks

Paul