them-anh-bia-ho-anh-noi-bat-in-wordpress-gutenberg-block-editor

Add cover images or featured photos in WordPress postsA lot of interesting new features have been introduced with WordPress 5.0, the Gutenberg Block Editor update. Includes integrating featured images at WordPress into the Gutenberg editor. You can also do things like create content blocks, export, import them to use in other websites.

The feature that will be mentioned today is the Gutenberg Block Editor, which lets you add cover images to your WordPress posts or pages.

The cover image feature has caused some confusion. It seems to be very similar to the featured image that has been in WordPress since version 2.9.

Next, I will explain the difference between the cover photo, the featured image in the block editor. I will also show you how to add WordPress cover images, add WordPress featured photos with Gutenberg Block Editor

What is a cover photo?

Cover image is the wide image that you use with the new section on your website post. The WordPress cover image is under the article. You added the WordPress cover image when you were starting the new section of the article in the block editor.

The Cover option at Gutenberg Block Editor also lets you add text and color to your cover photo.

add-word-in-word-in-word-wordpress-gutenberg-block-editor

By adding a text overlay of the same color to match the look or to enhance the message you are trying to overcome, you make the article more engaging.

Previously, websiter used titles, or text titles or subheadings to separate sections in posts at the website. Sometimes add images below the title, sometimes not.

The Block option now offers you a more visually appealing way to split a website's post into sections.

What is a striking image?

The featured image at WordPress, or post thumbnail, is the main article image that represents all the content. The standout image is the image you see when scrolling through the website repository and then trying to select a story to read.

READ  How to add videos to WordPress step by step details anyone can do

It is also displayed at website in single post. As well as on news, magazines or website homepage.

Featured images are also displayed in social media feeds when you share posts on your social platform.

Featured images are often designed or selected to best represent the content. They are visually appealing, give users a quick look at the content, and prompt them to read the entire article.

You will find the meta box in the post editing screen to add featured images as almost all WordPress themes support featured images.

add-word-in-word-in-word-wordpress-gutenberg-block-editor

Where the featured image is displayed will be controlled by the WordPress interface you have chosen to use. You also get linked images highlighting WordPress posts automatically.

How to add cover images in WordPress Block Editor

The new WordPress Block Editor comes with a Cover option for you to add cover images at WordPress posts.

First, create a new post or edit an existing post. In the post editing screen, click the “Add New Block” button, then select “Cover block”.

add-word-in-word-in-word-wordpress-gutenberg-block-editor

You will find the Block Cover option in the popular block section. When you click Cover, you see the Cover block is added to the content editor with the option to add a new cover photo.

Drag and drop images or videos in block area to load new cover images. You can also choose from media files you have by clicking the online media library button. Or click the upload button to select an image from a computer.

add-word-in-word-in-word-wordpress-gutenberg-block-editor

Once you've added your WordPress cover image, you can freely customize it by clicking on the cover image.

Next, you will be shown a toolbar with a custom option above the “Write title …” image. File in the middle of the image settings, Block settings include the color overlay on the right panel.

add-word-in-word-in-word-wordpress-gutenberg-block-editor

Edit image width

In addition to the alignment option, the cover image block provides you with two width options: the wide “Wide width” and the “Full width” width.

The “Wide width” option makes the image look like content. The “Full width” option causes the image to cover the entire browser window.

READ  Top internet marketing strategies for 2019

add-word-in-word-in-word-wordpress-gutenberg-block-editor

You have also added a title for the cover photo. When you click on the cover image, you will see the “Write title …” field in the middle of the cover image.

add-word-in-word-in-word-wordpress-gutenberg-block-editor

Finally, on the right side of the cover image, you'll find several other settings. You have enabled the user fixed platform function to create a visual effect when the user scrolls down the page.

Below that, you'll find the “Overlay Color” setting. From here, you will be changing the color overlay with the opacity.

Last but not least, you can add CSS code, add more styles to the cover image by clicking the Advanced option.

add-word-in-word-in-word-wordpress-gutenberg-block-editor

Remember, you can repeat the above step and then add as many covers to the article as you want.

See more: How to create a Landing Page

When you add a featured image to your post using the WordPress Block Editor, you'll find that the process is still the same. If you've had your WordPress website for some time now, you already know how the featured image is added.

To add featured images to a WordPress post, create a new post or edit an existing image.

When you open the post editing screen, navigate down to the YouTube featured image meta box located on the right panel.

add-word-in-word-in-word-wordpress-gutenberg-block-editor

You upload new images using the drag and drop uploader or by selecting images from the media library. Next, you can add titles, captions, alternative text and featured image descriptions. Then click on the “Select” option.

add-word-in-word-in-word-wordpress-gutenberg-block-editor

You have added a featured image in the WordPress block editor.

Now, if you are using the latest default theme from WordPress or any modern interface, you are getting to edit the outstanding image overlay colors you have, to some degree.

In the left mouse navigate the column through the interface link that appears and then click the online custom link. That will take you to customizing WordPress directly.

READ  How to schedule a series of WordPress posts on your website

add-word-in-word-in-word-wordpress-gutenberg-block-editor

Click on the different colors tab, and switch the default interface color.

add-word-in-word-in-word-wordpress-gutenberg-block-editor

Note: The WordPress interface manages the image prominently, so you won't find this option if the interface doesn't support image filters.

Now that you understand how to add a cover photo and how to add a featured image in the Gutenberg block editor, let's look at some best practices.

Featured images are common when used by one or more of the following in the form of a post thumbnail or main article image:

  • WordPress website
  • Magazine online
  • News website
  • Entertainment website

Attractive, well-designed featured images will help motivate readers to open the full article. They also work well to make WordPress websites look better and more interactive.

Cover image

Cover image of the article. They are used to separate sections with heading creation. Adding cover images can make the article entertaining and more interactive.

The best way to use cover art in the WordPress block editor is to switch graphics between sections on long posts.

The cover photo is also more unique than the featured photo in the fact that the full width option is available, you add text overlay and color to the image.

When you use the right cover image function, you increase and improve user interaction density at posts and pages in WordPress.

Conclude

I hope this article was helpful. Now you should have a better idea of ​​the difference between the cover image and the featured image in the WordPress block editor. You should also understand how to add both easily.

Have you started using the new Cover block at Gutenberg yet? You see when it is used, will the article be viewed more?

Source : https://taowebsite.com.vn.

Read more :

Leave a Reply

Your email address will not be published. Required fields are marked *