Skip to Content Skip to Menu

🎃 Happy Halloween! Treat yourself with an awesome discount on memberships! Get 20% off now with code SPOOKY-2024!

Change menu icon to cog in collapsed (phone view)

  • davisJ
  • davisJ
  • OFFLINE
  • Posts: 51
  • Thanks: 0
  • Karma: 0
8 years 11 months ago #272990 by davisJ
My users will mainly be using the profile in phone (collapsed) mode.

Currently there are 2 different 3 bar icons on the profile, for clarity I want the top one to be a cog - ie. change settings.

What's the easiest way to change the icon to this?

Please Log in or Create an account to join the conversation.

  • krileon
  • krileon
  • ONLINE
  • Posts: 48466
  • Thanks: 8280
  • Karma: 1443
8 years 11 months ago #273025 by krileon
They're both basically menus. The top one being a cog for settings won't make much sense with menu items like report user, send private message, etc.. under them. At any rate the only way to change it without modifying core code is with CSS. Right click and inspect element in Chrome or Firefox on the bar menu to see its CSS classes (shrink your browser window for it to go mobile display).


Kyle (Krileon)
Community Builder Team Member
Before posting on forums: Read FAQ thoroughly + Read our Documentation + Search the forums
CB links: Documentation - Localization - CB Quickstart - CB Paid Subscriptions - Add-Ons - Forge
--
If you are a Professional, Developer, or CB Paid Subscriptions subscriber and have a support issue please always post in your respective support forums for best results!
--
If I've missed your support post with a delay of 3 days or greater and are a Professional, Developer, or CBSubs subscriber please send me a private message with your thread and will reply when possible!
--
Please note I am available Monday - Friday from 8:00 AM CST to 4:00 PM CST. I am away on weekends (Saturday and Sunday) and if I've missed your post on or before a weekend after business hours please wait for the next following business day (Monday) and will get to your issue as soon as possible, thank you.
--
My role here is to provide guidance and assistance. I cannot provide custom code for each custom requirement. Please do not inquire me about custom development.

Please Log in or Create an account to join the conversation.

  • davisJ
  • davisJ
  • OFFLINE
  • Posts: 51
  • Thanks: 0
  • Karma: 0
8 years 11 months ago #273071 by davisJ
Hi Krileon,

Thanks for your help. I hear what you say, they're both menus, but the bottom one is more for vieing different tabs and the top is for editing (and/or other actions). At the moment, it doesn't make sense to have two identical icons - this is just confusing for the user so different icons makes more sense.

I realise that it's a CSS issue, but being a relatively newbie coder, I don't know what classes are available and/or how to change the icon to a cog. I thought it was a Bootstrap thing but the classes don't seem to match what I found on the net. Can you help me with the Css/code required to change the icon to a cog?

Cheers,

Dave

Please Log in or Create an account to join the conversation.

  • krileon
  • krileon
  • ONLINE
  • Posts: 48466
  • Thanks: 8280
  • Karma: 1443
8 years 11 months ago #273129 by krileon
The below should do what you're wanting.

Code:
#cb_tabid_17 .icon-bar { display: none; } #cb_tabid_17 .cbMenuNavBarToggle:after { font-family: FontAwesome; content: "\f013"; }

You can use a CB template override plugin to add your CSS to CB or add it to your Joomla template CSS file.

www.joomlapolis.com/forum/6-news-and-publicity/227459-cb-203-template-css-overrides


Kyle (Krileon)
Community Builder Team Member
Before posting on forums: Read FAQ thoroughly + Read our Documentation + Search the forums
CB links: Documentation - Localization - CB Quickstart - CB Paid Subscriptions - Add-Ons - Forge
--
If you are a Professional, Developer, or CB Paid Subscriptions subscriber and have a support issue please always post in your respective support forums for best results!
--
If I've missed your support post with a delay of 3 days or greater and are a Professional, Developer, or CBSubs subscriber please send me a private message with your thread and will reply when possible!
--
Please note I am available Monday - Friday from 8:00 AM CST to 4:00 PM CST. I am away on weekends (Saturday and Sunday) and if I've missed your post on or before a weekend after business hours please wait for the next following business day (Monday) and will get to your issue as soon as possible, thank you.
--
My role here is to provide guidance and assistance. I cannot provide custom code for each custom requirement. Please do not inquire me about custom development.
The following user(s) said Thank You: davisJ

Please Log in or Create an account to join the conversation.

Moderators: beatnantkrileon
Powered by Kunena Forum