How to Add Border Around Column in WordPress

WordPress has come far in terms of customization and letting users build beautiful pages. 

Today, you can achieve things with WordPress that would usually require page builders. One such thing is adding a border around a column in WordPress

When using a multi-column layout, you would want to separate the columns visually by adding a border.

In this tutorial, I’ll show you how to add borders around a column in WordPress in this step-by-step tutorial. 

Without wasting any of your time, let’s jump straight in. 

Ultimate Blocks

How to Add Border Around Column in WordPress

Here are the step-by-step instructions on how to add a border around a column in WordPress. 

Step 1. Update your WordPress to version 6.0. This is required because the option to add borders around columns natively has been introduced in WordPress 6.0. 

This way, you won’t have to use any third-party block addon or write custom CSS. 

You can update your WordPress to the latest version by going to Dashboard > Updates

Step 2. Go to the post or page where you want to add a column with borders. 

Step 3. Click on the (+) icon and search for ‘Column’ block and add it to the editor.

Step 4. Once the block is added, you’ll have to choose how many columns you want in the block. Gutenberg automatically gives you some variations to choose from. Then, add some content to the columns. 

Step 5. Select the column and you’ll find the customization settings on the right sidebar. Here, you’ll find an option to add a border to your column. 

You can set the border width and pixels and also customize the border color. Moreover, you also have the option to add a border to just one side of the whole column. 

So, that’s how easy it is to add borders around columns in WordPress without writing a single line of CSS. 

Conclusion 

As evident from this tutorial, adding borders around a column is very simple and easy in Gutenberg. The editor gives you full control and various options to help you add beautiful borders around columns. 

I hope this tutorial helped you learn how to add a border around a column in WordPress. 

If you have any doubts or questions, feel free to drop a comment below. Also, if you’re new to WordPress, check out more tutorials on our blog. 

Also Check:

6 responses to “How to Add Border Around Column in WordPress”

  1. Jon Payne Avatar
    Jon Payne

    I installed the plugin and now I am able to make a styled box with a border.
    However, How do I put your box around each column of text in a 3 column wide layout?
    I want to see 3 columns of text, ach with their own box.
    I have made the column, I just cant figure out how to box it.
    My theme, “Intentionally Blank” doesnt have that option un style.

  2. Jon Payne Avatar
    Jon Payne

    I am using the theme “Intentionally Blank”.
    I added 3 columns each with text, but the border option is not available.
    Do I have to switch themes again to get this functionality??

    1. Istiak Rayhan Avatar
      Istiak Rayhan

      Yes, you need to use a Block theme to have the border option. If you want, you can use our block theme – GroundWP.

  3. Stuart Pembery Avatar
    Stuart Pembery

    Hi there
    I’ve installed the plug in but I’m not setting the border options. What am I doing wrong?

    Thanks

    1. Istiak Rayhan Avatar
      Istiak Rayhan

      You don’t need to install any plugin. Just make sure that you’re using the WordPress version 6.0. This option is only available on WordPress 6.0 and later versions.

Leave a Reply

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

Limited Time Sale - 50% Discount on All Plans.

X
Need help?