Sliding Bar Icon

[♥Jaylin]

#470554

How do I change the sliding bar icon instead of a “+” to possible a text or a font awesome icon?

[pifoux]

#483283

Hi,

change .fusion-sb-toggle::after

Marco

[pifoux]

#483287

An example to change default icon (+) by a vertical text:

.fusion-sb-toggle::after {
content: 'G \A L \A O \A S \A S \A A \A I \A R \A E' !important;
color: black !important;
font-family: Arial, Helvetica, sans-serif !important;
font-size: 14px !important;
}

.fusion-sliding-bar-position-right.fusion-sliding-bar-toggle-rectangle .fusion-sb-toggle {
    height: 180px !important;
}

.fusion-sliding-bar-toggle-rectangle .fusion-sb-toggle:hover {
    background-color: #f19020 !important;
}

[hirsts]

#486062

Thanks for this post, it was also what I was looking for.

Is there a way to have text rotated -90 degrees so it bottom to top on its side ?

Thanks

[forthartley]

#547173

Hi!

Please can you help me, i tried this css but nothing happens. I need button to say Book Now instead of the circle plus icon. Would be much appreciated.

[MrFord2]

#584647

pifoux, thanks for that elegant solution. I have a question, if I’d like to change the text with an icon instead, how would I do that instead?

Thanks

[DBuckwald]

#619918

This is what I did to replace with a calendar icon
.fusion-sb-toggle::after {
content: ‘\f073’ !important;
font-family: FontAwesome !important;
}

.fusion-sb-toggle {
font-family: “FontAwesome” !important;
font-weight: 900 !important;
}

You can find the code for each icon here: https://fontawesome.com/icons?d=gallery&q=cal and just replace f073 with the icon that you want to use.

[DBuckwald]

#632171

I also realized this did not work on all pages however when I installed Better Font Awesome plugin it worked everywhere.

[Zuuse]

#634189

Hi, were these changes made in the actual .css file, or can they be made in the ‘additional css’ section? (It’s not working for me)

[Zuuse]

#634199

Never mind. I just worked out that the above code doesn’t work if the icon is in the main menu.

[stephtripot]

#672555

Hi,
I hade the same problem but I juste found out:
When you copy/paste the code from this page, quotes (“_” and ‘_’) are uncorrect.
Try to rewriter the quotes with your keyboard.

[sorry for my bad english]

[pmagony]

#706852

Is it possible to just create a main menu link that triggers the sidebar, rather than having to alter the existing icon?

[goannawebsites]

#731549

is there any update on the last question…is it possible to create a main menu item that trigger the sliding bar rather than having the “+” icon?

[Steebin]

#736171

Im looking for this option as well

[keithroby]

#752250

I’m also looking for this option!

[Author]

Posts