Facebook-Link in Personal Portfolio not working

Hi there!

I am currently working on the personal portfolio-challenge and I’m having issues with my contact-links. I want to put a link in the footer to my facebook page but when I click on it, it just says “blocked page”.

Here’s my code:

<section id="contact">
      <h5>Let's work together!</h5>
      
      <div class="contact-buttons">
        <a href="https://www.facebook.com/swaynindie" target="_blank" id="profile-link">Facebook</a>
        <a href="#" target="_blank">Twitter</a>
        <a href="#" target="_blank">YouTube</a>
        <a href="#" target="_blank">Twitch</a>
        <a href="#" target="_blank">Discord</a>
        <a href="mailto:sarah@sabu-media.de">Send a mail!</a>
      </div>
    </section>

I have a feeling that this is an facebook issue rather than a coding issue but I’m hoping you guys can help me either way.
Thank you!
Sarah

Your code looks OK. This might be an issue with the firewall/your network blocking facebook or you dev environment blocking opening links.
Can you access facebook normally in a new tab? Also, are you writing your code locally or on codepen/some other platform?

Thanks for your reply!

I checked my firewall etc. and it seems like there’s nothing blocking the site.

The weird thing is, that, when I open the Facebook Link of the Personal-Portfolio-Example from FreeCodeCamp, then that link works!
And yes, I can also open facebook normally when opening a new tab.

I’m writing the code on codepen - could that cause the problem?

That’s weird indeed. It still should run fine on codepen unless opening a new link from codepen is treated as popup that is blocked by your browser or a browser extension.

If you share the link to your codepen I an test on my side to see if I get the same probem.

Here’s my codepen-page:
https://codepen.io/Mauzzz/pen/QWKOXmB

The Facebook-Link is in the footer.
Thanks so much!

Yeah I got the same blocked error you got. But after a little digging I figured out that if you misspell the facebook username in a fb AND that misspelled username doesn’t exist it gives you that page. (I tried with my fb link misspelled and got same page)

So simply make sure you facebook link is correct!

I got it working!

This is how:
I remembered that I also have a facebook-link on my current webpage, which I didn’t code myself, but with a website-builder. There I checked, how my FB-Link is displayed. Like this: https://www.facebook.com/profile.php?id=100008489926026
So quite different from what I’ve put in Codepen. And this format works!

I’m still confused why the fb-link of the FreeCodeCamp-Example-Page works but maybe FB is just weird! :wink:

@Banhawy I thank you so much for digging into this and trying to help me! It’s greatly appreciated! :slight_smile: