12 Jun 2024

How To Manage Images And PDFs

Where to place images and PDFs and how to link them safely with relative_url.

assets images pdf

Images and PDFs should stay inside assets so GitHub Pages can publish them.

Recommended Folders

assets/images/bsc/sem-v/topic-name/
assets/images/msc/sem-ii/topic-name/
assets/images/documentation/tech/
assets/images/documentation/code/
assets/pdfs/documentation/tech/

Use lowercase folder names when possible, and keep related files together.

Image Syntax

![Diagram caption](/assets/images/bsc/sem-v/tunneling/example.png)

PDF Link Syntax

[Download PDF](/assets/pdfs/documentation/tech/file.pdf)

Using relative_url keeps links working with the current baseurl.

Icons Used By Data Files

Header and share icons are listed in data files:

_data/header_icons.yml
_data/share_icons.yml

Keep the actual SVG or image files inside:

assets/icons/

Then reference them with a site-relative path such as:

icon: /assets/icons/icon-whatsapp-share.svg

Small Rules

• Avoid spaces in filenames.
• Prefer descriptive names such as barrier-potential.png.
• Keep large PDFs in assets/pdfs.
• Keep reusable icon paths in _data when they are used by the header or share strip.
• After adding files, run jekyll build and click the generated link locally.