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

Feature request: allow specfying image dimensions #24

Open
yaroslavvb opened this issue Aug 14, 2016 · 11 comments
Open

Feature request: allow specfying image dimensions #24

yaroslavvb opened this issue Aug 14, 2016 · 11 comments

Comments

@yaroslavvb
Copy link

Some markdown engines support syntax like below to specify image dimensions, but it doesn't seem to work in markup-it

![](./pic/pic1_50.png =100x20)

This is important for SVG files since there's no dimension information in the file, and also for PNG file that you want to look nice on Retina displays (logical size must be 50% of the pixel size)

@SamyPesse
Copy link
Member

It's a good idea. But my main concern is that GitHub doesn't support it (it adds it to the url, which breaks the image).
So if we add it to GitBook and GitBook Editor (with some kind of resizer), it'll break GitHub contents.

@Soreine @AaronO @jpreynat What do you think? It might still be a better idea than using a templating tag ({% image width="100", src="./pic/pic1_50.png" %})

@yaroslavvb
Copy link
Author

Is templating tag syntax supported already? It doesn't seem to work in GitBook editor

@Soreine
Copy link
Contributor

Soreine commented Aug 18, 2016

I saw this proposal http://fletcher.github.io/MultiMarkdown-5/attributes.html
And wondered if we could use this kind of syntax, exploiting link references, to add more attributes in a fallback-compatible manner with GitHub.

But this...

![imageref]

[imageref]: http://url "Alt text" something

... is not valid GFM because there's something after the "Alt text". I could also think of some really ugly things like this:

![image1]

[image1]: http://url "Alt text"
[]: 200x300
^ this is ignored, but still visible to the parser.

As far as it concerns gitbook, HTML remains the best compatible option. If we drop compatibility, I don't really see any drawback to the Markdown variant, as long as it sticks to the basics (authors should switch to templating as soon as they want to do more than setting a size).

Concerning markup-it itself, it could easily be made compatible with the markdown engines that support image sizes, by simply having some extra attributes in the core schema that are ignored when exporting to Markdown (lossy conversion).

@che85
Copy link

che85 commented Jan 27, 2017

It would also be nice to support relative sizing. Sometimes I know, that an image should be centered and only take maximum 50% of the page width.

Another thing is that using html in the desktop version of gitbook doesn't seem to take my size arguments correctly and the image width always takes 100% of the page width.

@yaroslavvb
Copy link
Author

BTW, now github supports it using img tag with width/height attributes, here's a diagram I added at 50% scaling that looks super-crisp on retina displays:

tensorflow/tensorflow#6961 (comment)

@fruch
Copy link

fruch commented Aug 1, 2017

It's a shame that the editor doesn't support using , it's really messing it....

@jhiemer
Copy link

jhiemer commented Aug 13, 2017

@fruch totally agree... +1 for this feature

@gki
Copy link

gki commented Feb 18, 2019

👍

@proxy-hatch
Copy link

+1 for this feature. No excuse now that Github supports it. Its been years. Sad to see Gitbook abandoning their user-base.

@pierreneu
Copy link

+1

@kyranjamie
Copy link

+1, this prevents retina images

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

10 participants