Development version of Tabs & Accordions for...

Search
Other Pre-Sale questions
Forum

Development version of Tabs & Accordions for Joomla 4

Joachim Kroener's Avatar Joachim Kroener
Hello,

I know that the tabs for Joomla 4 will not appear until late 2022.

Unfortunately we have a customer who wants to switch to Joomla 4 right now and we are on it. There, unfortunately, we often use the tabs.

Would there already be an alpha or beta version that I can use? It would be really important.

Thanks for the feedback
Peter van Westen's Avatar Peter van Westen ADMIN
No, I unfortunately don`t have anything ready for you.
Please post a rating at the Joomla! Extensions Directory
dev Solidaires Finances Publiques's Avatar dev Solidaires Finances Publiques
Hi, is there some wip on it?

Regards

A happy subscriber since years to this very nice extension
Peter van Westen's Avatar Peter van Westen ADMIN
No, not yet. Don't expect anything before December.
Please post a rating at the Joomla! Extensions Directory
Dan Brockway's Avatar Dan Brockway
One more person waiting to upgrade for two-level sliders (Tabs & Accordions).
Peter van Westen's Avatar Peter van Westen ADMIN
TL;DR
There is an early alpha version of Tabs & Accordions available for testing here:
regularlabs.com/development-releases

But didn't you say...
Yes, I said not to expect anything before December, but...

I started some development on Tabs & Accordions at the beginning of this year.
But I ran into some issues so I shelved it. I also 'had' to move on to converting other extensions that had more priority.
Last week I finished an early alpha of Content Templater for Joomla 4. And the time came to start looking into Tabs & Accordions again.
I expected to pretty much start off from scratch. But I left the development early this year in a way more advanced state than I remembered.
So these last few days I have been fixing the most major issues to get it to a working state.

What about backward compatibility with Tabs and Sliders?
Tabs & Accordions is not a conversion of Tabs and Sliders to Joomla 4.

It is a completely new extension built from the ground up.

You can still use the main {tab} syntax to create tab sets. But many of the extra attributes will be different or work differently.

Also the HTML output is completely different than Tabs and Sliders for Joomla 3.
So any CSS stylesheets/overrides for Tabs/Sliders will not work on 'Tabs & Accordions' for Joomla 4.

So does it work?
Well, it is an early alpha. The main functionalities should all work. But there are some settings and features that still need fixing and implementing.

So what's new/different?
Like I said, it is a completely new extension.

Syntax
By default, you can create Tab sets with the {tab} tags.
These will automatically convert to Accordion sets on narrow screens. You can set the breakpoint between narrow and wide screens in the settings (default is set to max 575 for narrow screens).

You can create Accordion sets with the {accordion} tags (it will also handle {slider} tags).
These will remain as Accordion sets on all screen widths and will not change to Tabs sets.

Themes
Tabs & Accordions comes with a bunch of different themes.
I don't have the documentation ready yet. So I can't link to a showcase of these themes yet. But here are some screenshots:


Scroll Navigation
By default, when the Tab handles don't fit in the width of the page, they will now be scrollable.
Hovering over the start or end of the row of tabs, will show arrows. Hovering over these will start scrolling the tabs from left/right to reveal the other tabs. Clicking on it will scroll very fast to the beginning/end of the tabs row.

Other stuff
These things also work (or should):
dynamic-heights="true"
Setting this attribute on the first tab, will make the inactive tabs smaller/lower to make the distinction clearer (can be useful on some of the Themes).

open="true"
This will set a specific tab/accordion as the initial active one.

open="false"
Set this on the first tab/accordion to have no active one on initial page load. (Yes, now also works on tabs).

justify="left|right|center"
Set this attribute with one of the values on the first tab to make the tab handles align left/right/center.

color-panels="true|false"
To override the global setting, which can make the panels the same color as the tab handles.


Not working yet
- I still need to make the editor button.
- The page scrolling options don't work yet.
- It is not yet possible to have the URL get the active tab as a hash value (like: my-url#my-active-tab)
- Currently the page will always remember active tab when refreshing the page. The option to switch that off doesn't work yet.
- Slideshow option (automatically switch to next tab via timeout) does not work yet.
- I still need to deal with the Free vs Pro stuff. Currently pretty much everything that should be Pro only is also working in the Free version.

And probably 1001 more things that need implementing or fixing.

Where can I download it? I am too lazy to scroll up!
You can download it from the Development Versions page:
regularlabs.com/development-releases
Please post a rating at the Joomla! Extensions Directory
jerry jensen's Avatar jerry jensen
I'd like to test this, but can't find the download at regularlabs.com/development-releases
Peter van Westen's Avatar Peter van Westen ADMIN
Sorry, should be there now...
Please post a rating at the Joomla! Extensions Directory
dev Solidaires Finances Publiques's Avatar dev Solidaires Finances Publiques
Thanks a lot for that.

We're using access levels (tags : access or usergroup), it seems not to be functional (I Know it's a pro feature in tabs).

I see in Sets.php an empty function (removeByAccess)...this one misses?
Peter van Westen's Avatar Peter van Westen ADMIN
Yeah, that should work in the pro version.

The access to the Pro versions of the extensions is controlled by the subscriptions.
But nobody can have a subscription to that yet. So for now I'll just give direct access to the pro version here:
regularlabs.com/TabsAccordions-v0.1.0-dev-PRO.zip

When the time comes I'll make sure that everybody with a Tabs or Sliders subscription will also get access to the Tabs & Accordions Pro versions.
Probably by sending a coupon code to get 100% off on the first year.

People with a bundle subscription already have full access.
Please post a rating at the Joomla! Extensions Directory
dev Solidaires Finances Publiques's Avatar dev Solidaires Finances Publiques
Great ! It's functional 😉

Just a point for other testers, it seems that it needs 1 save for plugin to update params, if you installed free version before (needs an array somewhere).

Thanks a lot, again !
Peter van Westen's Avatar Peter van Westen ADMIN
Just a point for other testers, it seems that it needs 1 save for plugin to update params, if you installed free version before (needs an array somewhere).
Not sure what you mean. WHat needs an array? What doesn't work before saving the plugin settings?
Please post a rating at the Joomla! Extensions Directory
dev Solidaires Finances Publiques's Avatar dev Solidaires Finances Publiques
This message :
errorerror - Uncaught Throwable of type TypeError thrown with message "implode(): Argument #2 ($array) must be of type ?array, string given". Stack trace: #0 [ROOT]/plugins/system/tabsaccordions/src/Document.php(43): implode(',', 'fade,slide') #1 [ROOT]/plugins/system/tabsaccordions/tabsaccordions.php(60): RegularLabs\Plugin\System\TabsAccordions\Document::loadStylesAndScripts('
    onAfterDispatch() #4 [ROOT]/libraries/vendor/joomla/event/src/Dispatcher.php(486): Joomla\CMS\Plugin\CMSPlugin->Joomla\CMS\Plugin\{closure}(Object(Joomla\Event\Event)) #5 [ROOT]/libraries/src/Application/EventAware.php(107): Joomla\Event\Dispatcher->dispatch('onAfterDispatch', Object(Joomla\Event\Event)) #6 [ROOT]/libraries/src/Application/SiteApplication.php(205): Joomla\CMS\Application\WebApplication->triggerEvent('onAfterDispatch') #7 [ROOT]/libraries/src/Application/SiteApplication.php(241): Joomla\CMS\Application\SiteApplication->dispatch() #8 [ROOT]/libraries/src/Application/CMSApplication.php(294): Joomla\CMS\Application\SiteApplication->doExecute() #9 [ROOT]/includes/app.php(61): Joomla\CMS\Application\CMSApplication->execute() #10 [ROOT]/index.php(32): require_once('/home/....') #11 {main}
Just save plugin params without change anything, it's OK.
Peter van Westen's Avatar Peter van Westen ADMIN
Should be fixed now in latest dev.
Please post a rating at the Joomla! Extensions Directory
dev Solidaires Finances Publiques's Avatar dev Solidaires Finances Publiques
Yes, fixed, thanks a lot !
Peter van Westen's Avatar Peter van Westen ADMIN
Something I sent to Dan via email, but also applies to the rest of the peeps wanting to help test:
Can you try out the different themes? And see how they look for both the tabs and accordions.
You can override the default theme by simply adding theme="Name of Theme" in the first tab/accordion tag. Like:
{tab theme="Pills Colorful" ...}
With a number of them you can only see a difference if you also use the colors. Give a tab/accordion a color with:
{tab color="..." ...}
Supported colors are: red, orange, yellow, green, teal, blue, purple, pink, grey, black

Let me know which theme you think should be set as default. Currently, I chose "Neutral" as the default.
Also let me know if you think the names are confusing or not. Or if you have better ideas...
Please post a rating at the Joomla! Extensions Directory
Liam Hanks's Avatar Liam Hanks
Hi Peter,
Just a general question - is this thread the best place to send bugs/anomolies when testing, or is there another place we should submit them?

Thanks
Peter van Westen's Avatar Peter van Westen ADMIN
You can do that here.
Please post a rating at the Joomla! Extensions Directory
dev Solidaires Finances Publiques's Avatar dev Solidaires Finances Publiques
Hi Peter,

Ok for us to neutral theme as default, but top-lines is better to understand all the sexy things IMHO 😉

About color : it seems that the option "color panels" is not yet active (or something is wrong for us?).

And last but not least, is it possible to have the tag "class" functional again? Some of our previous content take advantage of that previous feature, we would have to scan db to clean up, rather than adjusting our custom css.

Regards,
Peter van Westen's Avatar Peter van Westen ADMIN
The colors will not be added via class names, as this caused conflicts with some other templates and extensions.
Simply having a class="red" could cause all sorts of unwanted CSS applied, if something else also styles that classname.
So Tabs & Accordions doesn't use any class names to do its basic styling and scafolding. It is all done via data attributes.

You will still be able to add a class, but it is down to your custom CSS on how you deal with those classes.
it seems that the option "color panels" is not yet active
This should work now with latest dev.
regularlabs.com/TabsAccordions-v0.1.0-dev-PRO.zip

You should be able to add this to the first tab/accordion tag too, to overrule the default setting:
color-panels="true"

This option only has an effect on these themes:
- Neutral
- Colorful
- Dark
- Light
- Minimal

With the lines and pills, it makes no sense to color the panels.
Please post a rating at the Joomla! Extensions Directory
You can only post on this forum if you log in