Jasonby PixelGrade

Header Area

The header area in Jason is comprised of several areas: the menu bar (the social icons and the main menu), the title, the tagline and an optional custom logo. The site title, tagline and logo are horizontally centered.

jason-docs-header

Site Title

To change your site title and tagline, go to Customize → Site Identity and set them both to your liking.

Site Title Styling

Jason styles your site title and tagline in a fun way, to add some flair to your header area.

Custom Logo

Jason supports a Site Logo, which you can upload under Customize → Site Identity. The width is limited to the content width, a maximum of 1510px.

Menu

After you create a custom menu, assign it to the Primary Menu location either from the same page — the Menu Settings section below your menu items — or by going to Customize → Menu and selecting your main menu from the dropdown list.

The header menu supports sub-menus, allowing you to better categorize your navigation links.

Social Icons

In the top header area, Jason features an area for showing off your social media presence with a Social Links Menu.

Jason supports the following social services: Email, RSS Feeds (links with “feed” or “rss”), Behance, Delicious, DeviantArt, Digg, Dribbble, Facebook, Flickr, FourSquare, GitHub, Google+, Instagram, LinkedIn, Pinterest, Reddit, Skype, SoundCloud, Spotify, StumbleUpon, Tumblr, Twitter, Vimeo, Vine, VKontakte, Sina Weibo, Xing, Yahoo, AngelList, Yelp, LastFM, SlideShare, Twitch, BlogLovin, Medium, WhatsApp, LeanPub, and RenRen.

The Search Button

If you create a social links menu, we will automatically add a search icon at the end, which opens a full-screen search form. You can hide the search icon by checking the “Hide search button in Social Menu” checkbox in Customize→ Theme Options.

Post Title Styling

Jason includes optional color treatments for post titles:

jason-post-titles

The Auto-style post titles feature uses a series of rules based on your title’s punctuation marks and letter case. At the moment these include:

  • Everything after a colon (:) is underlined.
  • Words preceded by an exclamation mark (!) are colored.
  • Everything in quotes is colored.
  • In a title that includes a question mark (?), every word to the right of the question mark is colored. This style only applies if there is a single question mark in the title.

This feature is available both in archives — including the homepage — and in single-post views. This feature will not modify your titles, it will only affect their visual style.

If you’d prefer not to use this feature, deactivate it by going to the Customize → Theme Options tab, and checking the Disable auto-style post titles checkbox.

Typography Styles

Jason offers a series of custom styles, which you can view on the style guide page of the demo.

Intro Text
jason-type-intro

Add an introductory larger-size text by wrapping a paragraph in a p tag with the “intro” CSS class:

<p class="intro">Larger text will usually be read before.</p>

Highlight Text

jason-type-highlight

To highlight text, wrap it in a span tag with the “highlight” class:

An example of <span class="highlight">highlighted</span> text.

Drop caps

jason-type-dropcapAdd drop caps by wrapping the first letter of the first word in a span tag with the “dropcap” CSS class:

<span class="dropcap">F</span>irst letter.

Two Columns

jason-type-twocol

To split the text into a two-column layout, wrap it in a div or p tag with the “twocolumn” CSS class.

<p class="twocolumn">Two column content inside.</p>

Featured Images

Jason uses the Featured Images assigned to your posts for the Related Posts area and various widgets. It doesn’t display the featured image on the home page (because the full post content is displayed) or single post view.

Widgets & Sidebars

Jason features one widget area in the right sidebar. You can leave the sidebar empty if you are after a cleaner, bolder, full-width look, or you can control where you want certain widgets to appear – on the front page, archive page, single posts, etc. – by adjusting Widget Visibility.

Custom Colors

By default, Jason has a bold color scheme. If you would like to use your own custom color palette, you will need the Premium or Business plan.

Custom Fonts

Jason uses the Libre Caslon Text font family for headings and the Source Sans Pro font family as body font. If you would like to use your own custom web fonts you will need the Premium or Business plans to access a wide variety of font choices, personalizing Jason even more. Alternatively, you may choose from any of the free Google fonts available to all WordPress.com users.