_data
_docs
_drafts
_includes
_layouts
_pages
_pets
_portfolio
_posts
2009-05-15-edge-case-nested-and-mixed-lists.md
2009-06-01-edge-case-many-tags.md
2009-07-02-edge-case-many-categories.md
2009-08-06-edge-case-no-body-content.md
2009-09-05-edge-case-no-yaml-title.md
2009-10-05-edge-case-title-should-not-overflow-the-content-area.md
2009-10-05-edge-case-very-long-title.md
2010-01-07-post-modified.md
2010-01-07-post-standard.md
2010-01-08-post-chat.md
2010-02-05-post-notice.md
2010-02-05-post-quote.md
2010-03-07-post-link.md
2010-06-02-post-video-youtube.md
2010-08-05-post-image-linked.md
2010-08-05-post-image-standard.md
2010-08-06-post-image-linked-caption.md
2010-08-07-post-image-caption.md
2010-09-09-post-gallery.md
2010-09-10-post-twitter-embeds.md
2010-10-25-post-future-date.md
2012-01-02-layout-comments-disabled.md
2012-01-02-layout-comments.md
2012-01-02-layout-read-time-disabled.md
2012-01-02-layout-read-time.md
2012-01-02-layout-related-posts-disabled.md
2012-01-02-layout-related-posts.md
2012-01-02-layout-sharing-disabled.md
2012-01-02-layout-sharing.md
2012-01-03-layout-read-time-comments-sharing-related-posts-disabled.md
2012-01-03-layout-table-of-contents-post.md
2012-03-14-layout-code-excerpt-generated.md
2012-03-14-layout-excerpt-defined.md
2012-03-14-layout-excerpt-generated.md
2012-03-15-layout-author-override.md
2012-03-15-layout-author-sidebar-disabled.md
2012-03-15-layout-header-image-external.md
2012-03-15-layout-header-image-horizontal.md
2012-03-15-layout-header-image-text-readability.md
2012-03-15-layout-header-image-vertical.md
2012-03-15-layout-header-overlay-color.md
2012-03-15-layout-header-overlay-image.md
2012-03-15-layout-more-tag.md
2012-03-15-layout-sidebar-custom.md
2012-05-22-markup-text-readability.md
2013-01-05-markup-title-with-markup.md
2013-01-05-markup-title-with-special-characters.md
2013-01-09-markup-text-alignment.md
2013-01-10-markup-image-alignment.md
2013-01-11-markup-html-tags-and-formatting.md
2013-05-22-markup-more-images.md
2013-08-16-markup-syntax-highlighting.md
2016-02-24-welcome-to-jekyll.md
_recipes
assets
images
.editorconfig
.gitattributes
.gitignore
CHANGELOG
Gemfile
Gemfile.lock
LICENSE
README
_config.dev.yml
_config.yml
index.html
package.json
44 lines
1.2 KiB
Markdown
44 lines
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 `/images/` directory and referencing them with an absolute path. Prepending the filename with `{% raw %}{{ site.url }}{{ site.baseurl }}/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 }}/images/filename.jpg" alt="">{% endraw %}
|
|
```
|
|
|
|
**or Kramdown:**
|
|
|
|
```markdown
|
|
{% raw %}{% endraw %}
|
|
```
|
|
|
|

|
|
|
|
Image that fills page content container by adding the `.full` class with:
|
|
|
|
**HTML:**
|
|
|
|
```html
|
|
{% raw %}<img src="{{ site.url }}{{ site.baseurl }}/images/filename.jpg" alt="" class="full">{% endraw %}
|
|
```
|
|
|
|
**or Kramdown:**
|
|
|
|
```markdown
|
|
{% raw %}
|
|
{: .full}{% endraw %}
|
|
```
|
|
|
|

|
|
{: .full} |