Home WP Plugins Standard Post

Standard Post

Adding Styles to Gutenberg Editor Blocks

If you use the Gutenberg editor and have some basic coding knowledge, you will find that the default content edited by the Gutenberg editor is in blocks. The plugin recommended in this article is used to add styles to these blocks. Plugin Introduction Custom CSS For Gutenberg Bl...

Updated on November 1, 2019 About 2 minutes read
给古腾堡编辑器的block块增加样式

If you are using the Gutenberg editor and have a basic understanding of simple code, you will notice that the content edited in the Gutenberg editor is organized block by block by default. This article introduces a plugin designed to add styles to these blocks.

Plugin Introduction

Custom CSS For Gutenberg Blocks is a GutenbergEditor Enhancementplugin that allows you to define styles for any block you create while writing articles with the Gutenberg editor, such as adjusting appearance, typography, and dimensions.

CSS Property: Typography

  • Font Family
  • Color
  • Font Size
  • Font Weight
  • Line Height
  • Letter Spacing
  • Word Spacing
  • Font Style
  • Text Shadow
  • Text Alignment
  • Text Transform
  • Text Decoration

CSS Property: Appearance

  • Opacity
  • Background Color
  • Border
  • Border Radius
  • Box Shadow

CSS Properties: Dimensions

  • Margin
  • Padding
  • Width
  • Height

Animated GIF Example

块添加样式

Plugin Usage

Download the plugin using the download button at the end of this article, then activate it to use.

When using it, simply select the block you want to style, and a style setting area will appear on the right. Modify the display effect as desired.

Plugin Download

You can use the button below to download the plugin, or directly search for the plugin title in the backend to install it.

Download Link

5/5 - (1 vote)
Previous WordPress Plugin to Add Contact Information and Search Box to Website Top Continue reading content around the same timeline. Next Using Xftp 6 to Delete the Hidden File .maintenance View the next related tutorial or experience.

AI Website Building Assistant

🤖
Hello! I am the Naibabiji AI Assistant. How can I help you?
Quick Consultation: