Accordions title - line break?

hi there,
is there a way to insert a line break like < b r > (had to write it like this…) into the accordions title?
thanks a lot! kai

Hi There,

Thank you for writing in! Regretfully we can not insert a <br> tag or any tag on the Classic Accordion title. This is possible with the V2 Accordion element, though we can not provide an ETA on when is the release.

Cheers!

hi friech, thanks for your reply.
is there maybe some creative workaround for a line break? with css or so?
and if not: could i become a beta tester for the new accordion element? right now?
if all this does not work i will have to look for an alternative an redo my work…
thanks a lot, kai

Hi There,

Unfortunately, there is not available opportunity to be a beta tester of Accordion V2 right now.

There is a work-around using CSS Pseudo selectors.

You can add a class to each accordion item like I added to the first one title-1

And add the following CSS to Cornerstone CSS multiple times, always adjusting the class title-1 to the respective title and the content for what you want. Once you add the following CSS to Cornerstone CSS you will understand better.

.x-accordion-group.title-1 .x-accordion-heading.x-accordion-heading:before {
  content: "Hello";
  display: block;
  font-size: 100% !important;
  color: black;
  text-decoration: none;
  background-color: #e9e9e9;
  padding-left: 15px;
  margin-bottom: -15px;
  }

Hope it helps!

hi joao, thanks so much!
i am not sure if i did it right but the “Hello” text does appear in the header of my accordion but still is just one lone line. the br-tag is being plainly displayed. as before.
your css is supposed to make a line-break within the header possible. right? if so, where to put the br?
thanks again! kai

Hi Kai,

Hello will be in one line just no line breaks allowed.

But you can use the normal accordion item title as your second line.

Hope that makes sense.

hi joao css-wizard!
that worked now. fantastic.
the line heights on small screens (when there are 3 or 4 lines of text instead of now 2) are not perfect yet but i will leave it like this for now.
i really look forward to accordion v2! could you please add me to the beta tester pool?
i think you lost a lot of valuable time working on that templatemanager exclusively for many month now! i for one don’t need it. i know. but i really would like a bugfree pro and useful stuff like all elements going v2.
thanks again! kai

Hi Kai

Thanks for the feedback

I have no ETA to provide you regarding the Accordion V2 , but one thing I can ensure, every second we have been developing the new versions of X and PRO are worthed, the new versions will be a blast! :slight_smile:

I am also a web designer and I started my relationship with Themeco as just a client, today beside having the pleasure to work with these great people I am still an user of Themeco Products (ONLY! - Really believe they are way above others :slight_smile: ) But coming back to the point, new stuff that is coming up is amazing, I am sure you will love it :slight_smile:

Stay tuned!

hi joao,
thanks for your kind reply!
i just read the change log of the new x and cornerstone.
i find an accordion v2 element there mentioned.
is that the one you where referring to 6 days ago not knowing the eta???
i have not installed anything yet and will wait a few rounds of bug fixed before doing so.
but i sure would love to use the accordion v2. is that possible now? as of today?
i spend a long long time customizing my v1 accordion and hope this won’t get broken by the update. what do you think?
thanks a lot! kai

Hi Kai,

Yes that is what my colleague is referring to.

Adding a line break to accrodion title is possible now with accordion v2

Thanks

hi paul,
thanks a lot!
he must have known that is was only days before the release. i would have waited gladly!!!
can i somehow only add that element to my existing installation without upgrading (and potentially breaking) my current installation?
thanks a lot! kai

Hi Kai,

No, that wouldn’t be possible, you will need to perform the theme and cornerstone update.

Hope it helps

hi joao, thanks for the info!
and once i have installed the new x version i can not go back - right?
so they way would be to restore the whole site from a backup - right?
thanks again, kai

Hi Kai,

Yes, that is correct or you can duplicate your site to a staging server and do the updating there first. That way you can test the new version and keep your live site intact.

No we don’t, we know that an update is coming because we are testing the beta versions, but we don’t have any idea on when is the exact release date.

Kai if you can’t update to the latest version yet, let’s use the CSS solution provided by Joao above, It works but its kind of tedious.

The code is not to make the <br> tag work on the title, but put to the second line of title as a CSS.

To understand what I’m saying, please create a draft page or a test page, add Accordion element to it. Add a CLASS acdn-item1 to the first item of the accordion (keep in mind not to the accordion, but to the accordion item).

Then add this to Page CSS or Theme Options > CSS

.acdn-item1 .x-accordion-heading a:after {
  content: "This is the second line";
  display: block;
  font-size: 100% !important;
  color: black;
  text-decoration: none;
  padding-left: 15px;
}

You’ll see how that works, and you’ll understand why it is kind of tedious because you need to do that for every accordion items.

Hope that shed some lights,
Cheers!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.