There are two ways to customize the look of your Stream: You can use Simple mode, which allows you to make design changes with a simple interface, or you can use Hardcore mode, which allows you to edit the raw CSS of the Stream. If you don’t know much about CSS, this second method might be a little overwhelming. If you do know CSS, welcome to Hardcore Mode.

The CSS and markup will vary depending on which theme you are using. Embeddable themes will have less CSS selectors because they are only styling the Stream itself, while full-page themes include selectors and styles for the entire page. Making changes to certain properties such as font sizes or background colors can be relatively simple, but sometimes it’s hard to know which selector you will need to make changes to.

More about embeddable and full-page themes.

Here's what the Hardcore mode window looks like:

And here’s an in-depth explanation of all the CSS selectors found in Hardcore mode, starting with a list of their hierarchies:

.sdrive-stream-site-title

This is a class that defines the properties of the title of the Stream. It’s most likely the uppermost text of your Stream, though it’s found in Full Page themes only.

.sdrive-stream-site-tagline

This class holds the properties for the tagline of the Stream. This is the short sentence directly below the title in Full Page themes.

.sdrive-stream-home

This class contains values that relate to the link to the Stream’s home page, where your most recent posts are found.

.sdrive-stream-container

This is the main container which holds all of the posts and post-related content. You can think of it like the main column of the page, defining a space where you will find other classes that define values for more specific post elements.

.sdrive-stream-post-container

This class defines the space where the components of an individual post will be found. The definitions contained here describe the basic overview of each post. This element contains four classes within it that define the individual components of each post.

.sdrive-stream-post-datetime

These definitions describe the styling for the date or timestamp of the post, found in the header of each post.

.sdrive-stream-post-contents

There is a lot of information that goes into this class, and it is referenced many times within the CSS file shown in Hardcore mode. Definitions given for this class define the box that holds a post: The title, the content, and any attachments (pictures, etc.)

.sdrive-stream-post-title

This class defines the style of the title given for each post.

.sdrive-stream-post-attachments

This class defines the style attributed to images or other attachments, if there are any.

.sdrive-stream-post-pagination

This is a class which defines an element that contains everything related to pagination — the navigational buttons found at the bottom of each page. This class may not exist unless Show Pagination is enabled in the Settings tab of the Stream Customizer.

.sdrive-stream-post-first_page

Defines the styling of the link to the first page of a paginated list.

.sdrive-stream-post-previous_page

Defines the styling of the link to the previous page of a paginated list.

.current_page

This class defines the styling for the current page number, which is highlighted in the navigational links at the bottom of the Stream.

.sdrive-stream-post-page_X

Defines the styling of a page number, where X represents the page number.

.sdrive-stream-post-next_page

Defines the styling of the link to the next page of a paginated list.

.sdrive-stream-post-last_page

Defines the styling of the link to the last page of a paginated list.