How to add Fontawesome Icon to buttons

Hello,

I am wondering how to add Fontawesome icons to specific buttons? I've screenshotted an example and have posted it below. 

If anyone is willing to help, I would greatly appreciate it.

You can follow this guide. Remember to replace FontAwesome phone icon with your desired icon

Hi Tuanphan,

Thank you very much for responding. I've tried following the steps you have suggested, but for some reason I am not seeing anything happen on the site.

13 hours ago, Tim32 said:

Hi Tuanphan,

Thank you very much for responding. I've tried following the steps you have suggested, but for some reason I am not seeing anything happen on the site.

Can you share link to page where you use button?

I believe this link will take you to the page. It's on the homepage, near the footer where we say "Get Involved & Connected" and then have various clickable buttons available. https://saffron-blue-79gn.squarespace.com/

Thank you very much!

On 8/20/2024 at 12:17 AM, Tim32 said:

I believe this link will take you to the page. It's on the homepage, near the footer where we say "Get Involved & Connected" and then have various clickable buttons available. https://saffron-blue-79gn.squarespace.com/

Thank you very much!

The site is private, I can't access it. You can follow this.

Hey Tuanphan,

My apologies. It is now password protected. The password is Bobjoe123

On 8/29/2024 at 9:21 PM, Tim32 said:

Hey Tuanphan,

My apologies. It is now password protected. The password is Bobjoe123

Thank you. You mean add icons to these buttons?

Yes, exactly. Thank you very much!

 You can follow step #1 in this guide

Next, use CSS code like this

div#block-96df7317e462ddcc6c73 a:before {
    content: "\f095";
    font-family: "Font Awesome 6 Free";
    font-weight: bold;
    font-size: 16px;
}

div#...73 is button block ID. Follow this to find ID

\f095 is icon ID, you can access FontAwesome site, click on a FREE icon > Find this