* How to activate pre.src in org-babel html output? Can only get class=example
@ 2012-02-13 4:04 Giovanni Moretti
2012-02-18 15:03 ` Eric Schulte
0 siblings, 1 reply; 3+ messages in thread
From: Giovanni Moretti @ 2012-02-13 4:04 UTC (permalink / raw)
To: emacs-orgmode
[-- Attachment #1: Type: text/plain, Size: 1843 bytes --]
Using org-babel, I'm wanting to output Python fragments along with the resultant
output to HTML.
That bit's easy, and the following works as expected:
#+options: toc:nil num:nil
* Using Python interactively
Any commands typed into the console executed immediately.
#+begin_src python :results output :exports both
print 355/113
print 17/2
print 17/2.0
#+end_src python
However, although I find references to various styling mechanisms (e.g
*pre.src*) in the orgmode documentation, I can't find any way to get any more
CSS selectors on both the src and output blocks. The only one that ever appears
is "example" as shown here:
<pre class="example">print 355/113
print 17/2
print 17/2.0
</pre>
<pre class="example">
3
8
8.5
</pre>
</div>
If I can find out how to make "pre.src" appear (hopefully only on the source
block) , then I can change the background colours or fonts to make the output
visibly distinct from the source code.
The full HTML output I get is at
http://dl.dropbox.com/u/2671560/org-py-babel.html contains lots of CSS
selectors, and I can easily include my my own using #+STYLE lines, but I need
some way to differentiate the two blocks.
I'm using Emacs 23.1.50.1 and the lastest orgmode commit
b5082974c83a3a4838db86025edce857b11e5847 (Fri Feb 3 15:18:05 2012 +0100)
Any tips?
Thanks
Giovanni
--
======================================================================
Dr Giovanni Moretti | School of Engineering and Advanced Technology
Senior Lecturer | Massey University, Palmerston North, New Zealand
Computer Science | Ph +64-6-3505799x2474 Fax +64-6-3502259 - ZL2GX
======================================================================
http://seat.massey.ac.nz/moretti G.Moretti@massey.ac.nz
[-- Attachment #2: Type: text/html, Size: 2693 bytes --]
^ permalink raw reply [flat|nested] 3+ messages in thread* Re: How to activate pre.src in org-babel html output? Can only get class=example
2012-02-13 4:04 How to activate pre.src in org-babel html output? Can only get class=example Giovanni Moretti
@ 2012-02-18 15:03 ` Eric Schulte
2012-02-20 0:12 ` Giovanni Moretti
0 siblings, 1 reply; 3+ messages in thread
From: Eric Schulte @ 2012-02-18 15:03 UTC (permalink / raw)
To: Giovanni Moretti; +Cc: emacs-orgmode
Hi Giovanni,
When I export the following code block
,----
| #+begin_src emacs-lisp :exports both
| :foo
| #+end_src
`----
it generates the following HTML.
,----
| <pre class="src src-emacs-lisp"><span style="color: #d0d0ff;">:foo</span>
| </pre>
|
|
| <pre class="example">
| :foo
| </pre>
`----
My guess is that during export you get a message along the lines of
"htmlize is required for export". Try explicitly loading htmlize.el (in
the contrib/lisp directory of org) and then re-exporting and you should
get the desired output.
Best,
Giovanni Moretti <g.moretti@massey.ac.nz> writes:
> Using org-babel, I'm wanting to output Python fragments along with the resultant
> output to HTML.
>
> That bit's easy, and the following works as expected:
>
> #+options: toc:nil num:nil
> * Using Python interactively
> Any commands typed into the console executed immediately.
>
> #+begin_src python :results output :exports both
> print 355/113
>
> print 17/2
> print 17/2.0
> #+end_src python
>
> However, although I find references to various styling mechanisms (e.g
> *pre.src*) in the orgmode documentation, I can't find any way to get any more
> CSS selectors on both the src and output blocks. The only one that ever appears
> is "example" as shown here:
>
> <pre class="example">print 355/113
> print 17/2
> print 17/2.0
> </pre>
> <pre class="example">
> 3
> 8
> 8.5
> </pre>
> </div>
>
> If I can find out how to make "pre.src" appear (hopefully only on the source
> block) , then I can change the background colours or fonts to make the output
> visibly distinct from the source code.
>
> The full HTML output I get is at
> http://dl.dropbox.com/u/2671560/org-py-babel.html contains lots of CSS
> selectors, and I can easily include my my own using #+STYLE lines, but I need
> some way to differentiate the two blocks.
>
> I'm using Emacs 23.1.50.1 and the lastest orgmode commit
> b5082974c83a3a4838db86025edce857b11e5847 (Fri Feb 3 15:18:05 2012 +0100)
>
> Any tips?
>
> Thanks
> Giovanni
--
Eric Schulte
http://cs.unm.edu/~eschulte/
^ permalink raw reply [flat|nested] 3+ messages in thread
* Re: How to activate pre.src in org-babel html output? Can only get class=example
2012-02-18 15:03 ` Eric Schulte
@ 2012-02-20 0:12 ` Giovanni Moretti
0 siblings, 0 replies; 3+ messages in thread
From: Giovanni Moretti @ 2012-02-20 0:12 UTC (permalink / raw)
To: Eric Schulte; +Cc: emacs-orgmode
Hi Eric
> My guess is that during export you get a message along the lines of
> "htmlize is required for export". Try explicitly loading htmlize.el
> (in the contrib/lisp directory of org) and then re-exporting ...
You're spot on - importing htmlize.el did the trick. However, before importing
it, there weren't any error messages about it being missing. All would work
happily, but the source block didn't have the additional src and src-python tags.
To me, this seems like a bug or at least not ideal, as the src tag and the
src-<language> tag are related to the HTML export of #+begin_src block, not on
*how* the HTML is styled (i.e. by the user or htmlize).
For those searching the mailing list later:
; For pretty-printed formatted source code on HTML export,
; load htmlize.el in init.el or the emacs config file
(load-file "~/.emacs.d/orgmode/contrib/lisp/htmlize.el")
I've got the orgmode source in the .emacs.d directory so I can pull updates
using git, otherwise look for contrib/lisp/htmlize.el in the main Emacs directory.
With htmlize.el loaded, exporting:
,============
| #+begin_src python :results output :exports both
| print "Pi = ", 355/113.0
| #+end_src python
`============
Results in the src block having the src and src-python CSS tags:
,============
|<pre class="src src-python">
|<span style="color: #a020f0;">print</span>
|<span style="color: #8b2252;">"Pi ="</span>, 355/113.0
|</pre>
|
|
|<pre class="example">
| Pi = 3.14159292035
|</pre>
`============
with an automatically added little "Python" flag box on the Python src block.
Some custom CSS can be used to make the src and output a little more distinct. A
simple way is it place these lines at the top of the file:
#+style:<style> pre.src {background-color: #DDFFFF;}</style>
#+style:<style> .example {background-color: #FFFFCC;}</style>
However, you have to be consistent about using #+begin_src blocks rather than
just a colon or using begin_example at the beginning of lines for src fragments
that don't output anything, otherwise Python src they'll come out with the
output colouring. The keyboard shortcut (< s tab) for getting a
#+begin_src---#+end_src block is handy here.
Although the example above relates to #+begin_src python blocks, the fix should
work with other languages.
Cheers and thanks
Giovanni
======================================================================
Dr Giovanni Moretti | School of Engineering and Advanced Technology
Senior Lecturer | Massey University, Palmerston North, New Zealand
Computer Science | Ph +64-6-3505799x2474 Fax +64-6-3502259 - ZL2GX
======================================================================
http://seat.massey.ac.nz/moretti G.Moretti@massey.ac.nz
^ permalink raw reply [flat|nested] 3+ messages in thread
end of thread, other threads:[~2012-02-20 0:12 UTC | newest]
Thread overview: 3+ messages (download: mbox.gz / follow: Atom feed)
-- links below jump to the message on this page --
2012-02-13 4:04 How to activate pre.src in org-babel html output? Can only get class=example Giovanni Moretti
2012-02-18 15:03 ` Eric Schulte
2012-02-20 0:12 ` Giovanni Moretti
Code repositories for project(s) associated with this public inbox
https://git.savannah.gnu.org/cgit/emacs/org-mode.git
This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox;
as well as URLs for read-only IMAP folder(s) and NNTP newsgroup(s).