How to Make Featured Sidebar Widget in the GeneratePress Theme

Are you looking for how to make a featured sidebar widget in your WordPress website built with the GeneratePress theme?

So in this article, I will show you how to make a custom featured sidebar widget for your WordPress website built with the GeneratePress theme.

GeneratePress is one of the popular lightweight WordPress themes. The main focus of the theme is speed, stability, and accessibility.

It is fully compatible with all major page builders, including Beaver Builder and Elementor. The good news is that I’m also using the GeneratePress theme for my WordPress websites.

Importance of Featured Sidebar Widget

Sometimes you want to highlight a product, page, or membership form in the sidebar of your website so that the sidebar widget can attract more attention from your users.

So this way, you can get more subscribers, sales, page views, and conversions on your website with the help of the featured widget.

Below are some points to understand the importance of the featured sidebar widget.

• The featured sidebar widget helps you to highlight anything on your website.
• It helps to attract the attention of the user.
• It helps in getting more conversions and sales on the page and products.
• The featured sidebar widget is the best place to display your product.

Now let’s start making the featured sidebar widgets for your WordPress website.

Make Featured Sidebar Widget in GeneratePress Using CSS

You can make a featured sidebar widget on your website by simply putting in some CSS code.

To add a CSS code to your website, go to Appearance – Customize and click on the Additional CSS area.

Now add the following code to this field.

/* Featured widget */
.sidebar .widget:first-child,
.sidebar .widget:first-child .widget-title {
	background-color: #353535;
	color: #cccccc;
}
.sidebar .widget:first-child a,
.sidebar .widget:first-child a:hover {
	color: #ffffff;
}

You can change the background color and color #hexcode as per your choice.

If you want to make a second featured sidebar widget on your website, add the following code as well.

.sidebar .widget:nth-child(2), .sidebar .widget:nth-child(2).widget-title {
    background-color: #000000;
    color: #ffffff;
}

You can change the background color and color #hexcode depending on what color you want to use.

:nth-child(2) means that you’re targeting the second sidebar widget.

Also, learn how to make the last sidebar widget sticky on your WordPress website.

If you have just installed WordPress on your hosting dashboard, here are the most useful WordPress settings you need to do after installing WordPress.

You can also use the Simple CSS plugin to add your own additional CSS code to your website.

So this is the complete process to make a featured sidebar widget in the GeneratePress theme.

I hope this tutorial helps you learn how to make the featured sidebar widget in the GeneratePress theme.

If you liked this article, please show your love by sharing it on your favorite social media channel and also send your thoughts in the comment section.

I love your comments. It makes me more precise to give you the best WordPress resources and guides.

You can follow WPSettingbox on Twitter and Facebook to get fresh and updated content.