BlockWheels
Table of Contents
- 1.Free Features
- 1.1.Installation
- 1.1.1.Plugin Installation
- 1.1.2.Getting Started
- 1.1.2.1.Testimonials
- 1.1.2.2.Services
- 1.1.2.3.Grid Posts
- 1.1.2.4.Heading
- 1.1.2.5.Paragraph
- 1.1.2.6.Container
- 1.1.2.7.Spacer/Divider
- 1.1.2.8.Logo Carousel
- 1.1.2.9.Template Library
- 1.1.2.10.Icons
- 1.1.2.11.Video Box
- 1.1.2.12.Google Map
- 1.1.2.13.Accordion
- 1.1.2.14.Counters
- 1.1.2.15.Hero Slider Pro
- 1.1.2.16.Portfolio Pro
- 1.1.2.17.Masonry Gallery Pro
- 1.1.2.18.Lottie Animations Pro
- 1.1.2.19.Team Members Pro
- 1.1.Installation
Install the BlockWheels Plugin with your WordPress Theme by following the directions below:
- Log in to the WordPress admin dashboard.
- Go to Plugins > Add New > Upload Plugin.
- Upload blockwheels.zip and Activate the plugin.
This introductory page will provide you with a detailed idea of how to get started with the BlockWheels plugin. You can also visit the demo page or buy the pro version of BlockWheels from here.
There are various blocks available in the plugin. The features of each block are different for the free version and the paid version. Each block has customization options for desktop, tablet, and mobile. Thus, to access the advanced features, you will need a pro version.
The setting options for Testimonials include:
- Columns: There are 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: You can enable and disable images, quotes, ratings, headings, descriptions, names, designations, and links.
- Image: Fix the image ratio, border radius, and overlay color.
- Quotes: Change the quotes’ size and color with this option.
- Description OR Designation: Select the font style, color, letter case, size, and letter spacing.
- Name: Same feature as the description or designation.
- Advanced: Default configuration BlockWheels provides.
The services block settings include:
- Columns: Select 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: Change the icon’s position size and BG size. You can also 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: Same feature as the Name option.
- Buttons: 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: Default configuration BlockWheels provides.
Grid Posts settings include:
- 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 per 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: Enable or disable the placeholder and adjust the image ratio, image hover, border radius, and overlay color with this section.
- Category: Change the font style of the grid post, border-radius, font family and color, letter case, size, and spacing. Also, you can change the BG color and padding with this option.
- Title: Select the HTML tag for the title. It allows you to modify the font family, letter case, size, spacing, and font color. For font color, you can choose either the normal or hover option.
- Excerpt: Customize the maximum number of words in the excerpt to be displayed in the grid post. Choose the font family, color, letter case, size, and spacing to your liking.
- Advanced: Default configuration BlockWheels provides.
The Heading block contains the following settings:
- Content: Customize the heading size using the HTML tag and swipe to display the inline. Change the alignment of the heading, border-radius, style, size, and color.
- Colors: Change the font color, background color, and link color. The link color provides options for a normal link color or a hover link color.
- Spacing: Adjust the padding and margin spacing.
- Typography: Customize the font family, letter case, size, and spacing.
- Advanced: The HTML ANCHOR option helps to make a unique web address for that particular block. It allows you to link directly to that section of the page. Similarly, it has the default configuration BlockWheels provides.
The paragraph block has the following settings:
- Content: Adjust the alignment of the paragraph from here.
- Colors: You can select the font color from here. Similarly, you can change the link color in either normal or hover.
- Spacing: Select the padding and margin of the block. Similarly, there is a rest option if you want to undo any changes.
- Typography: Change the font family, letter case, and size of the paragraph.
- Advanced: There is an HTML ANCHOR option with the default configuration BlockWheels provides.
The Container block’s settings include:
- Container: Adjust the maximum width of the block with this setting.
- Background: Customize the background color to either solid or gradient for the block.
- Border: Select the border width and radius along with the color.
- Spacing: Adjust the padding and margin spacing of the block.
- Advanced: There is an HTML ANCHOR option with the default configuration BlockWheels provides.
The settings for Spacer/Divider include the following:
- Spacer: Adjust the spacer’s height and margin. There is a reset option to undo any changes.
- Divider: Enable or disable the divider while changing 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 provides.
The setting options for the Logo Carousel are as follows:
- Carousel: Select to choose the slide per view and the slide gaps. You can enable the autoplay, pause on hover, or reverse direction option. Similarly, you can delay the slides, choose their speed and margin, or select an infinite loop.
- Navigation: Make the navigation either visible or invisible. Select the icon color, background color, border radius, and position to your liking.
- Pagination: Similar to navigation, you can make the pagination visible or invisible. There is also an 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: Default configuration BlockWheels provides.
The Template Library block allows you to import blocks and pre-designed layouts. It has two settings which are:
- Patterns: Contains pre-designed templates for services, testimonials, grid posts, and icon templates.
- Pages: It has a home option that contains pre-designed templates.
The settings for Icons Block include the following:
- Content: Adjust the icons’ vertical and horizontal alignments. Also, change the column and row gap, padding, and margin. You can also customize a solid background color or a gradient.
- Advanced: Default configuration BlockWheels provides.
Video Box allows two customization settings which are:
- Video Settings: Select the video type from YouTube, Vimeo, or self-hosted. You can enable the autoplay, loop, mute, and player controls, show related videos, overlay images, and adjust margins.
- Advanced: Default configuration BlockWheels provides.
Google Map has two setting tabs which include:
- 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: Default configuration BlockWheels provides.
The customization settings for Accordion have the following settings:
- Title: Select the HTML tag and the font family style. 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: Adjust the margin of the block with this option.
- Advanced: Default configuration BlockWheels provides.
The settings for Counter block include:
- Columns: Select 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: Enable or disable the icon/image with this option.
- Number: You can adjust the number position before or after the title, font style and color, letter case, spacing, and size.
- Title: Customize the font family to color, letter case, size, and spacing, and the title to tailor your needs.
- Description: Enable or disable the short description for the counters block.
- Advanced: Default configuration BlockWheels provides.
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.
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.
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 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.