hacks-guide-minimal-mistake.../test/_posts/2010-08-05-post-image-standard.md
Michael Rose 57a4324fa0 Move gh-pages branch files into /docs and add test files
- Jekyll ignore `/docs` and `/test` folders when using from root
- Update Staticman config to point to correct branch and data file location
- Replace `{{ base_path }}` references with `absolute_url` filter
- Update documentation
2016-11-03 11:52:04 -04:00

44 lines
No EOL
1.2 KiB
Markdown

---
title: "Post: Image (Standard)"
categories:
- Post Formats
tags:
- image
- Post Formats
---
The preferred way of using images is placing them in the `/assets/images/` directory and referencing them with an absolute path. Prepending the filename with `{% raw %}{{ site.url }}{{ site.baseurl }}/assets/images/{% endraw %}` will make sure your images display properly in feeds and such.
Standard image with no width modifier classes applied.
**HTML:**
```html
{% raw %}<img src="{{ site.url }}{{ site.baseurl }}/assets/images/filename.jpg" alt="">{% endraw %}
```
**or Kramdown:**
```markdown
{% raw %}![alt]({{ site.url }}{{ site.baseurl }}/assets/images/filename.jpg){% endraw %}
```
![Unsplash image 9]({{ site.url }}{{ site.baseurl }}/assets/images/unsplash-image-9.jpg)
Image that fills page content container by adding the `.full` class with:
**HTML:**
```html
{% raw %}<img src="{{ site.url }}{{ site.baseurl }}/assets/images/filename.jpg" alt="" class="full">{% endraw %}
```
**or Kramdown:**
```markdown
{% raw %}![alt]({{ site.url }}{{ site.baseurl }}/assets/images/filename.jpg)
{: .full}{% endraw %}
```
![Unsplash image 10]({{ site.url }}{{ site.baseurl }}/assets/images/unsplash-image-10.jpg)
{: .full}