Forum | Appery.io

I am designing a page with sliding panel menu that I would like to show/hide when user taps on the Menu button in the page header.

I would like to use the standard jquery bars icon for the Menu button (data-icon="bars"), however, it looks like I can't select that icon from the list of available button icons.

This icon comes with jquery css. Can you please advise how can I set this (or another custom icon) for a button?

Thank you.

Hello,

Can you provide code example that you are using?

This is the code that was generated from the UI builder:

code
<!-- Panel -->
<a data-role="button" name="Panel" dsid="Panel" class='ui-btn-left Home_Panel'
id="Home_Panel" data-corners="true" data-icon="grid" data-iconpos="left" x-apple-data-detectors="false"
data-inline='true' data-mini='true' data-theme="a" tabindex="3">
Menu
<&#47;a>
/code

If I try editing the code to set data-icon="bars" then I can see the new icon just fine, but the source gets out of sync with the UI builder so I can no longer use drag and drop.

Add this attribute for Button in More properties option:

That was easy Thank you!

This seems to work okay with the flat-ui theme. However, it does not work with ios7 theme. The space for the icon is there, but you can't see the bars.

Hello! In font set for ios7 theme there is no icon "bars". You would need to edit ios7.css file on Source tab to add this icon.

Can you share the modification I would need to make to the source code to include the bars icon? I reviewed the flat-ui and ios7 .css files and could not find a difference for the bars icon code.

Hello! We reviewed this theme more and looks like there is some problem exactly with this icon. It's reported as a bug and will be fixed. We're going to create tutorial on how to add icons to a theme.

Hello! Please take a look here http://docs.appery.io/documentation/u...