Working with custom Section Widgets

Home » Docs » Working with custom Section Widgets

Slope comes with 11 custom section widgets, and can be added to any Widgetized template. These widgets correspond to layout sections, and is an easy, efficient way to display the content data you want on any widgetized page, simply by dragging and dropping widgets into the related widget panels.

At your WordPress admin UI you will find those widgets with a slight highlight colour and the
Slope Section: prefix, to easily distinguish them from the default WordPress widgets.

Please avoid adding those widgets to the sidebar or footer widget areas, as this may break the layout in most cases. Remember to use them only at Widgetized pages, with widget panels starting with the
Page: Prefix.

Custom widgets overview

After creating your widgetized page as described in the earlier section, you will need to add the “Slope Section:” widgets in order to create the layout of your pages.
Each widget has a specific purpose, and comes with a set of widget-specific options.

These options may include background and typography color controls, background images and opacity, and more.

The section padding option will determine the top and bottom padding of the section and is a handy setting to consider if your layout sections have the same background color.

Slope Section: Products

This widget allows you to display a grid of products at your layout. You can choose which category to pull the products from, the number of products that will be displayed in the section, and a handy set of UI options like the section’s background color and text colors.

The section padding option will determine the top and bottom padding of the section and is a handy setting to consider if your layout sections have the same background color.

Slope Section: Posts

A powerful widget for displaying posts in any section of your layouts. Configurable options include the number of columns, two layouts to choose from, and of course efficient color options for the section.

Slope Section: Category Fold

This Section widget is a bit different than the Posts one in the way it displays the posts. Instead of displaying a grid of posts, this section’s layout focusing on an image that is related to a group of posts.

This would be a great implementation in your layout if you want to devote sections to specific categories of your published articles. You will then have the flexibility to create a more personalized and engaging section.

Slope Section: Static Content

One of our most used widgets is the Static Content section widget which will output the content of any static page, into a section of your widgetized page

The widget provides flexible options to override the default content display styles, so you can customise things like background and text color and even add a background image. This widget offers great flexibility in displaying practically any content into your layout. Just create a new page, add your desired content (contact form, video or image gallery, or anything you can imagine) and simply select the appropriate static page to be displayed.

Slope Section: Contributors

Chances are that if you are creating a magazine style blog, you will have multiple authors. With the Contributors widget you can output a grid of your blog’s authors, with a button linking to their individual pages.

The data the widget shows is dynamic and configurable at Users > Your Profile. There, apart from the basic settings like username, password etc, you can add a small description at the “Biographical” section and it will output the description at the author’s page and the widget as well.

Slope Section: Testimonials

If you have activated Jetpack testimonials, you can easily display them in this custom section widget. Simply setup the colors and section background image and/or testimonials should display in a carousel mode and sharp section.

Slope Section: Post Slider

This widget will output a post slider in your layout. You might want to use it at your homepage, and display a number of selected posts. You can either pull the posts from a specific category, or using a specific tag.

For example, you might only want to display posts that share a “featured” tag. In this case simply add a “featured” tag to these posts, and select the specific tag from the widget options.

Slope Section: Feature Callout

This widget allows for a simple text / image layout configuration with multiple alignment options. You can use this to showcase important aspects of your services / store in clear way.

Slope Section: Features

For a more summarised display of your services or features, you can use the Features widgets.

This will display a layout of image icons and a related title, text and button for each one.

To add a Feature block, simply click the “
Add Feature” button. This will trigger a box in the widget area where you need to add the related information of each feature.

Slope Section: Image Links

We created Image Links widget to create simple sections that display images and links, offering the flexibility to create entry points for different categories of your content.

For example, you might have three main categories at your blog: Excercise, Nutrition, Lifestyle. With this widget you can create a section with images that link to the related categories.

Slope Section: Call to Action

Quickly create custom Call to Action sections with the Call to Action widget. Add title, description and customise the background image, opacity and colours.

Last updated on November 8, 2023

Search docs

In this category