# How to attach font awsome to codepen nav?

**URL:** <https://forum.pinegrow.com/t/how-to-attach-font-awsome-to-codepen-nav/4501>\
**Category:** Beginners\
**Created:** [September 4, 2020, 8:00pm UTC](https://forum.pinegrow.com/t/how-to-attach-font-awsome-to-codepen-nav/4501 "2020-09-04T20:00:49Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [September 4, 2020, 8:00pm UTC](https://forum.pinegrow.com/t/how-to-attach-font-awsome-to-codepen-nav/4501/1 "2020-09-04T20:00:49Z")

</div>

I rewatched the codepen nav tutorial. It worked in PG except when I added font awesome. First I tried activating the PG font awesome 4, then 5 and attached to my page.

When those didn’t work I deactivated them, "open url: and added the Codepen link awesome 2 link. That didn’t do anything either.  
Suggestions please.

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [September 4, 2020, 9:30pm UTC](https://forum.pinegrow.com/t/how-to-attach-font-awsome-to-codepen-nav/4501/2 "2020-09-04T21:30:55Z")

</div>

Not sure @kat - I went back to check through the tutorial and everything seems okay. So none of the icons are showing at all? Can you take a screenshot of your page code or the tree?  
Bob

---

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [September 4, 2020, 10:11pm UTC](https://forum.pinegrow.com/t/how-to-attach-font-awsome-to-codepen-nav/4501/3 "2020-09-04T22:11:08Z")

</div>

Html code is at the bottom. I suspect font is not attaching properly.

 ![Screen Shot 2020-09-04 at 3.07.57 PM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/1/189db0f85aacbb39480bbaeeb0344d055ffef325.png) ![Screen Shot 2020-09-04 at 3.05.14 PM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/0/001da7a633d5899af1f5ea00bdbe47881a803723.png) ![Screen Shot 2020-09-04 at 3.04.21 PM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/8/82ab3449d83cdda0cb2bd5f4c2bba03d7a9a6bd8.png) ![Screen Shot 2020-09-04 at 2.57.31 PM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/2/2c7940af58b1d7c00deb8d4074aaa162933b8416.png) `\<!doctype html\>

 Foundation | Welcome 

- home 
- about 
- Audio 
- Portfolio 
- video 

 `

---

<div class="post-metadata">

**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\
**Post date:** [September 5, 2020, 2:20am UTC](https://forum.pinegrow.com/t/how-to-attach-font-awsome-to-codepen-nav/4501/4 "2020-09-05T02:20:59Z")

</div>

Fixed it. I had to open copepen as a new project then start from there. Evidently adding it as a top level page along with other foundation pages confused font-awesome.

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [September 5, 2020, 11:51am UTC](https://forum.pinegrow.com/t/how-to-attach-font-awsome-to-codepen-nav/4501/5 "2020-09-05T11:51:00Z")

</div>

Wow, that was weird. Glad you worked it out.