Can anyone help me!

How to find our project image source to set it in to the personal portfolio project .
Thank you.

I think this may be what you’re looking for @nabila. Codepen creates large and small screen shots of your pens that can be used in your portfolio. Access them from;
https://codepen.io/userName/pen/slug/image/large.png (for the large screenshot)
or
https://codepen.io/userName/pen/slug/image/small.png (for the small screenshot)

  • where you replace userName with your codepen userId and slug with the id of one of your codepen pens and then copy that link into your portfolio
3 Likes

I’m not the OP, but thanks, I didn’t know how to do this, and I thought you had to have a pro account to get screenshots. Can I somehow remove the test suite box from the screenshot? Or should I just fork my pen without the test suite, and make a screenshot of that?

You can comment out the test script and then take the screenshot following the steps. Once you have your screenshot, go back to your pen and uncomment the test script.

1 Like

Can you explain this for me please?

Where can a i find my id of my codepen pens?

ok, so the example I gave was to use something like this;
https://codepen.io/userName/pen/slug/image/large.png
where you replace userName with your codepen userId and slug with the id of one of your codepen pens and then copy that link into your portfolio

Here’s your tribute page project from codepen;
https://codepen.io/Nabila95/pen/rNxeoBa
so your userName is Nabila95 and the slug is rNxeoBa

1 Like

Thank you so much for the help.
one more thing i could not understand how to remove test suite (You can comment out the test script and then take the screenshot following the steps. Once you have your screenshot, go back to your pen and uncomment the test script.) from screenshot.

Recall how to comment out HTML?
It’s this <!-- to start a comment and this --> to end a comment.

Using your tribute page again you would do;

<!-- <script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script> -->
<!DOCTYPE html>
<main id="main">

to comment out the script

1 Like

Thank you again i just did what you said and it worked.