Skip to content
Format academic publications in HTML & CSS
Branch: master
Clone or download
thomaspark Merge pull request #17 from ahmad88me/master
fix missing tag in ieee-sample.html
Latest commit 1e4ab9d Nov 29, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist Update ieee-sample.html Nov 29, 2018
src
.gitignore Intial commit, counters are not working. need to wrap my head around it. Jun 1, 2017
.nvmrc giving counters a try... and making a rough time of it. Jun 9, 2017
LICENSE Intial commit, counters are not working. need to wrap my head around it. Jun 1, 2017
README.md fix table markup in readme Aug 9, 2018
gulpfile.js Intial commit, counters are not working. need to wrap my head around it. Jun 1, 2017
package-lock.json Intial commit, counters are not working. need to wrap my head around it. Jun 1, 2017
package.json Intial commit, counters are not working. need to wrap my head around it. Jun 1, 2017

README.md

PubCSS

PubCSS is a library of CSS stylesheets and HTML templates for formatting academic publications for print and the web.

Currently, the following formats are supported:

Check out sample output here.

Quick Start

  1. Create an HTML file, or modify the relevant template, to add your content
  2. Link your HTML to the relevant pub.css stylesheet
  3. Build to PDF using Prince with the command prince input.html output.pdf

The only dependency is Prince, which is free for non-commercial use.

Reference

Sections

Sections and subsections are automatically numbered by following this pattern.

<h1>Section Header</h1>
<section>
  <h2>Subsection Header</h2>
  <p>Lorem ipsum</p>
</section>

Tables and Figures

Figures and tables are also numbered if you include a caption.

<table>
  <tr><td>1</td><td>2</td></tr>
  <caption>Example Table</caption>
<table>

<figure>
  <img src="graph.png">
  <figcaption>Example Figure</figcaption>
</figure>

References and Citations

References are also numbered. Be sure to assign them unique IDs.

<cite id="nicole">Nicole. 2015. Title of paper. <em>Journal</em>, 4(3), 1-10.</cite>

Citations to the references make use of these IDs.

<a href="#nicole"></a>

Multiple citations can be made in one set of brackets.

<span class="cites"><a href="#beeker"></a><a href="#jackie"></a><a href="#kiwi"></a></span>

Sections, tables, and figures can also be referenced by adding a class.

<a href="#intro" class="section"></a>
<a href="#example-table" class="table"></a>
<a href="#example-figure" class="figure"></a>

Equations

Equations are also numbered. MathML is well-supported by Prince. For the web, you’ll need MathJax to render MathML properly in Chrome and Internet Explorer.

<div class="equation">
  <math xmlns="http://www.w3.org/1998/Math/MathML">
    <mi>E</mi>
    <mo>=</mo>
    <mi>m</mi>
    <msup>
      <mi>c</mi>
      <mn>2</mn>
    </msup>
  </math>
</div>

Footnotes

Footnotes are made within the body text, and are automatically moved to the bottom of the current page.

<p>This is text.<span class="footnote">And this is a footnote.</span></p>

Smart Quotes

Smart quotes can be used in lieu of straight quotes by enclosing the text like so. You can nest quotes within quotes.

<q>To be or not be.</q>

Utility Classes

Utility classes are also available to modify layout and counter behavior.

  • col-2: divide the element into 2 columns
  • col-3: divide the element into 3 columns
  • col-4: divide the element into 4 columns
  • col-span: span all of the columns of parent
  • col-break-before: force column break before element
  • col-break-after: force column break after element
  • page-break-before: force page break before element
  • page-break-after: force page break after element
  • counter-skip: do not count this header
  • counter-reset: reset counter to 0

Customization

One of the major advantages of PubCSS is that you can use CSS to customize the style. All of the usual rules apply.

To create a new theme, you’ll want to dig into the LESS source. The most common changes can be made through variables.less, such as toggling page numbers and setting counter styles. The rest can be included in custom.less.

You can’t perform that action at this time.