1. Go to Plugins> Add New> Upload Plugin 
2. Upload blockwheels-pro.zip 
3. Activate the plugin

Hover over BlockWheels and you will see three tabs, Getting Started, Settings, and Activate License.  Click on Settings to go to the Ablockwheels Blocks Settings. There are General and Design options in the settings.

The General settings come with Gutenberg Editor and Google Map. 

• You can enable or disable the Gutenberg Editor for posts and pages.
• Add the map API key to access the Google Map services.

Customize the settings using topography and color pattern options. 

• Topography allows you to customize the base and heading system fonts. 
• Color Patterns offers five different color options for customization purposes.

Once you select to add a new option to create a new post, you will see an additional sign on the upper left side of the page. Click on the sign to see multiple options such as Blocks, Patterns, and Media. You can add multiple or individual slides on the blocks as per your requirement. The editors blocks provide the following widgets:

You can craft a visually captivating experience with Hero Slider. Insert image, subheading, heading, and description to appeal to your visitors and create a more engaging post. It comes with the following customization settings: 

• Columns: Add a column per row, and change the column gap, border radius, background color, padding, and margin. 
• Content: Customize the content’s background, alignment, border radius, padding, and margin, Similarly, you can enable or disable images, subheadings, headings, descriptions, and buttons. 
• Carousel: There is an option for auto-play, customizing the transition speed, and enabling or disabling drag, arrows, and dots as per requirement.
• Arrows: Change the icon color, background color, border radius, and position with this option. 
• Image: Change or fix the image ratio and its border radius along with overlay color with the image option. 
• Sub Heading: You can change the font style, color, letter case, spacing, and letter size.
• Heading: Similar to the subheading, with the heading option, you can change the font, color, size, spacing, and letter case. 
• Description:  It has the same features as the subheading and heading.
• Advanced: It contains the default configuration BlockWheels provides.

Present customer testimonials and feedback in attractive formats to establish trust and credibility. You can add or reduce the number of testimonial grids to your liking. It has the following style settings:

• Columns: It provides general settings such as customizing column per row, column and row gap, border radius and style, border size, color, background color, padding, and margin.  
• Content: It provides options for enabling and disabling images, quotes, ratings, headings, descriptions, names, designations, and links. 
• Image: This option allows you to fix the image ratio, border radius, and overlay color. 
• Quotes: You can change the quotes’ size and color with this option. 
• Description OR Designation: Change the font style, color, letter case, size, and letter spacing. 
• Name: It has the same feature as the description or designation.
• Advanced: It contains the default configuration BlockWheels provides.

Present your services professionally with the block and create stunning service sections for your visitors to see. It contains the following settings: 

• Columns: Customize the column section by adjusting the column per row, column and row gap, border radius and style, border width, color, background color, padding, and margin. 
• Content: Adjust the alignment, and enable or disable the image, name, description, and buttons. 
• Icon/Image: With this option, you can change the icon’s position size and BG size. Similarly, you can adjust the image width, height, border radius, width, and style. 
• Name: Customize the font family and color along with letter case, size, and space. 
• Description: The description option has the same feature as the Name option.
• Buttons: In addition to the features of customizing the font style, color, letter case, size, and spacing, there are also options for BG color, border width, radius, color, button gap, and padding.
• Advanced: It contains the default configuration BlockWheels provides.

You can easily exhibit your team by incorporating photos, positions, bios, and social links using a simple shortcode. It has the following settings:

• Columns: Fix the column per row, column gap, and row gap. Also, you can customize the border radius, style, size, color, background, padding, and margin with this option.  
• Image: You can adjust the image ratio, border radius, and overlay color. 
• Name: Customize the font style, letter case, size, letter spacing, and font color.
• Designation & Bio: It contains the same feature as the Name option.
• Short Bio: Set the BG and icon size and color, border width, radius, and color, and items gap. 
• Advanced: It contains the default configuration BlockWheels provides.

Counters block displays statistics in an interesting way to highlight the company’s achievements or data. It has the following customization settings: 

• Columns: Set the columns per row, column, and row spacing as per your preference. You can also adjust the alignment, border radius, style, color, size, padding, and margin with the option.  
• Icon/Image: You can either enable or disable the icon/image with this option. 
• Number: It offers settings for number position before or after the title, font style and color, letter case, spacing, and size. 
• Title: From font family to color, letter case, size, and spacing, the title allows you to customize it to tailor your needs. 
• Description: You can enable or disable the short description for the counters block.
• Advanced: It contains the default configuration BlockWheels provides.

With Portfolio, display your personal and company portfolio attractively. The block comes with a widget and a carousel slider with customizable item display settings. The Portfolio block contains:  

• Columns: Set column per row, border radius, background color, padding, and margin.  
• Content: It offers the option to enable image, heading, and description. Likewise, you can also adjust the alignment, border radius, padding, and margin.
• Add or Remove Categories: You can choose to add a new category or remove the existing one. You can customize the font family, letter case, size, font / active background color, background / active font color, adjust letter spacing, and border-radius. 
• Image: Adjust the image ratio and border-radius as per your liking.
• Heading: You can change the heading’s font style, size, and color. Also, you can customize the letter case, size, and spacing. 
• Description: The description option has identical settings to Heading. 
• Advanced: It contains the default configuration BlockWheels provides.

You can display and filter the latest posts and thumbnails in grid style with the help of Grid Posts. The grid posts block contains the following settings: 

• WP Query: You can select the display order of your posts from newest to oldest and vice-versa. Similarly, you can choose the number of items to display, filter them by categories and tags, and also select the post-offset option. 
• Columns: Modify the column row, column and row gap, border radius, style, size, and color to your preference. 
• Content: This option allows you to enable the grid posts’ featured image, category, meta, excerpt, and read more options. Likewise, you can adjust the alignment, border radius, background color, padding, and margin. 
• Featured Image: You can enable or disable the placeholder with this option. Also, you can adjust the image ratio, image hover, border radius, and overlay color.
• Category: Change the font style of the grid post along with border-radius, font family and color, letter case, size, and spacing. You can also change the BG color and padding with this option. 
• Title: You can select the HTML tag for the title. You can modify the font family, letter case, size, spacing, and font color. For font color, you can choose either the normal or hover option. 
• Excerpt: Select the maximum number of words in the excerpt to be displayed in your grid post. Choose the font family, color, letter case, size, and spacing to your liking.
• Advanced: It contains the default configuration BlockWheels provides.

Enhance the website’s readability for users as well as search engines with the Heading block. It has the following customization settings:  

• Content: Customize the size of your heading with an HTML tag and swipe to display the inline. Adjust the alignment of the heading, and choose the border-radius, style, size, and color. 
• Colors: Change the font color, background color, and link color. The link color provides you with two options; normal link color or hover link color.  
• Spacing: Select the padding and margin spacing with this option. 
• Typography: You can customize the font family, letter case, size, and spacing.
• Advanced: It has the HTML ANCHOR option which helps to make a unique web address for that particular block. It allows you to link directly to that section of the page. Also, it contains the default configuration BlockWheels provides.

The Container block allows you to add columns and any individual or group blocks. Its customization options include: 

• Container: Change the max width of the block with this setting. 
• Background: You can select the background color to either solid or gradient for the block.
• Border: Adjust the border width and radius along with the color. 
• Spacing: You can adjust the padding and margin spacing of the block.
• Advanced: It has the HTML ANCHOR option and the default configuration BlockWheels.

You can prevent your webpage from looking too cluttered with the Spacer/Divider block. It aids in creating attractive and readable web pages. It contains: 

• Spacer: Adjust the spacer’s height and margin. There is also a reset option.
• Divider: You can either enable or disable the divider. Similarly, you can change the alignment and style of the divider along with height, width, and color.
• Advanced: It has the HTML ANCHOR option and the default configuration BlockWheels.

You can present an individual or group of logos in an attractive carousel using an intuitive shortcode generator. Its customization settings include:

• Carousel: You can select to choose the slide per view and the slide gaps. Also, you can choose to enable the autoplay, pause on hover, or reverse direction option. You can delay the slides and choose their speed and margin. There is also an option for an infinite loop. 
• Navigation: You can make the navigation either visible or invisible. Likewise, you can change the icon color, background color, border radius, and position. 
• Pagination: Similar to navigation, you can make the pagination visible or invisible. You also have the option to change the active color and normal color.
• Image Caption: Enable or disable the image caption to make it visible and invisible. 
• Image Style: Adjust the image ratio, border style, width, radius, and color of the logo.
• Advanced: It contains the default configuration BlockWheels provides.

It is a grid layout that arranges images in different sizes and dimensions utilizing the optimal space and without cropping the image.  Masonry Gallery’s settings are as follows:

• Gallery: Adjust the gallery’s column per row, gutter, and margin. It also has a reset option. 
• Image:  There are different image hover options you can choose from. Also, you can change the border style, width, radius, and color to tailor your needs. 
• Caption: You can enable or disable the caption for the gallery. 
• Link: Similar to the caption, you can enable or disable the image link.
• Advanced: It has the HTML ANCHOR option and the default configuration BlockWheels.

Embed the LottieFiles animations with this block to your websites. You can effortlessly customize the animation to match your brand identity. The customization settings are as follows:

• Lotte Player: Select the file source and Lottie animation URL that you are going to use. There are options for loop playback, adjust the playback speed, rotate (degree), height, and width of the animation. 
• Container: Select the alignment of the animation, border radius, padding, margin, and background color. You can choose a solid background color or gradient.
• Advanced: It has the HTML ANCHOR option and the default configuration BlockWheels.

You can creatively showcase your content in a box format including icons, titles, descriptions, and others. The block has the following customization settings:

• Content: Adjust the icons’ vertical and horizontal alignments. Also, you can change the column and row gap, padding, and margin. You can also select a solid background color or a gradient.
• Advanced: It contains the default configuration BlockWheels provides.

Integrate the features of Google Maps from map display, access to location information, direction generating, etc with this block. Its customization settings are as follows:

• Google Map: Insert the location of the map. Select the map type, map filter, language, and alignment. You can also select the zoom, height, max width, and margin of the map to your preferences.
• Advanced: It contains the default configuration BlockWheels provides.

Showcase the audio and video content of your choice with the Video Box block. It is compatible with different video platforms along with extensive customization options. Its setting contains: 

• Video Settings: Select the video type from YouTube, Vimeo, or self-hosted. There are options for enabling the autoplay, loop, mute, player controls, showing related videos, overlay images, and adjusting margins.
• Advanced: It contains the default configuration BlockWheels provides.

The Accordion block allows you to present the information interactively through click-and-expand patterns. It provides you with the following customization settings: 

• Title: Select the HTML tag and the font family style. You can change the letter case, size, spacing, font color, background, and active background color.  There are also options for customizing border-radius, style, size, color, and padding. 
• Content: Similar to the title, the content also has a customization option for font family and color, letter case, size, spacing, background color,and padding. 
• Container: You can change the margin of the block with this option.
• Advanced: It contains the default configuration BlockWheels provides.

It includes a collection of pre-designed web pages and pattern layouts. There are two sections of patterns and pages and a search option. 

• Patterns: It contains pre-designed templates for services, testimonials, grid posts, and icon templates. 
• Pages: It has a home option that contains pre-designed templates.

The ‘Circular Progress Bar’ WPWheels block lets you visually represent your skills with dynamic circular progress indicators. Enter your skill name and proficiency percentage, and the block will display a clear, graphical representation of your expertise out of 100%.

• Progress Bar: It has progress bar where you can customize both thickness and size of progress bar. And, also provides colors to label, background color and base color for progress bar.
• Text: Here we can select the Font Family, font-size, letter-spacing.
• Advanced: Here, we can add custom CSS classes.

The ‘Countdown’ WPWheels block allows users to set and display a countdown timer, customizable by date and time, providing a clear visual representation of the remaining time for any event or deadline.

• CountDown:  Here, you can choose the time and date for the countdown along with feature like alignment, layouts.
• Items: Here, you can change the padding, min-width, border-radius, border-size and more. The border and background color can be also changed.
• Advanced: Here, we can add custom CSS classes.

The ‘Price Menu’ WPWheels block lets you easily create and display menu items with titles, descriptions, and prices. It includes two presets for flexible styling, perfect for showcasing offerings in a clean, organized layout.

• Content: Here, you can choose the Preset design, add padding margin
• Heading: You can choose the Font Family, font-size, font-color, divider color for heading.
• Description:  You can choose the Font Family, font-size, font-color, divider color for description.
• Advanced: Here, we can add custom CSS classes.

The ‘Progress Bar’ WPWheels block visually represents skill levels with a linear progress bar. Customize colors, backgrounds, and more to match your style, offering a straightforward way to display progress and proficiency.

• Progress Bar: It has progress bar where you can customize both thickness and size of progress bar. And, also provides colors to label, background color and base color for progress bar.
• Text: Here we can select the Font Family, font-size, letter-spacing.
• Advanced: Here, we can add custom CSS classes.

This ‘Shape Divider’ WPWheels block allows you to add stylish, customizable shapes to the top or bottom of your sections, enhancing the design. You can also apply background colors for added visual impact, making your content stand out beautifully.

• Content: Here, you can choose the background of the content along with padding and margin.
• Top Shape: You can enable or disable the Top Shape divider, provide width and height. One can also change the shape flip horizontally and vertically. We can choose Shape color.
• Bottom Shape: You can enable or disable the Bottom Shape divider, provide width and height. One can also change the shape flip horizontally and vertically. We can choose Shape color
• Advanced: Here, we can add custom CSS classes.