Design

If you go into the Customizer under the Typography tab you can find settings to alter heading styles (h2, h3, h4, h5, etc). These settings have been coded to only…

The Total Theme includes a Color Palette functionality to make it easier to define a set color scheme so you can easily control your site colors globally. To define your…

The Total theme includes a CSS Framework with utility classes that you can use throughout your site and custom code, this makes it super easy to do things such as…

Skip to video guide Creating custom cards for your post entries has never been easier! The Total theme includes the ability to create custom cards right via the WP admin…

By default the Total theme's link color is the same as the accent color (blue) and links are only underlined on hover. However, you can easily alter the default link…

In Total 5.6.0 we added the ability to create an ajax filter for the Post Cards element via the Navigation Bar element. This will allow you to display categories or…

This theme includes a few Ajax functions such as the Ajax Filter, load more button and infinite scroll pagination. By default when loading new items the theme displays the default…

If you are working on a dynamic template or custom card you may want to display the post featured image as a background for a row or column. A great…

By default the Total theme uses the system UI stack for the site font which is the fastest font because it will use the native font of the visitors computer/device…

As you may be aware the Total theme includes a CSS utility framework which is used for the majority of the theme's styling to keep the code as slim and…

By default the Total theme uses a 600 font weight for all bold text on the site which is slightly lighter then the default 700 value used for "bold" fonts…

In some cases you may want to display a grid of posts but rather then linking to the posts you want to display the post content on the same page…

By default when a word is too long inside of a heading the word will break onto the next line. This is done to prevent the text from overflowing on…

In the Total theme you can easily customize your link styles. You can easily alter the default color, underline, underline offset and underline thickness of your site links. Simply go…

When creating custom cards you may want to have elements hidden by default and revealed on hover. This is possible using built-in utility classes. Simply add the classname wpex-card-hover-reveal to…

The Total theme includes preset fluid font sizes which can be used via utility classes or via certain settings in the Customizer or builder elements. It's recommended to use these…

Total includes a custom dark mode functionality built-in that allows you to have a light and dark version of your site. This functionality is disabled by default because it requires…

When building a website, it’s easy to be drawn to visual flair, including hover animations, scroll-triggered parallax effects, loading transitions, and other "wow" features. They look great in demos, and…