Internal and image links


#1

Hi

I keep trying to link an image to documentation and also link two internal pages together but no joy at all.

Please could you assist.


#2

When posting code, please remember to highlight it and press the </> button above the editor to mark it as code. You could also post a screenshot.


#5

You have relative links, but you haven’t provided any information about the directory structure that you are using, so I am unable to tell you if your URLs are correct. ../ tells the browser to look in the folder above the one that contains the current page. If the image and Awareness_Guides/ are in the same folder as the current page, then you want to use ./.


#6

Thanks - the directory is: Capture

My document files are in updates and the images are in images


#7

the images are in Images>releasenotes>image 1.jpg


#8

That’s very different from what you had in the HTML.


#9

So how do I fix the link? I’ve tried putting the full path in but the images still don’t appear.
Should I change the folder structure?


#10

What have you tried? If you show me what you’re doing, I can tell you what you should do.


#11

i’ve just tried expanding the link to the image file:


#12
<img src="./091217releasenotes/02-12-2017 filter summary reports 2.0.jpg" alt="Filter Summary"
		 style="border-left-style: Solid; border-left-width: 1px; border-right-style: Solid;
		 border-right-width: 1px; border-top-style: Solid; border-top-width: 1px;
		 border-bottom-style: Solid; border-bottom-width: 1px;" border="1" />
then I tried this:
   <img src="../091217releasenotes/02-12-2017 filter summary reports 2.0.jpg" alt="Filter Summary"
    		 style="border-left-style: Solid; border-left-width: 1px; border-right-style: Solid;
    		 border-right-width: 1px; border-top-style: Solid; border-top-width: 1px;
    		 border-bottom-style: Solid; border-bottom-width: 1px;" border="1" />
then this:
 <img src="images/updates/091217releasenotes/02-12-2017 filter summary reports 2.0.jpg" alt="Filter Summary" style="border-left-style: Solid; border-left-width: 1px; border-right-style: Solid;
        		 border-right-width: 1px; border-top-style: Solid; border-top-width: 1px;
        		 border-bottom-style: Solid; border-bottom-width: 1px;" border="1" />

I tried putting the images in the updates folder - didn’t work
I tried moving the images folder into the updates folder - did not work

That’s all the details of what I’ve done

I’m sure there’s a solution but what should I do?


#13

Nowhere in the directory tree that you showed me is a folder called 091217releasenotes/. So you haven’t given me all the information. Are the images under images/, like you said, or are they under images/updates/091217releasenotes/?

If you are linking to the image from a markdown file in content/updates/, you need to get up to the top level to get to images/. Since ../ goes to the next level up, you need one to get to content/ and one to get to ATOM-HUGO online docs/. So you would start with ../../images/.


#14

thanks - Here’s the full directory


#15

What happens when you try "../../images/091217releasenotes/02-12-2017 filter summary reports 2.0.jpg"?


#16

It worked! thank you so much!


#17

No problem.


#18

I have one more issue - how do I link the 20 January 2018 Release Notes to the Documents Page Awareness Guide?


#19
    <a href="Documents Page Awareness Guide.md">Documents
 Page Awareness Guide</a>

#20

You should consult the documentation for the documentation framework you’re using about whether markdown files should have links to other markdown files or whether they get converted into HTML and should have conversion-proof links.