Getting Started

After activating Obsidian, you can jump in and start customizing your theme right away by going to Appearance → Customize. You’ll find options for adding a logo, changing the background, assigning Custom Menus, front-page settings, and managing the site-wide audio player.

Detailed instructions for working with the theme’s unique features are included below. If you run into any issues or have a question, you can find more help in the following places:

• Check out the Help tab at the top right of each screen in your dashboard.
• Search the general support documentation.
• Search, browse, or ask a question in the premium support forum for Obsidian.

Site Logo

Your site’s title will be displayed in the header area of Obsidian. You can easily replace this text with your own logo or custom image in the Customizer:

1. Go to Appearance → Customize.
2. Click the Site Title section to expand it.
3. Upload a new image in the Logo field.

Homepage Setup

Your homepage is typically one of the first pages most visitors see when browsing your site. While your homepage shows a list of your latest posts by default, Obsidian also allows you to select a static page to display.

Read the instructions for Setting up a Static Front Page if you’d prefer to use a Page for your homepage. You’ll also want to create a page for displaying your latest blog posts.

Now when visiting that page on your site, it will display a list of your latest posts. Be sure to add it to your Primary Menu so your visitors can easily find it.

Additionally, customize the homepage further by adding widgets to the homepage widget area (not shown in demo).

Site-Wide Audio Player

Highlighting a few choice tracks is possible with Obsidian’s site-wide audio player. To use this feature, you will need the WordPress.com Premium or Business plan.

Here’s how to enable the audio player:

1. Go to Appearance → Customize.
2. Click the Theme Options section to expand it.
3. Click the Edit Playlist button under the “Player Attachment IDs” heading.
4. Select previously uploaded audio MP3 files or upload new files.
5. Click the blue Add to audio playlist button.
6. Click the blue Update audio playlist button.

This will add the Attachment IDs for each audio file to the Customizer setting. You should now see an audio player similar to the one shown in the theme demo.

Gigs / Tour Page

The events displayed on the Tour page in the theme demo uses a full width page template and some custom HTML code. Below is an example of the HTML code used in which you can modify to your own needs; some basic HTML knowledge is needed.

<table class="responsive-table">
	<thead>
		<tr>
			<td style="width:200px;"><strong>Date</strong></td>
			<td><strong>Location</strong></td>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>January 10, 2016</td>
			<td><strong>Denver, CO</strong> / The Soiled Dove Underground <a class="alignright" href="http://ticketmaster.com">Tickets</a></td>
		</tr>
		<tr>
			<td>February 20, 2016</td>
			<td><strong>Nashville, TN</strong> / The Bluebird Cafe <a class="alignright" href="http://ticketmaster.com">Tickets</a></td>
		</tr>
	</tbody>
</table>

Records

Obsidian includes special functionality that allows you to add records to your site and display them in a visually appealing grid. Here’s how they look in the demo.

To begin adding your records, you first need to set up the Record Archive:

1. Go to Pages → Add New.
2. Give the page a title (we used “Music” in the demo).
3. Find the Page Attributes box and select the “Record Archive” option in the Template field.
4. Click the Publish button to create and save the page.

You can optionally enter a short introduction in the main content editor. Now that your archive is set up, you can start adding records:

1. Go to Pages → Add New.
2. Enter the title of the record.
3. Set the record’s cover art as the Featured Image.
4. Change the Published date to the date the record was released.
5. Find the Page Attributes box and change the Parent to the page you created as the Record Archive (this is important).
6. Click the Publish button to create and save the page.

Now when you visit your Record Archive page, you should see your first record listed. Continue adding records by following the same steps. Always be sure to set the “Parent” page as the Record Archive page.

01. Record Artwork

Set the record’s cover art as the Featured Image.

02. Record Release Year

The record release year displayed on single record pages below the record title uses the page’s published date. The year the page was published, will be the year shown as the release year. With that in mind, it’s a good idea to set the publish date for single record pages to be the date the record was released. This will also display the records on the Record Archive page in order of date released, with the newest record displayed first.

03. Record Links

You’ll notice in the theme demo, we display purchase links below the record artwork. These links, and any additional content, can be inserted by adding a custom excerpt.

To create the button style links, you’ll need to know some basic HTML to add a special button class using the HTML/Text editor. Here is an example of the record details and purchase links used in the theme demo.

<a class="button" href="https://www.apple.com/itunes/">iTunes</a> <a class="button" href="https://www.spotify.com/us/">Spotify</a>

You can use the example code above to get started. Change the button link text and href attribute to your own info.

04. Record Playlist

You can insert a Playlist in the editor for each record to list its tracks and allow your visitors to preview your music. (You will need the Premium or Business plan to use this feature). You can also enter additional details about your record, such as a description or links to reviews.

Enabling Excerpts

To view the Custom Excerpts metabox, you’ll need to make sure they are enabled first.

1. When viewing your site, go to My Sites in the top left of the Admin Bar.
2. Go to WP Admin.
3. Go to Pages.
4. Choose a page (any page).
5. Click on the white “Screen Options” tab in the top right corner.
6. Check the “Excerpt” checkbox.

You should now see a the Excerpt metabox below the content editor for all pages in the old Admin UI. The newer admin UI doesn’t show the excerpts yet and WP.com is aware of the issue.

Videos

Obsidian includes special functionality that allows you to add videos to your site and display them in a visually appealing grid. Here’s how they look in the demo.

To begin adding your videos, you first need to set up the Video Archive:

1. Go to Pages → Add New.
2. Give the page a title (we used “Videos” in the demo).
3. Find the Page Attributes box and select the “Video Archive” option in the Template field.
4. Click the Publish button to create and save the page.

You have the option to enter a short introduction in the main content editor. Now that your archive is set up, you can start adding videos:

1. Go to Pages → Add New.
2. Enter the title of the video.
3. Enter a URL to the video from a supported service in the main content editor.
4. Set a screenshot of the video as the Featured Image. Video thumbnails are displayed in a 16:9 aspect ratio and will be cropped from the top down.
5. Find the Page Attributes box and change the Parent to the page you created as the Video Archive (this is important).
6. Click the Publish button to create and save the page.

Now when you visit your Video Archive page, you should see your first video listed. Continue adding videos by following the same steps; always be sure to set the Parent page as the Video Archive page.

Photos

Create a new page for your photos and insert a Gallery to display them.

Custom Menus

Custom Menus provide granular control over the links that appear in the various navigation areas on your site. Obsidian supports two menu locations: the Primary Menu navigation and the Social Menu (the social icons at the bottom of each page).

You can create and assign menus by going to Appearance → Menus.

Social Menu

The Social Menu allows you to display links to your social media profiles, such as Twitter and Facebook, as icons. Each menu item should be added as a Custom Link. Obsidian will automatically display the correct icon based on the link URL. For example, a link like http://twitter.com/audiotheme will display a Twitter icon because the theme has detected it is a Twitter URL.

The following icons are bundled in Obsidian for use in your Social Menu: Amazon, Apple/iTunes, Bandcamp, Facebook, Flickr, Google Play, Google+, Instagram, Last.fm, LinkedIn, Pinterest, Rdio, ReverbNation, SoundCloud, Spotify, Tumblr, Twitter, Vimeo, WordPress, and YouTube.

Widgets

Obsidian features three widget areas.

Home Widgets

The home widgets area will only show on the front page of your site and are displayed in a three-column grid.

Main Sidebar

The Main Sidebar appears on the right side of posts and any pages using the default page template.

Footer Widgets

The Footer widget area is located at the bottom of every page on the site, just above the credits — or the Social Menu if it’s been enabled. Any widgets added to this area will display in a three-column grid.

Featured Images

Posts and Pages can be assigned a Featured Image to display below the title as a banner image. See the Bio page in the theme demo as an example.

Featured Images are displayed in full size, so it’s important to optimize or resize the images before uploading them to reduce image file size and improve page load speed. The content width on most pages is 720px wide, however, full width pages are 1100px wide.

Theme Options

More theme-specific options can be found in the Theme section of the Customizer.

Custom Background Opacity

Add a custom background color and image to your site to give it a distinct look.

Adjusting the color opacity of your background allows you to control contrast and optimize the legibility of your content. To do this, look for the Background Image Opacity slider setting toward the bottom of the custom background image settings.

Full-Width Background Images

The option to display the background image as a full-screen image can be found at the bottom of the custom background image settings in the Customizer.

Archive View

The Archive View setting offers more control over how the content on archive pages of your site appears. It can be found in the Theme section of the Customizer.

Content for standard posts won’t show on archive pages unless a custom Excerpt has been saved. Content for other Post Formats will always show.

The “Full Text” option will display the post content in full. The post content may still be truncated using the More Tag.

The “Summary” option will display an excerpt of the content. WordPress will create an automatically generated excerpt from the post content. Alternatively, a custom excerpt can be created using the Excerpts module.