In this documentation, we will discuss the customization of the BbPress Single Topic widget, brought to you by the Element Pack Pro addon for Elementor.
Enable The BbPress Single Topic Widget
To use the BbPress Single Topic widget from Element Pack Pro, first, you have to enable the widget.
Go to WordPress dashboard > Element Pack Pro Plugin dashboard.
Then, Click the 3rd Party Widgets Tab.
Search the BbPress Single Topic Widget Name.
Enable the BbPress Single Topic Widget.
Hit the Save Settings Button.
Note: To use this widget in the Elementor editor, you need to install the BbPress Plugin separately.
Inserting the BbPress Single Topic widget
Go to the Elementor Editor Page and Hit the “+” icon Button.
Search the BbPress Single Topic widget.
Drag the widget and drop it on the editor page.
Work With The Content Tab
Layout Section
Go to Content > Layout
Single Topics: You can select the topic you want to customize with this option.
Show Breadcrumb: Enable the switcher to show the breadcrumb to the audience.
(Note: To customize the topic in the editor, create a topic first from the dashboard.)
Work with The Style Tab
Breadcrumb Section
Go to Style > Breadcrumb
Color: You can change the breadcrumb text color with this option.
Hover Color: You can change the breadcrumb text’s hover color with this option.
Padding: You can adjust the inner space of the breadcrumb field with this option.
Typography: Change the font family, size, weight, transform, style, decoration, line height, letter spacing, and word spacing from here.
Header Section
Go to Style > Header
Text Color: You can change the header text color with this option.
Background Type: You can select the background type to be classic or gradient with this option.
Color: You can change the background color with this option.
Image: You can add or change the background image with this option.
Border Type: You can add and change the border type with this option.
Border Radius: This option controls the roundness of the border.
Padding: You can adjust the inner space of the header field with this option.
Margin: You can adjust the outer space of the header field with this option.
Typography: Change the font family, size, weight, transform, style, decoration, line height, letter spacing, and word spacing from here.
Body Section
Go to Style > Body
Odd Color: You can change the odd body color with this option.
Even Color: You can change the even body color with this option.
Odd/Even Border Color: You can change the odd/even border color with this option.
Odd/Even Padding: You can adjust the odd/even field inner space with this option.
Border Type: You can add and change border types with this option.
Border Radius: This option controls the roundness of the border.
Padding: You can adjust the inner space of the body with this option.
Margin: You can adjust the outer space of the body with this option.
Author Section
Go to Style > Author
Color: You can change the author text color with this option.
Hover Color: You can change the author hover color with this option.
Margin: You can adjust the space around the author field with this option.
Typography: Change the font family, size, weight, transform, style, decoration, line height, letter spacing, and word spacing from here.
Avatar Size: You can make changes to the avatar size with this option.
Border Radius: This option controls the roundness of the border.
Forum Text Section
Go to Style > Forum Text
Color: You can change the forum text color with this option.
Margin: You can adjust the space around the forum text with this option.
Typography: Change the font family, size, weight, transform, style, decoration, line height, letter spacing, and word spacing from here.
Forum Meta Section
Go to Style > Forum Meta
Color: You can change the forum meta text color with this option.
Hover Color: You can change the forum meta hover color with this option.
Margin: You can adjust the space around the meta text with this option.
Typography: Change the font family, size, weight, transform, style, decoration, line height, letter spacing, and word spacing from here.
Forum Form Section
Go to Style > Forum Form
Title Color: You can change the form title color with this option.
Border Type: You can add or change the border type with this option.
Border Width: Set the thickness of the border with this option.
Border Color: You can change the border color with this option.
Border Radius: This option controls the roundness of the border.
Padding: You can adjust the inner space of the forum form with this option.
Margin: You can adjust the space around the forum form with this option.
Title Typography: Change the font family, size, weight, transform, style, decoration, line height, letter spacing, and word spacing from here.
Label Section
Go to Style > Label
Color: You can change the label text color with this option.
Margin: You can adjust the space around the label field with this option.
Typography: Change the font family, size, weight, transform, style, decoration, line height, letter spacing, and word spacing from here.
Input Section
Go to Style > Input
Placeholder Color: You can change the placeholder color with this option.
Text Color: You can change the text input color with this option.
Background Type: You can change the background type to classic or gradient with this option.
Color: You can change the background color with this option.
Image: You can add or change the background image with this option.
Border Type: You can add or change the border type with this option.
Border Radius: This option controls the roundness of the border.
Padding: You can adjust the inner space of the input field with this option.
Typography: Change the font family, size, weight, transform, style, decoration, line height, letter spacing, and word spacing from here.
Textarea Height: You can adjust the height of the input text area with this option.
Submit Button Section
Go to Style > Submit Button
1. Alignment: You can set the position of the submit button to left, center, right or justified with this option.
In this section, we have two more tabs. These are Normal & Active. Let’s start with the Normal Tab -
Text Color: You can change the submit button text color with this option.
Background Type: You can change the background type to classic or gradient with this option.
Color: You can change the background color with this option.
Image: You can change the background image with this option.
Border Type: You can add or change the border types with this option.
Border Width: Set the thickness of the border with this option.
Border Color: You can change the border color with this option.
Border Radius: This option controls the roundness of the border.
Padding: You can adjust the submit button inner space with this option.
Margin: You can adjust the space around the submit button with this option.
Typography: Change the font family, size, weight, transform, style, decoration, line height, letter spacing, and word spacing from here.
Box Shadow: You can add a shadow effect to the submit button with this option.
Now, let’s proceed to the Hover Tab -
Text Color: You can change the text hover color with this option.
Background Type: You can select the background type to classic or gradient with this option.
Color: You can change the background hover color with this option.
Image: You can change the background image with this option.
Border Color: You can change the button’s border hover color with this option.
Notice Section
Go to Style > Notice
Color: You can change the notice text color with this option.
Background Type: You can change the background type to classic or gradient with this option.
Color: You can change the background color with this option.
Image: You can change the background image with this option.
Border Type: You can add or change the border types with this option.
Border Radius: This option controls the roundness of the border.
Padding: You can adjust the inner space of the notice box with this option.
Margin: You can adjust the space around the notice box with this option.
Title Typography: Change the font family, size, weight, transform, style, decoration, line height, letter spacing, and word spacing from here.
All done! You have successfully customized the BbPress Single Topic widget on your website.
Video Assist
The tutorial video will come soon. Please visit the demo page for examples.
Thanks for being with us.