A text box is a designated area within the Gutenberg editor where you can craft and publish texts with different typography, font, color, stylization, and other formatting options.
When you want to highlight an important announcement, testimonial, or a brief product description, text boxes allow you to do so. In this article, we’ll show you several ways how to create text boxes in WordPress.
タイプ1：背景が色の付いたテキストボックスを追加する
This is a simple-straightforward process. You just have to add a color to the background of the specific paragraph block.
ステップ1：投稿／ページのテキストを選択する
Open the post/page where you want to add the text box. Select your desired text by placing your cursor on the particular paragraph.
ステップ2：ブロックの背景に色を加える
に行く。 Styles tab, as pointed out in the image below. Click the Background option and select a color. The color will be instantly applied to the block which you can see in real time.
Once the color is applied around and inside the entire block, it will seem like a box has been created around it, creating a text box.
Thus, you can create a text box with a colored background.
タイプ2：ボーダー付きテキストの追加
Adding borders around the block is another easy to create a text box. Follow the steps explained below.
ステップ1：エディター上でテキストを選択する
Select a text again by clicking your desired paragraph block as we showed you on the above method.
ステップ2：グループブロックに変換する
By default, the paragraph block doesn’t allow you to add a border around it. So, convert it into the Group block.
をクリックする。 Paragraph icon on the Gutenberg toolbar. A list will appear with the Group option at the end. Click the Group option on the list.
The block will be converted into the Group block.
ステップ3：ブロックにボーダーと半径を追加する
に行く。 スタイルタブ of the block selected. Scroll down the tab a bit.
を見るだろう。 Border option. Place a pixel value to define the border width. You may add radius and padding to the block as well if you want.
So, your text box is ready. Adding radius and padding can make the text box more presentable. As a result, you can consider adding them.
タイプ3：テーブルにテキストボックスを追加する
You may often want to create multiple text boxes in the same row. But it’s not possible with the default paragraph block. However, you can do it easily by creating a table.
テーブルバーグ is such a table-builder plugin to do so. インストール そして アクティブ化 the plugin and follow the steps shown below.
Step 01: Add the TableBerg Block to Your Site
Simply find the テーブルバーグ・ブロック in the Gutenberg block library and add it to your post/page editor.
Step 02: Create Columns as Required
Like the default Gutenberg table, create as many columns as you need on the table.
Step 03: Add Content to the Table Columns
Although TableBerg allows you to add Lists, CTA buttons, and Images to the table, we have added plain text only to explain the tutorial.
Step 04: Add Colors to the Table Columns
Select a column on the table by placing your cursor on it. Go to the スタイルタブ. Click the Background option and select a color. You’ll see the color has been applied to the column.
Following the same method, apply different types of colors to other columns on the table. You can see we have applied four different colors to the columns of the table.
So, your text boxes are ready. But if you want to remove the table border, follow the next step.
Step 05: Remove the Table Border
Select the entire table by clicking the TableBerg icon twice on the toolbar. Go to the スタイルタブ on the right sidebar. Scroll down a bit. Toggle off the option インナーボーダーを有効にする. The table borders will be invisible.
結論
Thus, you can create text boxes in WordPress in various ways. But before concluding, we want to say one thing which is each of these methods may not be effective in all cases.
Depending on your content type, you must use a suitable method that upholds readability. Let’s share your feedback in the comment box below if you love this post.
Explore our blog archive to learn more interesting articles on WordPress.
