Upfront Accordian - Closed all by defult ? then click to expand? + CSS changes

Hi,
Im using one of the Upfront Themes and the Accordian element.

Is it possible to have all the tabs closed by defult so that all the user sees is the titles. Then when they click the tab/title it expands to open/close. - http://take.ms/bQGLK

Additionally is it possible to enclose the title area with a coloured background when selected? so by defult they are white background with black text but when selected it changes to a dark blue background with white text. (Title area only. The content area remains as white background in both cases)

Additionally on this page - http://tinyurl.com/pn2866b
When i try make any changes to the size of the titles (currently in dotted line boxes) they dont seem to take any effect? changes include Size / Bold / Centred.

Support access is ACTIVE until September 8, 2015 12:02 am
Thanks

Tom

  • Tyler Postle

    Hey Tom,

    Hope you're doing well today!

    Is it possible to have all the tabs closed by defult so that all the user sees is the titles. Then when they click the tab/title it expands to open/close. - http://take.ms/bQGLK

    Additionally is it possible to enclose the title area with a coloured background when selected?

    These two won't be possible without more advanced custom coding. I can flag one of our SLS staff to have a look at it; however, I can't guarantee that we will be able to provide a snippet to change this behaviour. They will need to assess whats needed first :slight_smile:

    Keep in mind SLS deals with more advanced issues too so they may take a little longer to reply back.

    Additionally on this page - http://tinyurl.com/pn2866b
    When i try make any changes to the size of the titles (currently in dotted line boxes) they dont seem to take any effect? changes include Size / Bold / Centred.

    You can add the following CSS to change the text inside the dotted border :slight_smile: you can change the values as needed.

    .page-id-579 div.plaintxt_padding {
        text-align: center;
        font-weight: bold;
        font-size: 24px;
        color: #000;
    }

    You can add that into the custom CSS styles field from the Upfront Editor Theme options. As seen in my screenshot.

    Hope that helps Tom!

    Cheers,
    Tyler

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.