Editing details icons for guests, amenities, views…

[Georgian B]

Hello,

Right now, I’m only seeing bullet points instead of icons. How can I edit this part so that I can have a different icon for each detail?

I’m using Divi in case that matters.

Thank you in advance!

[Andre Flores]

Hello there,

Looks like font awesome styles are not fetched, perhaps they are overwritten by global Divi styles for lists, make sure to check them. If the issue persist, provide me the URL to the website in question, so I take a closer look at it.

Regards,
Andre

[Georgian B]

Hi Andre,

I’ve installed the font awesome plugin as I saw on the Divi website I should do, but that didn’t change anything, even though I ran the conflict scanner as well.

Wasn’t able to identify the global Divi styles for lists, maybe you can help me out with it.

Here’s the link: https://urbio.ro/accommodation/studio-cu-balcon/

If you see other things I might be missing and it isn’t much hassle for you to let me know, I’d appreciate any feedback!

Thank you in advance!

[J. Davis]

Hi,

Thanks for your reply. You may apply custom CSS styles to add Font Awesome icons to the details items. For example:

.mphb-single-room-type-attributes li, .mphb-loop-room-type-attributes li {
  list-style: none;
}

.mphb-single-room-type-attributes li:before, .mphb-loop-room-type-attributes li:before{
  font-family:"FontAwesome";
  font-weight:900;
  margin-right:10px;
  display:inline-block;
  width:35px;
  margin:auto;
}

.mphb-room-type-total-capacity:before, .mphb-room-type-adults-capacity:before{
  content:"\f007";
}

.mphb-room-type-children-capacity:before{
  content:"\f1ae";
}

.mphb-room-type-facilities:before{
  content:"\f0f4";
}

.mphb-room-type-size:before{
content:"\f31e";
}

.mphb-room-type-bed-type:before{
content:"\f236";
}

.mphb-attribute-title{
  display:none;
}

best regards,
J. Davis

[Georgian B]

Thank you, J!

Unfortunately it’s not working. I’m just seeing squares after the bullet points.

[Georgian B]

Update: it works on the apartment page, but in the search I get what I mentioned above.

[J. Davis]

Hi Georgian,

Thanks for your reply. I’ve updated the styles in my previous reply. Please try to use it instead of those you have added previously.

best regards,
J. Davis

[Georgian B]

This is perfect now! Thanks so much!

[J. Davis]

Hi Georgian,

You are welcome. It would help us if you review the Hotel Booking plugin here https://motopress.com/products/hotel-booking/#edd-reviews-respond

Do not hesitate to contact us if you have any further questions.

best regards,
J. Davis

[Anton Uhlig]

I am using Elementor and i don’t know how to add the Icons. If i Add the Amenities, i can’t see the Icons on the Preview PAge. How Can i add them?

[J. Davis]

Hi, You can try the CSS code from one of the replies above on the current topic.

[Author]

Posts