The Cover Block is essential to add an image or video with a text overlay. It is an expert tool for highlighting a key message or showcasing important product features.
Today, in this article, we will discuss “How to Use the Cover Block in WordPress”, its general features, toolbar features, etc. So please stick with us from start to finish and master the block to shine your website.
What is the WordPress Cover Block?
The WordPress cover block is a core block that comes with the WordPress to add an image or video in the background of the text.
It adds a full-width or boxed container and is used for headers, banners, or any content sections that are required to grab attention.
Key Features of the WordPress Cover Block
- Background Options: Add images, videos, or solid colors as your background.
- Resize: You can increase or decrease the cover block’s size simply by dragging the height and width in the editor.
- Text Overlay: Insert customizable text over the background for added emphasis.
- Opacity Control: Adjust the transparency of the background to blend it seamlessly with other elements.
Toolbar Features of the WordPress Cover Block
The toolbar features are explained below.
- Transform to: Using the option, you can transform this block to Image, Columns, Details, Group, and Media & Text.
- Drag: Allows you to drag and drop the dedicated block into any place in the editor.
- Moving Handles: Let you move your block up and down.
- Align: The align option lets you set the image alignment to None, Wide Width, Full Width, Left, Center, and Right.
- Duotone: The duotone filter lets you create a two-tone color effect without losing the original image. Again, you can set shadows and highlights using the feature.
- Change Current Position: It lets you set the block’s position within the cover block since you can add various other blocks inside the cover block.
- Toggle Full Height: Custom height will be applied to your block.
- Replace: The replace option lets you replace your current image with the other image.
- Option: Offers more options related to the section of the block, such as duplicate, copy, group, etc.
Create Beautiful Tables
With Block Editor
How to Use the Cover Block in WordPress
Using the cover block in WordPress is simple. Make sure to follow these steps thoroughly.
Step 1: Insert the Cover Block
To insert the cover block, head to your post or page. Afterward, click the Add Block (“+“) Add Block icon (1), type “Cover” in the search box (2), and click “Cover” (3).
Step 2: Insert Your Image or Video File
You can select these three options to insert a video or image file. Again, you can choose the solid colors below as your cover background.
How to Insert Image or Video using the Upload Option
To insert image files, click the upload button, select your image or video, and click open. It will be open in the editor after that.
How to Insert Image Or Vide via Media Library Option
Click the Media Library button, select the image, and click the Select button to insert the image into the editor.
How to Insert Image via the “Use Featured Image” Option
If you choose this option, your featured image will be selected automatically for the bloc. Make sure you have chosen the featured image in your post.
Step 3: Customization
For further block customization, navigate Settings (1) > Block (2) > Settings (3).
In the settings option, you can enable or disable the layout (A) and modify the content (B) and wide widths (C).
You can also change the look of your cover block from the Styles Option located next to the Settings.
You can modify the following options in the Styles menu.
- Color: You can change the color of the text and heading.
- Overlay: The overlay option lets you select an extra solid color for your overlay or not select any if you like. However, you can change the overlay opacity to highlight your text or targeted message.
- Filters: Duotone filter lets you create a two-tone color effect without losing the original image. Again, you can set shadows and highlights using the feature.
- Typography: Typography lets you modify the font, font size, appearance, line height, letter spacing, decoration, and letter case.
- Dimensions: This feature allows you to set margins, padding, and block spacing for your cover block.
- Aspect Ratio: This lets you set the aspect ratio for your image to Original, Square, Standard, Portrait, Classic, Classic Portrait, Wide, and Tall.
- Minimum Height: This feature lets define the minimum height for the cover block.
- Border & Shadow: Using this feature, you can add a border and border radius for the image block.
So that’s how you can use the cover block and learn all its elements.
Final Thoughts!
The WordPress cover block is undeniably an efficient tool to enhance the visual appeal and highlight your targeted message in your WordPress website.
Learn and explore its features to elevate your content like never before. Hope this article has helped you learn all the features of the block. What do you think? Let me know in the comment section below.
Read more!
