Editing Blogs

When you do a page or post, you probably use the “Visual” tab, which presents an array of options for formatting text. It’s also possible to click on the “HTML” tab and manually insert code.

The system recognizes standard paragraphs automatically, and with the defaults I set up should format them as “justified’ and with 8pt of space before the next paragraph. I’ve also set up several other formats.

The general modifier is of the form <p class=”class name“> at the start of a paragraph and </p> at the end.

Site-specific formats (created by the prof):

  • for quotations (indented right and left): <p class=”cite”>
  • for a double (right-and-left) indent if the above does not work use <div class=”dblin”> with a (mandatory) closing tag </div>
  • for hanging indents (bibliographies): <p class=”hi”>
  • for your by-line (right alignment): <p class=”right”>
  • for a callout – larger, reddish, on right: <p class =”callout”> (if it doesn’t work use “div” instead of “p”)
  • for an in-line comment (smaller green font) use <span class=”note”> …your text.. </span>. [put in brackets for better readability; unlike with a paragraph tag, with <span> the closing </span> tag is crucial!]
  • for a small-font paragraph: <p class =”psmall”>
  • for a superscript note use <sup class=”note”> with a (mandatory) closing tag </sup> and similarly for a subscript use <sub>

You can also use options not shown. Here’s an example example that changes the font, the font size and the font color with the <span>text to change</span> tag pairing. The closing tag is mandatory. As an example, <span style=”font-size: 85%; color: #DF3A01; font-family: serif, ‘Times New Roman’;”> gives this sort of text</span>. WordPress is picky, if you leave out the closing quote mark, strange things happen.

I go HERE for help with a color palette and associated codes; for references on codes more generally I go to HTML Dog (more complete, though some code is not recognized in this WordPress theme) and more helpful for a learner HTML Code Tutorial (which emphasizes good practice in doing hard coding, useful for doing a simple tweak). Again, not everything works as these guides suggest in this WordPress implementation, because the theme sets parameters that you may not be able to [readily] override.

Examples: in the order of the list above

This is the text when you use the paragraph “cite” tag. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Here I use the “hi” hanging indent class. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

The same “hi” hanging indent using “div”. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

This is the “rt” class for signatures.

And the “in” for an indented paragraph. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

This is a “callout” which is great when you have a one-liner to emphasize.

And this one is small. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation

An inline note using the <span> “note” tag: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor but you must use </span> at the end to turn off the formatting.

Double indent using the “div” tag. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,

And to set up a note you can use the <sup> tagNote! with the mandatory closing </sup> at the end.

I find the two following outside sources useful: