Hướng dẫn wordpress cover block - khối bìa wordpress

Khối bìa hiển thị một hình ảnh hoặc video mà bạn có thể thêm văn bản và nội dung khác trên đầu-tuyệt vời cho các tiêu đề và màn hình kiểu biểu ngữ khác. Hướng dẫn này sẽ chỉ cho bạn cách sử dụng khối bìa để cung cấp cho bài đăng hoặc trang của bạn một cái nhìn đẹp, chuyên nghiệp.Cover block displays an image or video that you can add text and other content on top of — great for headers and other banner-style displays. This guide will show you how to use the Cover block to give your post or page a sleek, professional look.

Mục lục

Video hướng dẫn

Bảng nội dung ↑

Thêm khối bìa

Để thêm khối & nbsp; Cover, nhấp vào & nbsp;+ block & nbsp; INSERTER & NBSP; Biểu tượng và tìm kiếm cho bìa bìa. Nhấp vào nó để thêm khối vào bài hoặc trang.Cover block, click on the + Block Inserter icon and search for “cover”. Click it to add the block to the post or page.

💡

Sử dụng bàn phím của bạn, bạn cũng có thể nhập /nắp trên một dòng mới và nhấn Enter để nhanh chóng thêm một khối bìa mới.Cover block.

Hướng dẫn wordpress cover block - khối bìa wordpress
Sử dụng lệnh /nắp chém để chèn một khối bìaCover block

Để biết thêm, hãy truy cập hướng dẫn chi tiết của chúng tôi về việc thêm các khối.

Bảng nội dung ↑

Thêm khối bìa

Để thêm khối & nbsp; Cover, nhấp vào & nbsp;+ block & nbsp; INSERTER & NBSP; Biểu tượng và tìm kiếm cho bìa bìa. Nhấp vào nó để thêm khối vào bài hoặc trang.Upload and Select Media:

  1. 💡 Uploadto add a new image or video from your device.
  2. Sử dụng bàn phím của bạn, bạn cũng có thể nhập /nắp trên một dòng mới và nhấn Enter để nhanh chóng thêm một khối bìa mới.Select Media to choose from an existing image or video on your site, Google Photos, Pexels Free Photos, or Openverse.

Sử dụng lệnh /nắp chém để chèn một khối bìa

Để biết thêm, hãy truy cập hướng dẫn chi tiết của chúng tôi về việc thêm các khối.
  • Chọn một hình ảnh
  • Sau khi bạn chèn khối, bạn có hai tùy chọn để đặt hình ảnh hoặc video: & nbsp; tải lên & nbsp; và & nbsp; chọn phương tiện truyền thông:
  • Chọn Tải lên để thêm một hình ảnh hoặc video mới từ thiết bị của bạn.Cover block uses the image as a background image, and will not resize to show the entire image width on different size devices. If you have content in the image that needs to be displayed for all device sizes, you would want to use an Image block instead.

Bảng nội dung ↑

Thêm khối bìa

Để thêm khối & nbsp; Cover, nhấp vào & nbsp;+ block & nbsp; INSERTER & NBSP; Biểu tượng và tìm kiếm cho bìa bìa. Nhấp vào nó để thêm khối vào bài hoặc trang.Cover block, such as a Button block or Paragraph block.

Bảng nội dung ↑

Thêm khối bìa

Để thêm khối & nbsp; Cover, nhấp vào & nbsp;+ block & nbsp; INSERTER & NBSP; Biểu tượng và tìm kiếm cho bìa bìa. Nhấp vào nó để thêm khối vào bài hoặc trang.

Hướng dẫn wordpress cover block - khối bìa wordpress
💡Cover block toolbar

Sử dụng bàn phím của bạn, bạn cũng có thể nhập /nắp trên một dòng mới và nhấn Enter để nhanh chóng thêm một khối bìa mới.

  • Sử dụng lệnh /nắp chém để chèn một khối bìa
  • Để biết thêm, hãy truy cập hướng dẫn chi tiết của chúng tôi về việc thêm các khối.
  • Chọn một hình ảnh
  • Sau khi bạn chèn khối, bạn có hai tùy chọn để đặt hình ảnh hoặc video: & nbsp; tải lên & nbsp; và & nbsp; chọn phương tiện truyền thông:
  • Chọn Tải lên để thêm một hình ảnh hoặc video mới từ thiết bị của bạn.
  • Chọn Chọn phương tiện để chọn từ một hình ảnh hoặc video hiện có trên trang web của bạn, Google Photos, Pexels miễn phí ảnh hoặc Openverse.
  • Ngoài ra, bạn có thể nhấp vào vòng tròn đen hoặc trắng để sử dụng màu đó cho bìa của bạn. Sau này bạn có thể thay đổi nó thành bất kỳ màu nào khác trong cài đặt khối.
  • Mẹo chọn hình ảnh
  • Hình ảnh trang trí hoặc trừu tượng hoạt động tốt nhất vì hình ảnh đầy đủ có thể không phải lúc nào cũng hiển thị.
  • Nhập bất kỳ văn bản nào trên đầu hình ảnh, trái ngược với việc thiết kế văn bản bên trong chính hình ảnh. Điều này đảm bảo nó sẽ mở rộng hiệu quả cho tất cả các kích thước màn hình.
Khối bìa sử dụng hình ảnh làm hình ảnh nền và sẽ không thay đổi kích thước để hiển thị toàn bộ chiều rộng hình ảnh trên các thiết bị kích thước khác nhau. Nếu bạn có nội dung trong hình ảnh cần được hiển thị cho tất cả các kích thước thiết bị, bạn sẽ muốn sử dụng một khối hình ảnh thay thế.

Thêm văn bản và nội dung khácCover block itself to the left, right, and center from the toolbar. When using the left or right alignment, you can put another block beside the Cover block.

Bây giờ bạn đã chọn hình ảnh của mình, bạn có thể viết một tiêu đề trên nó. Bạn có thể sử dụng điều này, ví dụ, để tiêu đề một phần mới của một bài hoặc trang. Bạn cũng có thể thêm các khối khác để hiển thị trên đầu khối, chẳng hạn như khối nút hoặc khối đoạn văn.Cover block also has Wide and Full-width alignment options that are useful for creating unique headers and widescreen effects. These two options are only available if your theme supports this kind of alignment. 

Hướng dẫn wordpress cover block - khối bìa wordpress
Thanh công cụ chặn

Khi bạn nhấp vào khối, một thanh công cụ các tùy chọn sẽ xuất hiện ở trên nó:

Thanh công cụ Khối Cover

Hướng dẫn wordpress cover block - khối bìa wordpress
Các tùy chọn này là:

Thay đổi loại khối.

Kéo khối.Toggle Full Height option in the block’s toolbar that appears when you click on it.

Hướng dẫn wordpress cover block - khối bìa wordpress

Di chuyển khối lên hoặc xuống.

Căn chỉnh hình ảnh (trái, phải và trung tâm; cộng với các tùy chọn rộng và toàn chiều rộng nếu được hỗ trợ bởi chủ đề)

Hướng dẫn wordpress cover block - khối bìa wordpress

Thay đổi vị trí nội dung

Hướng dẫn wordpress cover block - khối bìa wordpress

Chuyển đổi chiều cao đầy đủ

Áp dụng bộ lọc DuotoneCover block if you want to automatically display your featured image at the top of your post or page as well.

  1. Sử dụng hình ảnh đặc trưng
  2. Thay thế hình ảnh hiện tại bằng hình ảnh mớiCover block by clicking the + Block Inserter icon or typing /cover on a new line, then press enter.
  3. Lựa chọn khácCover block’s toolbar, click Add Media, then select Use featured image. This will automatically pull in your current featured image and add it to the Cover block.

Hướng dẫn wordpress cover block - khối bìa wordpress

Liên kết

Giống như nhiều khối khác, bạn có thể căn chỉnh khối nắp sang trái, phải và giữa từ thanh công cụ. Khi sử dụng căn chỉnh bên trái hoặc bên phải, bạn có thể đặt một khối khác bên cạnh khối bìa.Cover block toolbar that shows up after you’ve added an initial image or video. Choosing Replace will allow you to select a new media file for your Cover block.

Hướng dẫn wordpress cover block - khối bìa wordpress

Bảng nội dung ↑

Khối bìa cũng có các tùy chọn căn chỉnh rộng và toàn chiều rộng, rất hữu ích để tạo các tiêu đề và hiệu ứng màn hình rộng độc đáo. Hai tùy chọn này chỉ khả dụng nếu chủ đề của bạn hỗ trợ loại căn chỉnh này. & NBSP;

Rộng sẽ chỉ đơn giản là phá vỡ cột giới hạn, trong khi đầy đủ sẽ đạt đến các cạnh của chiều rộng trang.

Hướng dẫn wordpress cover block - khối bìa wordpress
Nhấp vào biểu tượng ⚙ để mở cài đặt khối

Phong cách

Sử dụng các kiểu trong cài đặt khối bìa để thêm hiệu ứng sóng vào đầu hoặc dưới cùng của hình ảnh bìa.Cover block settings to add a wave effect to the top or bottom of the cover image.

Hướng dẫn wordpress cover block - khối bìa wordpress

Bôi cảnh đa được sửa chưa

Trong cài đặt khối trên thanh bên, bạn sẽ thấy một nút chuyển đổi cho một nền cố định. Một nền cố định có nghĩa là hình ảnh bìa cuộn cùng với trang của bạn. Tắt tùy chọn này nhúng hình ảnh vào vị trí, vì vậy hình ảnh không cuộn.

Hướng dẫn wordpress cover block - khối bìa wordpress

Bối cảnh lặp đi lặp lại

Tùy chọn nền lặp đi lặp lại cho phép bạn lặp lại cùng một hình ảnh để tạo thành một mẫu trong khối bìa. Ví dụ: nếu bạn có một hình ảnh nhỏ của một quả bóng và bạn muốn nó lặp lại nhiều lần trong khối bìa, bạn có thể bật tùy chọn này. Đây là những gì sẽ trông như thế nào:Cover block. For example, if you have a small image of a balloon and you want it to repeat multiple times in the Cover block, you can toggle this option on. Here’s what that would look like:

Hướng dẫn wordpress cover block - khối bìa wordpress
Nó chỉ có một hình ảnh lặp lại nhiều lần bằng cách sử dụng tùy chọn nền lặp đi lặp lại.

💡

Sử dụng một hình ảnh nhỏ để lặp lại nó nhiều lần. Hình ảnh càng nhỏ, nó sẽ nhiều hơn được nhân lên.

Bạn có thể sử dụng chuyển đổi nền lặp đi lặp lại kết hợp với nền cố định, nhưng nền cố định không nhất thiết phải được bật. Hãy chơi xung quanh với các tùy chọn này để tìm những gì phù hợp với nhu cầu của bạn.

Đầu dò tiêu điểm

Nếu tùy chọn nền cố định bị tắt, bạn sẽ thấy trình chọn tiêu điểm. Công cụ này cho phép bạn xác định điểm quan tâm chính trong ảnh và làm nổi bật nó. Nhấp vào người chọn để kéo nó đến vị trí bạn muốn hoặc sử dụng tỷ lệ phần trăm vị trí ngang và dọc bên dưới để đặt nó theo cách thủ công.

Văn bản alt

Trong trường văn bản, bạn có thể viết một mô tả văn bản thay thế, điều này rất quan trọng đối với khả năng truy cập và SEO.

Phương tiện truyền thông rõ ràng

Để xóa hình ảnh bìa để sử dụng nền màu rắn, hãy sử dụng tùy chọn ‘Clear Media như đã thấy ở đây:

Hướng dẫn wordpress cover block - khối bìa wordpress
Chọn ‘Xóa phương tiện truyền thông để xóa hình ảnh bìa của bạn

Màu lớp phủ

Sử dụng các tùy chọn màu lớp phủ, bạn có thể thêm một lớp phủ màu vào hình ảnh bìa. Theo mặc định, đây là lớp phủ màu xám, trong suốt, nhưng với các tùy chọn màu lớp phủ, bạn có thể chuyển màu đó sang bất kỳ màu nào khác mà bạn chọn.

Hướng dẫn wordpress cover block - khối bìa wordpress
Thêm một lớp phủ màu và đặt độ mờ của nó.

Độ mờ

Thanh trượt này cho phép bạn đặt độ mờ của lớp phủ hình ảnh bìa. Di chuyển thanh trượt lên tới 100 làm cho lớp phủ tối hơn và mờ hơn, và di chuyển nó xuống 0 làm cho lớp phủ nhẹ hơn và trong suốt hơn. Ở tuổi 100, lớp phủ hoàn toàn mờ đục và hình ảnh bìa không còn hiển thị. Ở 0, lớp phủ biến mất hoàn toàn, chỉ để lại hình ảnh của bạn.

💡

Sử dụng một hình ảnh nhỏ để lặp lại nó nhiều lần. Hình ảnh càng nhỏ, nó sẽ nhiều hơn được nhân lên.

Bạn có thể sử dụng chuyển đổi nền lặp đi lặp lại kết hợp với nền cố định, nhưng nền cố định không nhất thiết phải được bật. Hãy chơi xung quanh với các tùy chọn này để tìm những gì phù hợp với nhu cầu của bạn.

Đầu dò tiêu điểm

Nếu tùy chọn nền cố định bị tắt, bạn sẽ thấy trình chọn tiêu điểm. Công cụ này cho phép bạn xác định điểm quan tâm chính trong ảnh và làm nổi bật nó. Nhấp vào người chọn để kéo nó đến vị trí bạn muốn hoặc sử dụng tỷ lệ phần trăm vị trí ngang và dọc bên dưới để đặt nó theo cách thủ công.Typography (as shown on the right.) You can then choose the option you want to access:

  • Văn bản alt
  • Trong trường văn bản, bạn có thể viết một mô tả văn bản thay thế, điều này rất quan trọng đối với khả năng truy cập và SEO.
  • Phương tiện truyền thông rõ ràng
  • Để xóa hình ảnh bìa để sử dụng nền màu rắn, hãy sử dụng tùy chọn ‘Clear Media như đã thấy ở đây:
  • Chọn ‘Xóa phương tiện truyền thông để xóa hình ảnh bìa của bạn
  • Màu lớp phủ
  • Sử dụng các tùy chọn màu lớp phủ, bạn có thể thêm một lớp phủ màu vào hình ảnh bìa. Theo mặc định, đây là lớp phủ màu xám, trong suốt, nhưng với các tùy chọn màu lớp phủ, bạn có thể chuyển màu đó sang bất kỳ màu nào khác mà bạn chọn.

Hướng dẫn wordpress cover block - khối bìa wordpress
Thêm một lớp phủ màu và đặt độ mờ của nó.

Độ mờ allows you to adjust the size of the text. You can choose from preset sizes like small, medium, and large.

Thanh trượt này cho phép bạn đặt độ mờ của lớp phủ hình ảnh bìa. Di chuyển thanh trượt lên tới 100 làm cho lớp phủ tối hơn và mờ hơn, và di chuyển nó xuống 0 làm cho lớp phủ nhẹ hơn và trong suốt hơn. Ở tuổi 100, lớp phủ hoàn toàn mờ đục và hình ảnh bìa không còn hiển thị. Ở 0, lớp phủ biến mất hoàn toàn, chỉ để lại hình ảnh của bạn.

Hướng dẫn wordpress cover block - khối bìa wordpress

Nếu bạn có thể thêm một tiêu đề vào hình ảnh bìa của bạn, chúng tôi khuyên bạn nên làm cho lớp phủ ít nhất là hơi mờ đục để làm cho tiêu đề dễ đọc hơn. gives you the option to change the font style used. Choose from a list of fonts in a drop-down menu.

Kiểu chữ allows you to change the text’s style between regular and italic, ranging from thin to extra bold.

Điều chỉnh sự xuất hiện của văn bản khối khối với các cài đặt sau. sets the spacing above/below the text. If you select zero, be sure to check your site on mobile.

Nếu bạn không thấy cài đặt, hãy nhấp vào ba dấu chấm bên phải của kiểu chữ (như được hiển thị bên phải.) Sau đó, bạn có thể chọn tùy chọn bạn muốn truy cập: includes options for underline and strikethrough (if available.)

Cỡ chữ allows you to set the text to all caps, the first letter capitalized, or all lower case.

Gia đình phông chữ sets the space between each character of the text. You can change the units from the default (pixels) to percentage, em, rem, vw, and vh. Learn more about relative units here.

Vẻ bề ngoài

Chiều cao giữa các dòng

Trang tríCover block.

Trường hợp thư

Khoảng cách chữ cái

Kiểu chữ trong thanh bên cài đặt khối, với các tùy chọn bổ sung được mở rộng.

Bạn có thể sử dụng một video trong khối bìa.Điều này hoạt động tốt nhất với các video ở định dạng .MP4, nhưng hãy thoải mái tải lên video của bạn ở các định dạng khác.Xem danh sách các định dạng được chấp nhận.Cover block. This works best with videos in .mp4 format, but feel free to upload your videos in other formats. See the list of accepted formats.

Chèn khối bìa như bình thường, nhưng thay vì chọn hình ảnh, bạn có thể chọn thêm video.Sau đó, bạn có thể chọn video bạn muốn chèn và điều chỉnh cài đặt chiều rộng của khối khi cần.Cover block as you would normally, but instead of choosing an image, you can choose to add a video. Then, you can select the video you’d like to insert and adjust the width settings of the block as needed.

Sau đó, bạn đã sẵn sàng để thêm bất kỳ văn bản hoặc nút nào mà bạn thích trên đầu video bìa của bạn.

Bảng nội dung ↑

Nâng cao

Tab nâng cao cho phép bạn thêm lớp CSS vào khối của mình, cho phép bạn viết CSS tùy chỉnh và tạo kiểu khối khi bạn thấy phù hợp.Tìm hiểu thêm.

Hướng dẫn wordpress cover block - khối bìa wordpress