Typography

This page represents typographical aspects of the “Sportal” theme. Take care about your typography to make better user experience for your readers. How to achieve that?

  • Learn more about typography, escpecially about the most often used codes, such as <p>, <h1>, <h2>, <h3>, <img> and <a>.
  • This theme has valid XHTML, but if you want to keep it like that, you must learn and follow the XHTML principles. Also, if some of your extensions are not XHTML valid, pages based on this component would not be XHTML valid as well (no matter if template itself is valid).
  • Familiarize yourself with CSS styles that comes with this theme.
  • Never copy/paste directly from layout text editors, such as Microsoft Word or OpenOffice. Try to paste text in plain editors first (such as Notepad).
  • Use a WYSIWYG editor that comes with WordPress or install a better editor, but always check your code in the editor’s HTML mode.

My mother said to me, “If you are a soldier, you will become a general. If you are a monk, you will become the Pope.” Instead, I was a painter, and became Picasso… To have a quote styled like that use “quote” class with paragraph of text, like in this sample code: <p class=”quote”>…your text here…</p>

Heading One

Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

Heading Two

Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

Heading Three

Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

Heading Four

Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

This is a warning message you may use in your text. Simply add appropriate class to your paragraphs to achieve this effect. Here’s a sample code: <p class=”warning”>…your text here…</p>. The rest of text is just filler. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat.

This is an information message you may use in your text. Simply add appropriate class to your paragraphs to achieve this effect. Here’s a sample code: <p class=”info”>…your text here…</p>. The rest of text is just filler. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat.

This is an error message you may use in your text. Simply add appropriate class to your paragraphs to achieve this effect. Here’s a sample code: <p class=”error”>…your text here…</p>. The rest of text is just filler. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat.

This is code style you may use in your text. Simply add appropriate class to your paragraphs to achieve this effect. Here’s a sample code: <p class=”code”>…your text here…</p>. The rest of text is just filler. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat.

Unordered list sample:

  • list element one
  • list element two
    • list subelement one
    • list subelement two
    • list subelement three
  • list element three
  • list element four

Ordered list sample:

  1. list element one
  2. list element two
    1. list subelement one
    2. list subelement two
    3. list subelement three
  3. list element three
  4. list element four

Check list sample:

  • to achieve this effect
  • add class “checklist” to your unordered list
  • like <ul class=”checklist”>

Arrow list sample:

  • to achieve this effect
  • add class “arrow” to your unordered list
  • like <ul class=”arrow”>

Star list sample:

  • to achieve this effect
  • add class “star” to your unordered list
  • like <ul class=”star”>

 

This is sample caption

Leave a Reply

Podolski: We're contenders for gold. Any player whose presence at the first training session of a new season prompts a… Read more
Ronaldo: Don't count us out. On the eve of his country’s South Africa 2010 bow, Portugal’s captain is quietly confident. Read more
Drogba: I'm afraid of nothing His country's captain and primary source of goals, Didier Drogba has already won his first… Read more

About Hot Carousel Pro

Hot WordPress Carousel Pro is an advanced version of our popular plugin. Led by the popularity of this plugin, we created an advanced version with many new features. In addition to the image rotation mode, we've added an option for the rotation of posts that plugin can take over from the categories.

This plugin is sold separately for $15, but if you buy Hot Sportal theme, you get it FREE!

About Hot Scroller (new!)

This plugin will create a WordPress Scroller of your posts. You can select a category of posts, or pick separate pages. This is a perfect WordPress News Ticker for all kind of news portals powered by WordPress!

It can be purchased separately ($15), but you will get it FREE with WordPress Sports Theme Hot Sporta!.

About Hot Lightbox (new!)

Hot Lightbox plugin ($15 value) allows you to include series of images from any directory on your server. This plugin automatically creates thumbnails from your images, as per given parameters. All you need to do is to select a directory with your images.

Our members or buyers of the Hot Sportal theme will get this plugin FREE!

4 in 1

That's true! With purchase of the Hot Sportal theme, you will get not the theme only, but all plugins we used to build this demo! You can copy this demo site on your server easily, just follow the HotStart instructions from the theme documentation

Hot Sportal theme, plus Hot WordPress Carousel Pro, plus Hot Scroller, plus Hot Lightbox, altogether for just $29 (or $39 including PSD)!