Change Featured Icon?

azzaya

How do I change the featured icon to a flame to represent hot deal? The current 'heart' icon is confusing because it will make users think they can favorite a property. Which file do I modify to change the icon? I have a list of ION ICONS but don't know which file I can edit this in.

Thanks,
Nader

Ninja

azzaya

Hi
On Property Page the icon is from css change
Here is code you can override

.com_jamegafilter .product-item .product-item-details .thumb:after {
    content: "\f443";
    display: inline-block;
    font-family: "Ionicons";}

Change the icon code with another Ionicons code.

azzaya

Ninja Hi Pankaj. Which part of the code am I changing exactly? I'm a little confused (sorry). Can you give me a example of changing it? Just so I can see which part of the code I'm supposed to change.

Thanks,
Nader

Ninja

azzaya
Hi
You need to change this code

  content: "\f443";

if you are looking to change it from articles category module owl or grid layout view.
Its defined in the PHP file as i shared in other thread for for rent sale topic.

azzaya

Ninja I added the CSS to custom.css file but it is not changing. Do I need to add/change in a different CSS file?

Thanks,
Nader

Ninja

azzaya
Hi
Can you share the URL on which you want to change it as there are 2 different place where it show.
Via css you have to change the icon code to show a different icon from Ionicons icons package.
The code is shared is for heart icon .

azzaya

Ninja Hi Pankaj, I'm trying to change it in the module on the homepage here: https://www.tulipmgmt.com/index.php and also want it to appear under the Properties page (grid) page https://www.tulipmgmt.com/index.php/properties/properties-grid#sort=position&sortdir=desc. Anywhere the featured icon appears in the template.

The icon i'm trying to change it to is

Am I looking in the right place for the list of icons? I got it from here: https://ionic.io/ionicons/v2/cheatsheet.html

Thanks,
Nader

Ninja

azzaya
Hi
On the Home page module it coming from code

<i class="icon ion-ios-heart"></i>

File path : "/html/mod_articles_category/grid.php" in template "ja_property".
and owl.php

The supported version of fonts icon are version 4.4.7

azzaya

Ninja Hi Pankaj, I modified the custom css to include the updated code (to match the icon I want), then went into the grid file and modified the class and added the iconicon name and I still get a white rectangular box. I know you said version 4.4.7 but I don't see how I would know which version icon I am using. Am I doing this correctly? Can you provide a link to a page of icons I can choose from? I don't know if I'm just implementing incorrectly or I'm just using an incorrect version.

For now, I put everything back to ion-icon-heart until I hear back.

Thanks!
Nader

Ninja

azzaya
Hi
You can change the icon code with anything

<i class="icon ion-ios-heart"></i>

from font awesome icon as well.
Kindly do a try first or replace it with your image icon code

Update : FTP is not working. You can give me working FTP and icon code I Will replace it for you.

azzaya

Ninja Hi Pankaj, the FTP username and password I provided is correct. I just double-checked and accessed my files via File Zilla using that same username and password. I will add cPanel info in the box and the host IP.

I did change both Grid/Owl php files and also updated the custom css.

Grid PHP

Owl PHP

custom css file

Result

Thanks,
Nader

Ninja

azzaya
Hi
Use this code

<i class="icon ion-ios-flame"></i>

It will work fine.

azzaya

Ninja Thank you! It worked 🙂

Nader

Ninja

azzaya
You are welcome!