This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Tagged: 

Style Accordion Icons

  • Creator
    Topic
  • #25168
    kennethfeldman
    Participant

    Hi Jason,

    Any way to modify the accordion shortcode?

    Would love to have different icons than the PLUS/MINUS icons.

    Such as [accordion closed_icon=”star” open_icon=”star2″]

    Or, maybe a quick CSS way instead?

    🙂

Viewing 2 replies - 1 through 2 (of 2 total)
  • Author
    Replies
  • #25176
    Jason Bobich
    Keymaster

    Hi Kenneth,

    Yes, you’d just do it with CSS. FontAwesome works by assigning a specific unicode character through the content property. So, you’d just target the icons being used and change the unicode value to the corresponding FontAwesome icon you want. You figure this out by browsing the icons on the FontAwesome website, where they tell you the unicode values.

    For example:

    .tb-toggle .fa-plus-circle:before {
      content: "\f196"; /* plus-square-o */
    }
    .tb-toggle .fa-minus-circle:before {
      content: "\f147"; /* minus-square-o */
    }

    http://fortawesome.github.io/Font-Awesome/icon/plus-square-o/

    http://fortawesome.github.io/Font-Awesome/icon/minus-square-o/

    #25179
    kennethfeldman
    Participant

    That’s (font) Awesome!

    A splash of color and we’re golden!

    Thank you!

Viewing 2 replies - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.