Re: [O] resize multiple image within a row or paragraph
Nicolas Goaziou writes: Hello, Christian Moe m...@christianmoe.com writes: Here's a simple CSS workaround that might or might not work well for you, and won't work for non-HTML backends, but at least requires minimal hacking: [...] Good to know. Anyhow, does my proposal make sense? Regards, Hi, Sorry, catching up on mail. Also, I misunderstood your proposal when you wrote it -- I thought it was a suggestion for what the user could do. But now I realize it's a proposed change to the HTML backend itself. You wrote: `html' back-end can redefine what a paragraph is, instead of following Org's own definition. More explicitly, an HTML paragraph can be defined as a cluster of elements not separated by any blank line and containing at least an Org paragraph. Hence: #+attr_html: :width 10% [[./img1.png]] Paragraph #+attr_html: :width 10% [[./img2.png]] consists of two paragraphs in Org, but would be seen as a single paragraph by HTML, and exported as such. Implementation is simple using pseudo-elements. `latex' back-ends does it already for tables and math snippets. However, I'm no HTML specialist, so there may be drawbacks I cannot foresee. I'm no expert either. But FWIW, it does make sense to me, and seems intuitive from an HTML-centric view, since IMG elements in HTML are basically inline. I think users would expect to have to put blank lines around an image if they want it wrapped in a paragraph, and should expect to get in trouble if they did not put blank lines around a captioned figure. Yours, Christian
Re: [O] resize multiple image within a row or paragraph
Hello, Christian Moe m...@christianmoe.com writes: Here's a simple CSS workaround that might or might not work well for you, and won't work for non-HTML backends, but at least requires minimal hacking: [...] Good to know. Anyhow, does my proposal make sense? Regards, -- Nicolas Goaziou
Re: [O] resize multiple image within a row or paragraph
Wow. Thanks for your reply. I will stop googling and worg-ing for a solution. I will rather dig into your suggestion. As I understood, there is some hackery involved here .. :) Thanks again. ~Alban Bernard On Saturday, September 20, 2014 2:08 PM, Nicolas Goaziou m...@nicolasgoaziou.fr wrote: Hello, alban bernard alban.bern...@yahoo.fr writes: My wife and I use the marvelous org-mode to design a complete set of student courses. These courses are first written in org-mode then exported to html to ease distribution to students (and save some paper). We wonder what is the correct way to resize multiple images those links are within a single paragraph: This is a phrase with [[./image1.png]] and [[./image2.png]] inline images. With the following, the only first image is resized (as expected): #+ATTR_HTML: :width 50% This is a phrase with [[./image1.png]] and [[./image2.png]] inline images. The tutorial about caption in a row shows what is possible while working only with images http://orgmode.org/worg/org-tutorials/images-and-xhtml-export.html#sec-5-2: #+HTML_HEAD: style type=text/css #+HTML_HEAD:!--/*--![CDATA[/*!--*/ #+HTML_HEAD: div.figure { float:left; } #+HTML_HEAD: /*]]*/-- #+HTML_HEAD: /style #+CAPTION: #+ATTR_HTML: :width 10% [[./image1.png]] #+CAPTION: #+ATTR_HTML: :width 10% [[./image2.png]] Here, image1 and image2 are displayed and resized in a single row. But we don't know how to mix text within this block so that all is displayed as a single paragraph with resized images. This is not possible out of the box. You might use some Babel code to generate the needed HTML but I guess it wouldn't be particularly easy. Nevertheless, there's a solution. `html' back-end can redefine what a paragraph is, instead of following Org's own definition. More explicitly, an HTML paragraph can be defined as a cluster of elements not separated by any blank line and containing at least an Org paragraph. Hence: #+attr_html: :width 10% [[./img1.png]] Paragraph #+attr_html: :width 10% [[./img2.png]] consists of two paragraphs in Org, but would be seen as a single paragraph by HTML, and exported as such. Implementation is simple using pseudo-elements. `latex' back-ends does it already for tables and math snippets. However, I'm no HTML specialist, so there may be drawbacks I cannot foresee. Regards, -- Nicolas Goaziou
Re: [O] resize multiple image within a row or paragraph
Hi, Here's a simple CSS workaround that might or might not work well for you, and won't work for non-HTML backends, but at least requires minimal hacking: Wrap the sentence in a DIV element and define a class for it to force child paragraphs to display as inline instead of blocks. You can set up the style sheets in various ways, but by way of demonstration, add the style definition with HTML_HEAD export keyword: #+HTML_HEAD: style.inlineparas p {display: inline;} /style Then you can do things like this: #+html: div class=inlineparas This is a phrase with #+ATTR_HTML: :width 50% [[./image1.png]] and #+ATTR_HTML: :width 50% [[./image2.png]] inline images. #+end_inlineparas #+html: /div The generic #+begin_{block} syntax lets you do this in a more org-like and less cluttered way: #+begin_inlineparas This is a phrase with #+ATTR_HTML: :width 50% [[./image1.png]] and #+ATTR_HTML: :width 50% [[./image2.png]] inline images. #+end_inlineparas Yours, Christian alban bernard writes: Wow. Thanks for your reply. I will stop googling and worg-ing for a solution. I will rather dig into your suggestion. As I understood, there is some hackery involved here .. :) Thanks again. ~Alban Bernard On Saturday, September 20, 2014 2:08 PM, Nicolas Goaziou m...@nicolasgoaziou.fr wrote: Hello, alban bernard alban.bern...@yahoo.fr writes: (...) We wonder what is the correct way to resize multiple images those links are within a single paragraph: This is a phrase with [[./image1.png]] and [[./image2.png]] inline images. With the following, the only first image is resized (as expected): #+ATTR_HTML: :width 50% This is a phrase with [[./image1.png]] and [[./image2.png]] inline images. (...) But we don't know how to mix text within this block so that all is displayed as a single paragraph with resized images. This is not possible out of the box. You might use some Babel code to generate the needed HTML but I guess it wouldn't be particularly easy. Nevertheless, there's a solution. `html' back-end can redefine what a paragraph is, instead of following Org's own definition. (...)
Re: [O] resize multiple image within a row or paragraph
I will test this workaround pronto. For other backends, that's not a problem as I render pdf from html through phantomjs and I don't use neither latex nor odt for the moment. Big thanks to you both. ~Alban Bernard. On Sunday, September 21, 2014 8:07 PM, Christian Moe m...@christianmoe.com wrote: Hi, Here's a simple CSS workaround that might or might not work well for you, and won't work for non-HTML backends, but at least requires minimal hacking: Wrap the sentence in a DIV element and define a class for it to force child paragraphs to display as inline instead of blocks. You can set up the style sheets in various ways, but by way of demonstration, add the style definition with HTML_HEAD export keyword: #+HTML_HEAD: style.inlineparas p {display: inline;} /style Then you can do things like this: #+html: div class=inlineparas This is a phrase with #+ATTR_HTML: :width 50% [[./image1.png]] and #+ATTR_HTML: :width 50% [[./image2.png]] inline images. #+end_inlineparas #+html: /div The generic #+begin_{block} syntax lets you do this in a more org-like and less cluttered way: #+begin_inlineparas This is a phrase with #+ATTR_HTML: :width 50% [[./image1.png]] and #+ATTR_HTML: :width 50% [[./image2.png]] inline images. #+end_inlineparas Yours, Christian alban bernard writes: Wow. Thanks for your reply. I will stop googling and worg-ing for a solution. I will rather dig into your suggestion. As I understood, there is some hackery involved here .. :) Thanks again. ~Alban Bernard On Saturday, September 20, 2014 2:08 PM, Nicolas Goaziou m...@nicolasgoaziou.fr wrote: Hello, alban bernard alban.bern...@yahoo.fr writes: (...) We wonder what is the correct way to resize multiple images those links are within a single paragraph: This is a phrase with [[./image1.png]] and [[./image2.png]] inline images. With the following, the only first image is resized (as expected): #+ATTR_HTML: :width 50% This is a phrase with [[./image1.png]] and [[./image2.png]] inline images. (...) But we don't know how to mix text within this block so that all is displayed as a single paragraph with resized images. This is not possible out of the box. You might use some Babel code to generate the needed HTML but I guess it wouldn't be particularly easy. Nevertheless, there's a solution. `html' back-end can redefine what a paragraph is, instead of following Org's own definition. (...)
Re: [O] resize multiple image within a row or paragraph
Any thought on this? ~Alban. On Thursday, September 18, 2014 5:14 PM, alban bernard alban.bern...@yahoo.fr wrote: Hi Folks, My wife and I use the marvelous org-mode to design a complete set of student courses. These courses are first written in org-mode then exported to html to ease distribution to students (and save some paper). We wonder what is the correct way to resize multiple images those links are within a single paragraph: This is a phrase with [[./image1.png]] and [[./image2.png]] inline images. With the following, the only first image is resized (as expected): #+ATTR_HTML: :width 50% This is a phrase with [[./image1.png]] and [[./image2.png]] inline images. The tutorial about caption in a row shows what is possible while working only with images http://orgmode.org/worg/org-tutorials/images-and-xhtml-export.html#sec-5-2: #+HTML_HEAD: style type=text/css #+HTML_HEAD:!--/*--![CDATA[/*!--*/ #+HTML_HEAD: div.figure { float:left; } #+HTML_HEAD: /*]]*/-- #+HTML_HEAD: /style #+CAPTION: #+ATTR_HTML: :width 10% [[./image1.png]] #+CAPTION: #+ATTR_HTML: :width 10% [[./image2.png]] Here, image1 and image2 are displayed and resized in a single row. But we don't know how to mix text within this block so that all is displayed as a single paragraph with resized images. I tested all of this with the following version combos: Debian Jessie/Emacs 24.3.1/Orgmode 8.2.5h-1 (debian) Debian Jessie/Emacs 24.3.1/Orgmode latest git Thanks for any hint that could help. ~Alban. PS: the Show the source button of http://orgmode.org/worg/org-tutorials/images-and-xhtml-export.html redirects to: http://orgmode.org/worg/org-tutorials/images-and-xorg.html-export.org.html rather than: http://orgmode.org/worg/org-tutorials/images-and-xhtml-export.org.html
Re: [O] resize multiple image within a row or paragraph
Hello, alban bernard alban.bern...@yahoo.fr writes: My wife and I use the marvelous org-mode to design a complete set of student courses. These courses are first written in org-mode then exported to html to ease distribution to students (and save some paper). We wonder what is the correct way to resize multiple images those links are within a single paragraph: This is a phrase with [[./image1.png]] and [[./image2.png]] inline images. With the following, the only first image is resized (as expected): #+ATTR_HTML: :width 50% This is a phrase with [[./image1.png]] and [[./image2.png]] inline images. The tutorial about caption in a row shows what is possible while working only with images http://orgmode.org/worg/org-tutorials/images-and-xhtml-export.html#sec-5-2: #+HTML_HEAD: style type=text/css #+HTML_HEAD:!--/*--![CDATA[/*!--*/ #+HTML_HEAD: div.figure { float:left; } #+HTML_HEAD: /*]]*/-- #+HTML_HEAD: /style #+CAPTION: #+ATTR_HTML: :width 10% [[./image1.png]] #+CAPTION: #+ATTR_HTML: :width 10% [[./image2.png]] Here, image1 and image2 are displayed and resized in a single row. But we don't know how to mix text within this block so that all is displayed as a single paragraph with resized images. This is not possible out of the box. You might use some Babel code to generate the needed HTML but I guess it wouldn't be particularly easy. Nevertheless, there's a solution. `html' back-end can redefine what a paragraph is, instead of following Org's own definition. More explicitly, an HTML paragraph can be defined as a cluster of elements not separated by any blank line and containing at least an Org paragraph. Hence: #+attr_html: :width 10% [[./img1.png]] Paragraph #+attr_html: :width 10% [[./img2.png]] consists of two paragraphs in Org, but would be seen as a single paragraph by HTML, and exported as such. Implementation is simple using pseudo-elements. `latex' back-ends does it already for tables and math snippets. However, I'm no HTML specialist, so there may be drawbacks I cannot foresee. Regards, -- Nicolas Goaziou
[O] resize multiple image within a row or paragraph
Hi Folks, My wife and I use the marvelous org-mode to design a complete set of student courses. These courses are first written in org-mode then exported to html to ease distribution to students (and save some paper). We wonder what is the correct way to resize multiple images those links are within a single paragraph: This is a phrase with [[./image1.png]] and [[./image2.png]] inline images. With the following, the only first image is resized (as expected): #+ATTR_HTML: :width 50% This is a phrase with [[./image1.png]] and [[./image2.png]] inline images. The tutorial about caption in a row shows what is possible while working only with images http://orgmode.org/worg/org-tutorials/images-and-xhtml-export.html#sec-5-2: #+HTML_HEAD: style type=text/css #+HTML_HEAD:!--/*--![CDATA[/*!--*/ #+HTML_HEAD: div.figure { float:left; } #+HTML_HEAD: /*]]*/-- #+HTML_HEAD: /style #+CAPTION: #+ATTR_HTML: :width 10% [[./image1.png]] #+CAPTION: #+ATTR_HTML: :width 10% [[./image2.png]] Here, image1 and image2 are displayed and resized in a single row. But we don't know how to mix text within this block so that all is displayed as a single paragraph with resized images. I tested all of this with the following version combos: Debian Jessie/Emacs 24.3.1/Orgmode 8.2.5h-1 (debian) Debian Jessie/Emacs 24.3.1/Orgmode latest git Thanks for any hint that could help. ~Alban. PS: the Show the source button of http://orgmode.org/worg/org-tutorials/images-and-xhtml-export.html redirects to: http://orgmode.org/worg/org-tutorials/images-and-xorg.html-export.org.html rather than: http://orgmode.org/worg/org-tutorials/images-and-xhtml-export.org.html