Patchby PixelGrade

Header Area

The header area in Patch is comprised of several areas: the title and tagline, the main navigation menu, the social menu and, for the single-post view, a widget area.

patch-docs-header

Site Title

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

Custom Logo

Patch supports a Site Logo, which you can upload under Appearance → Customize → Site Identity. We recommend a graphic around 200px high to avoid over-stretching the header area and losing valuable screen space. The width is limited to about 330px.

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 Appearance → 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

Under the Primary Menu area, Patch features an area for showing off your social media presence with a Social Links Menu.

Patch 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 then end, which opens a full-screen search form. You can hide the search icon by checking the “Hide search button in Social Menu” checkbox from Appearance → Customize→ Theme.

Typography Styles

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

Intro Text

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

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

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

Drop caps

Add 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.

Pull Left

Use the “pull-left” class to pull an important paragraph outside of the content area, on the left side:

<p class="pull-left">This content will be pulled to the left.</p>

Pull Right

Use the “pull-right” class to pull an important paragraph outside of the content area, on the right side:

<p class="pull-right">This content will be pulled to the right.</p>

Two Columns

To split the text into a two-column layout, wrap it in a div tag with the “twocolumns” CSS class:

<p class="twocolumn">Small columns of text are easier to read.</p>

Post Formats

Patch takes full advantage of Post Formats by letting you set a certain post’s focus on either a video, gallery, or image.

Patch Post Formats

Patch includes the following post formats:

Standard Post

On the blog and archives, standard posts display the title, featured image, excerpt, date, and categories. The author is also displayed if there’s more than one author on a site; in single post view the author is always displayed.

Quote Post

If you assign a featured image to your post, Patch displays it behind your quote; if not, a black background is used.

To add an author to the quote, wrap it in a <cite>Author Name</cite> tag and place it inside the <blockquote> using the Text/HTML editor mode.

Gallery Post

The gallery post format is similar to standard posts, except that the featured image is replaced with the first gallery image found in the post content. Learn more about working with Galleries and Slideshows.

Image Post

By assigning this post format to your post, you are telling us to treat it as if it only holds a single image. If it has a featured image, Patch will display that. If not, the theme will search for the first image in your post’s content and use that.

Video/Audio Post

This post format uses the first video or audio embed it finds in your article content, instead of the featured image. It can be a URL on a single line or a full embed.

Featured Images

Patch uses the Featured Images assigned to your posts to bring forth the character of the post, by taking into account the featured image’s aspect ratio and deciding upon it the relationship of the image with the title, excerpt and the rest of the homepage (whitespace mainly).

Widgets & Sidebars

Patch features one widget area displayed under the main navigation menu, displayed only on single posts. You can leave the sidebar empty if you are after a cleaner, bolder look, or you can control where you want certain widgets to appear – on archive, single post, etc. – by adjusting Widget Visibility.