Learn HTML by Building a Cat Photo App - Step 15

Tell us what’s happening:
Describe your issue in detail here.

I just have no idea what I’m supposed to do. Totally blank here.

Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
      <p>See more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a> in our gallery.</p>
      <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back.">
    </main>
  </body>
</html>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/109.0.0.0 Safari/537.36

Challenge: Learn HTML by Building a Cat Photo App - Step 15

Link to the challenge:

As the instructions say, you can turn things into links by wrapping them in anchor tags. You have already turned the words cat photos into a link by wrapping those words in anchor tags. Now you want to turn the image into a link by wrapping it in anchor tags.

Please give it a try and if it doesn’t work then you can paste in your HTML so we can see what you did and give you help.

To display your code in here you need to wrap it in triple back ticks. On a line by itself type three back ticks. Then on the first line below the three back ticks paste in your code. Then below your code on a new line type three more back ticks. The back tick on my keyboard is in the upper left just above the Tab key and below the Esc key. You may also be able to use Ctrl+e to automatically give you the triple back ticks while you are typing in the this editor and the cursor is on a line by itself. Alternatively, with the cursor on a line by itself, you can use the </> button above the editor to add the triple back ticks.

I think you understood it now as you deleted your message. you have to add the correct anchor tag before and after the img element.

I used chatgpt because I don’t get what I was doing wrong and it was frustating.

its a common feeling in learning something. I was confused as well as I was doing it and the best process of learning is to try & ask for understanding than getting the correct code from someone else.

the main understanding is that you can “link” things by wraping it in an anchor tag. As example this one is a paragraph element:

<p>Hello World</p>

and the goal was to make your element, in your case the image element, to a link. this is your image element:

<img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back.">

how can you make an existing element to a link? right. you have to wrap it in an anchor tag. I do nothing more than putting an anchor tag around my existing element:

<a href=""><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>

I hope I could give you a little taste of understanding as you used already chatgpt but I hope that you learn that frustration is the key of success if you keep it in mind. Have alot of fun and I wish you the best!

Just feel this course throws things at you before you’ve even learnt enough. I didn’t know I had to a href to it. Also why the href=“” with nothing in it? What does that mean?

Well the challenge starts off by saying “In previous steps you used an anchor element to turn text into a link. Other types of content can also be turned into a link by wrapping it in anchor tags.”

It sounds like you learned about using the anchor tag in previous lessons. It might be a good idea to go back and refresh yourself if you feel like you havent used this before

They left it blank I assume as to not give you the full solution. As what they did provide you is 95% of the solution. If there is nothing in the href then the link would not go anywhere. Since the href is used for the link to navigate to when the link is clicked on.

1 Like

I thought the anchor text was <a but I guess not. Maybe go back sometime and see what I forgot about.

The anchor text is the text on the page you click on to activate the link, which is the text between the opening and closing a tags.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.