Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

add image helper for easier image insertion in posts #572

Closed
wants to merge 4 commits into from
Closed

add image helper for easier image insertion in posts #572

wants to merge 4 commits into from

Conversation

fa-ribeiro
Copy link
Contributor

This PR adds an 'image' helper for easier insertion of image in posts (#560)

It handles both local images (it assumes images are under assets/images) and urls.

in order to add an image to a post, just use the following syntax:

{% include image image_path="2016/07/MyPostImage.png" caption="The optional image caption" %}

or

{% include image image_path="https://example.com/images/MyPostImage.png" caption="The optional image caption" alt="The optional alt text" %}

Parameters are:

  • image_path (mandatory): the image path. It can be an url or a local path. In the former case, it assumes images are under assets/images, so you only need to specify the path from there.
  • caption (optional): the image caption.
  • alt (optional): the alt text.

What you think?

@mmistakes
Copy link
Owner

Looks good and fits in well with the gallery helper. I'll see about merging this in when I do the next release of the theme. Currently working on a few things to make the switch over to a gemified version of the theme and I'd like to include this with that release.

@mmistakes mmistakes added this to the 4.0 milestone Oct 8, 2016
@@ -0,0 +1,14 @@
{% include base_path %}
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've deprecated the base_path include as Jekyll provides filters to do this now.

{% if include.image_path contains "://" %}
"{{ include.image_path }}"
{% else %}
"{{ include.image_path | prepend: "/assets/images/" | prepend: base_path }}"
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can replace prepend: base_path with absolute_url

Copy link
Owner

@mmistakes mmistakes left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Care to make some minor edits to remove base_path and replace with the new absolute_url filter in Jekyll 3.3.0 so I can merge this PR?

@fa-ribeiro
Copy link
Contributor Author

done :-)

Copy link
Owner

@mmistakes mmistakes left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just one more small thing and should be good to go. Thanks!

{% if include.image_path contains "://" %}
"{{ include.image_path }}"
{% else %}
"{{ include.image_path | prepend: "/assets/images/" | absolute_url }}"
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

One more minor thing. With the latest MM I moved away from assuming images would be placed in /assets/images/ and instead encourage adding the full path. Adds more flexibility to where they can be placed for the user.

If you could remove prepend: "/assets/images/" it fall in line with the other helpers and I can merge it in.

In order to add an image to a post, just use the following syntax:

{% include image image_path="/full/path/to/MyPostImage.png" caption="The optional image caption" %}

or

{% include image image_path="https://example.com/images/MyPostImage.png" caption="The optional image caption" alt="The optional alt text" %}
@mmistakes
Copy link
Owner

Looks like Jekyll core may get a native filter to do something similar. jekyll/jekyll#5560

@mmistakes mmistakes removed this from the 4.0 milestone Nov 15, 2016
@mmistakes
Copy link
Owner

I made a small change and renamed the helper from image to figure to be more semantic. The PR has been merged c4252b0 and will show up in the next theme release.

Thanks for your work on this.

@mmistakes mmistakes closed this Nov 15, 2016
koyumi0601 pushed a commit to koyumi0601/koyumi0601.github.io that referenced this pull request Jul 31, 2023
This PR combines (and resolves conflicts between) mmistakes#448, mmistakes#463, mmistakes#466, mmistakes#494, mmistakes#495, mmistakes#496, mmistakes#498, and mmistakes#572. 

The main aim is to facilitate use of several of the implemented features _together_, when using the fork as a remote theme. It should also simplify merging the included PRs into a future release.

The branch [combination-rec-nav](https://github.com/pdmosses/just-the-docs/tree/combination-rec-nav) adds [multi-level navigation](just-the-docs/just-the-docs#462) and (NEW:) [sibling links](just-the-docs/just-the-docs#394) to the branch used for this PR. It includes updated [documentation for the navigation structure](https://pdmosses.github.io/just-the-docs/docs/navigation-structure/), and reorganised and extended [navigation tests](https://pdmosses.github.io/just-the-docs/tests/navigation/). The documentation and the tests can be browsed at the (temporary) [website published from the combination-rec-nav branch](https://pdmosses.github.io/just-the-docs/).

_Caveat:_ The changes to v0.3.3 in this PR and mmistakes#462 have not yet been reviewed or approved, and may need updating before merging into a release of the theme. If you use a branch from a PR as a remote theme, there is a risk of such updates affecting your website. Moreover, these branches are likely to be deleted after they have been merged. To avoid  such problems, you could copy the branch that you want to use to your own fork of the theme.

Co-authored-by: Matt Wang <matt@matthewwang.me>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants