• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Font Awesome Kit vs CDN call

Enthusiast ,
Apr 05, 2024 Apr 05, 2024

Copy link to clipboard

Copied

The website reads to put this in the head (with our JS id).

<script src="https://kit.fontawesome.com/xxxxxxxxxx.js" crossorigin="anonymous"></script>

 

I am trying to get the rounded Facebook icon to render and it does not - still displays the square. How do I know that kit above is actually interacting with this code?

 

 

<div class="footer_social_icons">
        {% module_block module "social_icons" path="@hubspot/rich_text", label='Social Icons' %}
        {% module_attribute "html" %}
        <p>
          <a href="#" target="_blank"><i class="fab faCompany fa-linkedin" aria-hidden="true"></i></a>
          <a href="#" target="_blank"><i class="fab faCompany fa-facebook" aria-hidden="true"></i></a>
        </p>
        {% end_module_attribute %}
        {% end_module_block %}
      </div>
    </div>

 

faCompany calls for font-family: FontAwesome;

I have this:

.fab {font-family: "Font Awesome 5 Brands";}

 

I could swap out that JS with this <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"> but was curious to try the kit out.

So, what am I missing? This is the one I'd like:

https://fontawesome.com/icons/facebook?f=brands&s=solid

TOPICS
Code

Views

169

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 05, 2024 Apr 05, 2024

Copy link to clipboard

Copied

LATEST

I switched to FREE Bootstrap Icons. Contains 2,000 open source icons.

 

I posted a quick tutorial on how to deploy them below.

https://community.adobe.com/t5/dreamweaver-discussions/bootstrap-icons-use-with-or-without-bootstrap...

 

Bootstrap Icons Reference

https://icons.getbootstrap.com/

 

Facebook Icon

https://icons.getbootstrap.com/icons/facebook/

<i class="bi bi-facebook"></i>

 

Hope that helps.

 

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines