emacs-orgmode
[Top][All Lists]
Advanced

[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

Re: [Orgmode] Change color in fontified html export for strings


From: Rainer M Krug
Subject: Re: [Orgmode] Change color in fontified html export for strings
Date: Tue, 14 Sep 2010 10:05:32 +0200
User-agent: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.2.10pre) Gecko/20100911 Lightning/1.0b2 Shredder/3.1.5pre

-----BEGIN PGP SIGNED MESSAGE-----
Hash: SHA1

On 14/09/10 09:41, Eric S Fraga wrote:
> On Tue, 14 Sep 2010 09:11:07 +0200, Rainer M Krug <address@hidden> wrote:
>>
>> -----BEGIN PGP SIGNED MESSAGE-----
>> Hash: SHA1
>>
>> On 14/09/10 02:36, Sebastian Rose wrote:
>>> Rainer M Krug <address@hidden> writes:
>>>> Hi
>>>>
>>>> when exporting code blocks to html, strings are exported as yellow
>>>> (#ffff00), which is really difficult to read. Is there a possibility to
>>>> customize the colors (specifically the one used for strings) used for
>>>> the fontification when exporting to html?
>>>>
>>>> Thanks,
>>>>
>>>> Rainer
>>>
>>>
>> Hi Sebastian,
>>
>>> Change the CSS styles for strings using a stylesheet. 
>>
>> I must admit, I know nerly nothing about html, and even less about CSS
>> stylesheets. So what do I have o do with the code you gave below?
>>
>> I found the following statement in the org manual:
>>
>> ####
>> To set the latter variable individually for each file, you can
>> use
>> #+STYLE: <link rel="stylesheet" type="text/css" href="stylesheet.css" />
>> For longer style definitions, you can use several such lines. You could
>> also directly write a
>> <style> </style> section in this way, without referring to an external file.
>> ###
>>
>> As I only want to change the color for .string (right?), I am thinking
>> about specifying it in the properties - but
>>
>> #+STYLE: <style> .string {color: #ff4500;}</style>
>>
>> failed.
>>
>> Any suggestions or CSS stylesheets?
> 
> Did you C-c C-c after adding that line so that org setup is reset?  

Yes

> Is there actually any HTML code in the exported file that has the
> sequence
> 
> : <XXX class="string">
> 
> where XXX might be SPAN or DIV?  That is, is there any HTML code that
> is actually using the string class?  Maybe try a very small example
> and post the html file that results?
> 

The string

<style> .string {color: #ff4500;}</style>

is in the html file, but it is not used - the color is hardcoded as
#ffff00:

<span style="color: #ffff00;">"seed"</span>

Here is an example .org file:

- ---------------------------
#+STYLE: <style> .string {color: #ff4500;}</style>
* Results
#+begin_src R :exports code
    plot(
         res,
         stages=c(
           "flower",
           "parFlower",
           "gall",
           "midgeAdult",
           "grePod",
           "weavilAdult",
           "seed"
           ),
         plot.type="multiple"
         )
#+end_src
- ---------------------------

and the resulting html file:

- ---------------------------
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
               "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
<html xmlns="http://www.w3.org/1999/xhtml";
lang="en" xml:lang="en">
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1"/>
<meta name="generator" content="Org-mode"/>
<meta name="generated" content="2010-09-14 10:00:53 CEST"/>
<meta name="author" content="Rainer M Krug"/>
<meta name="description" content=""/>
<meta name="keywords" content=""/>
<style type="text/css">
 <!--/*--><![CDATA[/*><!--*/
  html { font-family: Times, serif; font-size: 12pt; }
  .title  { text-align: center; }
  .todo   { color: red; }
  .done   { color: green; }
  .tag    { background-color: #add8e6; font-weight:normal }
  .target { }
  .timestamp { color: #bebebe; }
  .timestamp-kwd { color: #5f9ea0; }
  p.verse { margin-left: 3% }
  pre {
        border: 1pt solid #AEBDCC;
        background-color: #F3F5F7;
        padding: 5pt;
        font-family: courier, monospace;
        font-size: 90%;
        overflow:auto;
  }
  table { border-collapse: collapse; }
  td, th { vertical-align: top; }
  dt { font-weight: bold; }
  div.figure { padding: 0.5em; }
  div.figure p { text-align: center; }
  textarea { overflow-x: auto; }
  .linenr { font-size:smaller }
  .code-highlighted {background-color:#ffff00;}
  .org-info-js_info-navigation { border-style:none; }
  #org-info-js_console-label { font-size:10px; font-weight:bold;
                               white-space:nowrap; }
  .org-info-js_search-highlight {background-color:#ffff00; color:#000000;
                                 font-weight:bold; }
  /*]]>*/-->
</style>
<style> .string {color: #ff4500;}</style>
<script type="text/javascript">
<!--/*--><![CDATA[/*><!--*/
 function CodeHighlightOn(elem, id)
 {
   var target = document.getElementById(id);
   if(null != target) {
     elem.cacheClassElem = elem.className;
     elem.cacheClassTarget = target.className;
     target.className = "code-highlighted";
     elem.className   = "code-highlighted";
   }
 }
 function CodeHighlightOff(elem, id)
 {
   var target = document.getElementById(id);
   if(elem.cacheClassElem)
     elem.className = elem.cacheClassElem;
   if(elem.cacheClassTarget)
     target.className = elem.cacheClassTarget;
 }
/*]]>*///-->
</script>

</head>
<body>
<div id="content">

<h1 class="title">test</h1>


<div id="table-of-contents">
<h2>Table of Contents</h2>
<div id="text-table-of-contents">
<ul>
<li><a href="#sec-1">1 Results </a></li>
</ul>
</div>
</div>

<div id="outline-container-1" class="outline-2">
<h2 id="sec-1"><span class="section-number-2">1</span> Results </h2>
<div class="outline-text-2" id="text-1">




<pre class="src src-R"><span style="color: #4186be;">plot</span>(
     res,
     <span style="color: #00ff00;">stages</span>=<span style="color:
#4186be;">c</span>(
       <span style="color: #ffff00;">"flower"</span>,
       <span style="color: #ffff00;">"parFlower"</span>,
       <span style="color: #ffff00;">"gall"</span>,
       <span style="color: #ffff00;">"midgeAdult"</span>,
       <span style="color: #ffff00;">"grePod"</span>,
       <span style="color: #ffff00;">"weavilAdult"</span>,
       <span style="color: #ffff00;">"seed"</span>
       ),
     <span style="color: #00ff00;">plot.type</span>=<span style="color:
#ffff00;">"multiple"</span>
     )
</pre>




</div>
</div>
<div id="postamble">
<p class="author"> Author: Rainer M Krug
</p>
<p class="date"> Date: 2010-09-14 10:00:53 CEST</p>
<p class="creator">HTML generated by org-mode 7.01trans in emacs 23</p>
</div>
</div>
</body>
</html>
- ---------------------------

The question is: how can I change the  "color: #ffff00;" for the
strings, e.g. in

<span style="color: #ffff00;">"seed"</span>

to any other color?

Cheers,

Rainer



- -- 
Rainer M. Krug, PhD (Conservation Ecology, SUN), MSc (Conservation
Biology, UCT), Dipl. Phys. (Germany)

Centre of Excellence for Invasion Biology
Natural Sciences Building
Office Suite 2039
Stellenbosch University
Main Campus, Merriman Avenue
Stellenbosch
South Africa

Tel:        +33 - (0)9 53 10 27 44
Cell:       +27 - (0)8 39 47 90 42
Fax (SA):   +27 - (0)8 65 16 27 82
Fax (D) :   +49 - (0)3 21 21 25 22 44
Fax (FR):   +33 - (0)9 58 10 27 44
email:      address@hidden

Skype:      RMkrug
-----BEGIN PGP SIGNATURE-----
Version: GnuPG v1.4.10 (GNU/Linux)
Comment: Using GnuPG with Mozilla - http://enigmail.mozdev.org/

iEUEARECAAYFAkyPLMsACgkQoYgNqgF2egrl4wCggKSb2hmp9le670Iu3qom0Mr+
IwIAmIFX19NAzm8PL6Kenkq1C2yqSEI=
=Pg9t
-----END PGP SIGNATURE-----



reply via email to

[Prev in Thread] Current Thread [Next in Thread]