[V 9.0.1] How to style accordion in elemental theme or create a template

Developing with Concrete
1

We’re in the process of building a new site in v.9 with the Clonamental theme. When inserting an accordion block, it shows the accordion title in a button, - clicking on the button opens the text as expected. The classic Bootrap view with arrow is not available.

I found that editing the title with the cursor is not possible and in the Ckeditor you cannot use the styles defined in pagetheme.

How can I use my own template for the accordion block?
View.php is from the core and contains classes in Sass, Bootstrap 5.

It seems, that there’s no code for bootstrap 3, therefore the accordion block cannot be used for elemental theme.

Is that so, or am I missing something?

Screen Shot 2021-12-08 at 12.04.43
Screen Shot 2021-12-08 at 12.04.43825×326 37.6 KB

2

Cloneamental is not v9 ready.

3

It also occurs on the built-in theme Elemental.

I did a clean v 9.0.1 install with the Elemental Theme (emty site).

4

You will need to create a custom template for the core accordion block. See Creating a Template File
Creating Additional Custom View Templates

5

Thank you JohntheFish for helping.
I have tried that already. But for some reason my template doesn’t work. I have a view.css and view.ph in my theme folder /mytheme/blocks/accordion/templates/myaccordion/
I guess that correctly translating all _variables from Bootstrap 5 Sass into BS3 LESS is a difficult task since there’s no accordion class in BS3.
I simply want to use the accordion block for the built in Elemental theme. Why is it sooo difficult to achieve? I thought using a CMS-proprietary block would work.

6

You also need the the controller in that folder to help with the overide. You need to change the line in the controller mapping to this folder.

7

Test out your template first in:
/application/blocks/accordion/templates/myaccordion/view.php
/application/blocks/accordion/templates/myaccordion/view.css

That way you know the template works and when you move it into your theme anything that doesn’t work is a result of the theme configuration and not a bug in the template.

There is a bug in 9.0.1 about block template .css loading - you may need to apply the patch from GitHub - see other forum threads on this.

8

The process @JohntheFish describes makes absolut sense. Adding a controller is probably also the right way, so is patching the core. All this to make a block work?

We can’t make it work properly and we don’t have time to tinker around for days just to make a core block in a «production ready» CMS work.

I guess we have to wait a couple months until v.9 matures.

9

An alternative approach would be to use my Magic Tabs - concrete5 to create accordions.

The default Magic Tabs template tries harder to adapt to your theme. Magic Tabs also provides a bit more flexibility within the block edit dialogue for choice of icons etc.

However, the main advantage is Magic Tabs is not limited in the kind of content you can put into a tab or accordion.

You may still have issues with the v9.0.1 block template bug and need to apply the core patch from github. I expect v9.0.2 will be released soon with the core system for assigning block templates fixed.