Custom Icons for Custom Menu in Mobile App

Custom Icons for Custom Menu in Mobile App

by Arabinda P -
Number of replies: 5

Hi,

I want to add Custom Icons for the Custom Menu items I have added.

But any new Menu Item I add just shows a "ion-link" icon.

For menu-item - "Mail Us" - I want to add icon "ion-android-mail"

For menu-item - "Call Us" - I want to add icon "ion-ios-telephone"

Kindly, guide how can I achieve this?



Regards

Arabinda



Average of ratings: -
In reply to Arabinda P

Re: Custom Icons for Custom Menu in Mobile App

by Juan Leyva -
Picture of Core developers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers

Hi,

could you copy here your Custom Menu Items? Maybe is just a matter of re-ordering the different elements (the icon must be the last element after the language)

Average of ratings: -
In reply to Juan Leyva

Re: Custom Icons for Custom Menu in Mobile App

by Arabinda P - 

Below are my Custom Menu Items. And I want to give different icons for different items. Kindly guide, how to achieve this simply.
1. Buy Full BSE MCQ Test - Shopping Cart Icon 
2. Send Email - Mail icon
3. Call Us - Telephone icon
4. Our office - Location icon
Buy Full BSE MCQ Test| https://www.evidyapith.com/course/view.php?id=4| inappbrowser 
About Us|https://www.evidyapith.com/mod/page/view.php?id=44| inappbrowser
Send Email|mailto:parabindas@outlook.com| browser
Call Us|tel:9967365337| browser
Our Office|geo:40.726966,-74.006076| browser
My grades | https://www.evidyapith.com/grade/report/overview/index.php | embedded | en
How to specify - Ionic Icon - HexCode for each of Custom Items?
Kndly guide

Average of ratings: -
In reply to Arabinda P

Re: Custom Icons for Custom Menu in Mobile App

by Juan Leyva -
Picture of Core developers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers 
My grades | https://www.evidyapith.com/grade/report/overview/index.php | embedded | en | icon
Where icon is any icon from http://ionicons.com/1.5.2/, like, ion-hammer
Average of ratings: Useful (1)
In reply to Juan Leyva

Re: Custom Icons for Custom Menu in Mobile App

by Arabinda P -
Hi Juan,
Thank you, for the help done years ago. That worked.
I currently have Mobile app 4.2.0
However, how do I add custom Menu ITEM - icons to that.
I have below configuration
-----------------------------------

Send Email|mailto:info@dynaperf.com| browser|en|ion-android-mail

Call Us|tel:9967365337| browser|en|ion-call

Message Us|sms:9967365337| browser|en|ion-call

---------------------------------------------------

But the icon is showing blank.

Please guide.

Regards

Arabinda


Average of ratings: -
In reply to Arabinda P

Re: Custom Icons for Custom Menu in Mobile App

by Noel De Martin -
Picture of Core developers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers

Hi there,

In the latest versions of ionic the ion- suffix is not longer used, and there aren't different icons for iOS/Android either. The following should work:

Send Email|mailto:info@dynaperf.com| browser|en|mail
Call Us|tel:9967365337| browser|en|call
Message Us|sms:9967365337| browser|en|call

For more icons, check out the new ionicons website at https://ionic.io/ionicons, as well as font awesome icons https://fontawesome.com/icons.

Although we're not using the latest version either, so when in doubt you can try different versions to make sure you're using the right one.

Average of ratings: -