Skip to Content

Trellis Display Settings Overview

Everything you need to know about the Display settings in Trellis.

The Display tab in the Trellis settings will help you to adjust some of the built-in customization settings available with the framework. To find these settings, navigate to Appearance → Mediavine Trellis → Display.

This article will briefly explain each of these settings for easy reference.

Birch Variation

(Note: this setting is not available for the Bamboo or Wisteria child themes.)

This will allow you to choose the shape of your Featured Image style to either square corners or rounded corners. These settings are only for the Birch child theme. The options are as follows:

Square Design

Circle Design

Mouse_Highlight_Overlay.png (2308×256)

Header Width

(Note: this setting is not available for the Bamboo or Wisteria child themes.)

If you are using the Birch child theme, this gives you the settings needed to adjust the width of Featured Posts and Hero Images at the top of your Homepage. The three options are as follows:

Full-Width Header

Regular Header

Narrow Header

Mouse_Highlight_Overlay.png (2336×240)

Change Font Size

This will update your theme’s body font size. The body font refers to the overall text used throughout the site but does not refer to headings.

The four options for body font size are as follows:

Small (16px)

Medium (18px)

Large (20px)

X-Large (22px)

H1 Font Size

(Note: this setting is not available for the Birch or Wisteria child themes.)

This allows you to choose the size of your largest heading. The four options are as follows:

Small (24px)

Medium (36px)

Large (42px)

X-Large (56px)

Apply H1 Size to All Headings

(Note: this setting is not available for the Birch or Wisteria child themes.)

This will set your heading font sizes, (for headings H2-H6), to cascade down in size, relative to what you have selected for the H1 font size option.

Body Font

This sets the main body font that will display on the site. The body font refers to the overall paragraph text used but does not refer to headings.

A selection of Google fonts and web-safe fonts are built into Trellis. Choose a web-safe font for best performance. There is an option to add custom fonts, but this is not recommended for the sake of speed.

Heading Font

This sets the heading font on the site (H1-H6).

A selection of Google fonts and web-safe are built into Trellis Core. Choose a web-safe font for best performance. There is an option to add custom fonts, but this is not recommended for the sake of speed.

Custom Font Loading Method

This setting will appear if you select a Non-Web Safe Font. For detailed information on this setting, please refer to this help article.

Primary and Secondary Colors

Primary Color affects theme features like links, buttons, and other elements. The hover state of these elements will be determined by your Secondary color selection.

Secondary Color affects theme features like hover effects, alternate buttons, and other elements.


Enter a six-digit color hex code for each of these two settings.

Background and Accent Color

(Note: this setting is not available for the Bamboo child theme.)

This will set the background color of some page elements like page and post headers.

H1 Color

(Note: this setting is not available for the Wisteria and Birch child themes.)

This will determine the color of the H1 headings across your site. Enter a hex code value to adjust the color of all H1 headings, including those in the content. The default is #000000, or black.

Apply H1 Color to All Headings

(Note: this setting is not available for the Wisteria and Birch child themes.)

This forces the color of all sub-headings (H2 – H6) to inherit the H1 font color selection.

Post Meta Display Top and Bottom

These allow you to select which post meta to display in the post header and footer, respectively.

For the Top display, you can show the comment count, author, date, categories, and/or Yoast breadcrumbs.
​
For the Bottom display, you can show the author, date, categories, and/or Yoast breadcrumbs.


Post Meta Date Display

This setting allows you to choose either the Published Date, Modified Date, or both to display in your post meta data. For more info, please see this help article.

Site Logo

This setting will determine what image is used as your logo in the site header.

We recommend using .jpg, or .png file formats.

If a logo is not added here, Trellis will display the site title instead.

For Trellis Core, Bamboo, and Birch: Logo will display inline with the main navigation.

For Wisteria: Logo will display next to the sticky post on the homepage, and inline with the main navigation on posts and pages.

Change Logo Height

This will update the maximum logo height in the header.

The Logo Height options are as follows:

Small (50px)

Medium (75px)

Large (100px)

Extra Large (150px)


Please note: the actual logo height might be limited by the width of your logo. If the setting doesn’t appear to be changing the logo height, it might be due to the logo width being restricted to allow space for the main navigation in the header.

Display Featured Images

Trellis does not display featured images in the post by default. If you’re migrating from a theme that does this, and you think it’s beneficial to have that feature, you can enable this setting.

If checked, the featured image will be displayed before the post’s content.

Hide Featured Image From Small Screens

You can enable this option to hide featured images on posts when the user has a device with a screen width lower than 600px (e.g. Mobile). Displaying featured images to mobile devices will increase Largest Contentful Paint (LCP), one of Google’s Core Web Vitals, so you might want to enable this if that is a concern.

Featured Image Size

This setting will select which featured image crop to use on the homepage and article feed pages.

Whichever option you choose will be site-specific – experiment and decide which crop works best for your images.

  • Trellis Square: Square
  • Trellis 3×4 : Portrait
  • Trellis 4×3: Landscape
  • Trellis 16×9: Wide landscape
  • Full Size: Full resolution

We’ve added a full-resolution option here (Full Size) for publishers who do not want their images resized. If you use the Full-Size setting be sure to properly size your images prior to upload in order to ensure that your page speed scores do not suffer.

Within this setting, you will also see a button to Regenerate Featured Images. For information on when and how to use this option, please see this help article.

Hide Mediavine/Trellis Footer Links

Enabling this setting will remove the Mediavine/Trellis links in your footer.

Footer Copyright Text

You can use this field to add your own copyright text to your footer.

Enable Search Bar

Enabling this adds a search bar to the site header. The search icon will display inline with the main navigation. When clicked, the search field will display in the header.

Layout Space

This will update the space around page elements, meaning the padding and margins between objects on the page. The two options are as follows:

  • Comfortable (more space, default). Choose if you want to see more content above the fold.
  • Compact (less space). Choose if you want a little more breathing room for your content.

Enable Trellis Comments

Trellis comments are enabled by default with this setting. You can disable Trellis comments if you need to, such as for compatibility purposes when using a third-party comment tool.