How to get restructuredText to add a class to every html <p> tag?

Question

I'm using Django's markup package to transform restructuredText into html. Is there a way to customize the HTML writer to add a class attribute to each <p> tag?

I could use the class directive for each paragraph, but I'd like to automate this process.

For example, I want this restructured text:

hello
=====

A paragraph of text.

To be converted to this html.

<h1>hello</h1>
<p class="specialClass">A paragraph of text.</p>

The reason I want to insert classes is because I'm using the hyphenator library which works by adding hyphens to all tags with a "hyphenate" class. I could add the hyphenate class to the container tag, but then all the children would inherit the hyphenate class. I could use javascript to dynamically add the class, but I thought there might be a simple way to do it with restructuredText.

Thanks for the help,

Joe

Answer 1

Subclass the built-in html4css1 writer, using this as a reference..

from docutils.writers import html4css1

class MyHTMLWriter(html4css1.Writer):
  """
  This docutils writer will use the MyHTMLTranslator class below.
  """
  def __init__(self):
      html4css1.Writer.__init__(self)
      self.translator_class = MyHTMLTranslator

class MyHTMLTranslator(html4css1.HTMLTranslator):
  def visit_paragraph(self, node):
      self.section_level += 1
      self.body.append(self.starttag(node, 'p', CLASS='specialClass'))
  def depart_paragraph(self, node):
      self.section_level -= 1
      self.body.append('</p>\n')

Then use it like this:

from docutils.core import publish_string
print publish_string("*This* is the input text", writer=MyHTMLWriter())

Answer 2

You don't say why you want to add a class to every paragraph, but it might be easier to take a different approach. For example, if you are trying to style the paragraphs, you can use a different CSS technique to select all the paragraphs in the output:

CSS:

div.resttext p {
    /* all the styling you want... */
}

HTML:

<div class='resttext'>
<p>Blah</p>
<p>Bloo</p>
</div>

Update: since you are trying to use hyphenator.js, I would suggest using its selectorfunction setting to select the elements differently:

Hyphenator.config({
    selectorfunction: function () {
        /* Use jQuery to find all the REST p tags. */
        return $('div.resttext p');
        }
    });
Hyphenator.run();