Support » Plugin: Business Directory Plugin - Easy Listing Directories for WordPress » Replace field labels with font awesome icons

  • Resolved trixxmanaty

    (@trixxmanaty)


    Hi BD Support,

    I require assistance replacing the field labels that show in the Excerpt view of a listing with font awesome icons mainly on address and Telephone fields.
    Is it possible to achieve this? I have tried to enter the icon code in the field label but it did not work.

    Thanks.

Viewing 15 replies - 1 through 15 (of 15 total)
  • Plugin Author Business Directory Plugin

    (@businessdirectoryplugin)

    Hi @trixxmanaty,

    Sorry that you ran into issues here!

    So, just to make sure I understand this, you’re entering what precise code into the label part of the field?

    It’s probably not supported, but we DO add FA support in the plugin so if it’s not working, it might be incredibly easy to enable, if I understand how you’re trying to make it work….

    Please let me know.

    Thread Starter trixxmanaty

    (@trixxmanaty)

    Hi @businessdirectoryplugin,

    Thank you for your response. I am trying to add the following icons to the following:
    <i class="fal fa-map-marker-alt"></i> to use in the Address field label
    and <i class="fas fa-phone"></i> to use the Phone Number field.

    Does it work in the field label? Please advise on how I can implement this.

    Thanks.

    Plugin Author Business Directory Plugin

    (@businessdirectoryplugin)

    Thanks for that @trixxmanaty.

    I’ll need to ask my developer who is a bit backed up on support and is doing a release tomorrow, so I hope to hear back soon, but it may be a day or two before he frees up.

    Thread Starter trixxmanaty

    (@trixxmanaty)

    @businessdirectoryplugin , noted. Thanks

    Thread Starter trixxmanaty

    (@trixxmanaty)

    @businessdirectoryplugin,

    Any update regarding this?

    Thanks.

    Plugin Author Business Directory Plugin

    (@businessdirectoryplugin)

    Hi @trixxmanaty,

    Thanks for your patience on this. My developer has had a family emergency this week and is spending some time in the emergency room and hasn’t been available to work on this yet. It’s backed up all of our support and I’m very sorry about that.

    I don’t know precisely when he’ll be available but I’m hoping soon.

    Plugin Author Business Directory Plugin

    (@businessdirectoryplugin)

    Good news @trixxmanaty !

    He replied with this:

    Fee labels doesn’t support HTML, but he can use a BD filter to modify the label to use FA icons:

    add_filter( 'wpbdp_display_field_label', 'maybe_use_fa_form_field_label', 10, 2 );
    
    function maybe_use_fa_form_field_label( $label, $field ) {
        // Customer can find Field_ID under "Directory Admin -> Manage Form Fields".
    
        // For Phone:
        if( {Phone_Field_ID} === $field->get_id() ) {
            return '<i class="fas fa-phone"></i>';
        }
    
        // For Address:
        if( {Address_Field_ID} === $field->get_id() ) {
            return '<i class="fa fa-map-marker-alt"></i>';
        }
    
        return $label; //This line is very important to prevent breaking other labels.
    }

    This snippet can be included as a custom plugin or in theme’s functions.php file, though I recommend to include the custom plugin to prevent losing the functionality on theme change/update. Something like Pluginception to add it permanently.

    Try that and let me know if you run into more issues.

    Thread Starter trixxmanaty

    (@trixxmanaty)

    Hi @businessdirectoryplugin,

    That’s great. Thanks for your assistance. I have entered the snippet in my functions.php file but no changes were made to the field labels.

    Thanks.

    • This reply was modified 3 years, 1 month ago by trixxmanaty.
    Plugin Author Business Directory Plugin

    (@businessdirectoryplugin)

    Hi @trixxmanaty,

    Hmmmm…

    For your field IDs, did you substitute a number for this part?

    if( {Phone_Field_ID} === $field->get_id() ) {

    and

    if( {Address_Field_ID} === $field->get_id() ) {

    {Address_Field_ID} and {Phone_field_id} need to be the numbers of your ACTUAL fields…

    If you didn’t do that, you’d need to change the code there, or it won’t work

    Thread Starter trixxmanaty

    (@trixxmanaty)

    Hi @businessdirectoryplugin,

    Yes, I did as below:

    add_filter( 'wpbdp_display_field_label', 'maybe_use_fa_form_field_label', 10, 6 );
    
    function maybe_use_fa_form_field_label( $label, $field ) {
        // Customer can find Field_ID under "Directory Admin -> Manage Form Fields".
    
        // For Phone:
        if( (6) === $field->get_id() ) {
            return '<i class="fas fa-phone"></i>';
        }
    
        // For Address:
        if( (10) === $field->get_id() ) {
            return '<i class="fa fa-map-marker-alt"></i>';
        }
    
        return $label; //This line is very important to prevent breaking other labels.
    }

    I also tried to replace the FA with an image link and did not work. Please advise on where I am going wrong.

    Thanks.

    Thread Starter trixxmanaty

    (@trixxmanaty)

    Hi @businessdirectoryplugin,

    Just to update that I have cleared the cache. It is now displaying the code <i class="fas fa-phone"></i> for the Phone Number field instead of an icon. No changes on the Address label.

    Thanks.

    Plugin Author Business Directory Plugin

    (@businessdirectoryplugin)

    Hi @trixxmanaty,

    My developer was monitoring this thread and discovered that he was escaping HTML in the label field so that is why it’s not working.

    We have a dev version that fixes this now. Contact us here with a link to this thread to get it: http://businessdirectoryplugin.com/contact/

    Thread Starter trixxmanaty

    (@trixxmanaty)

    Hi @businessdirectoryplugin ,

    Noted. I will contact you now.

    Thanks.

    Thread Starter trixxmanaty

    (@trixxmanaty)

    Hi @businessdirectoryplugin,

    It finally worked now after installing the dev version.
    Many thanks for your assistance.

    Plugin Author Business Directory Plugin

    (@businessdirectoryplugin)

    You’re welcome!

    Please let me know if you have any other questions or issues!

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘Replace field labels with font awesome icons’ is closed to new replies.