The simple task of centering a button, and creating an anchor link button (a.k.a. jump link) in WordPress 5.4.1 stopped me in my tracks.
I want to show you how to do these two simple tasks, so you don’t go down the same rabbit hole and waste a lot of time doing a task that should only take a few seconds (center a button) and a few minutes (create a button with an anchor link.)
How to Center a Button in WordPress 5.4.1
Before the latest WordPress update (updated April 29, 2020), the alignment feature was located above the button. see below
In WordPress 5.4.1 the button is not immediately visible, likely because the button in 5.4.1 has become more ‘sophisticated.’ You can now create multiple buttons, all neatly lined up in one horizontal space, BUT where in heck is alignment feature?
The problem is, you won’t be able to center a button until you activate the bounding box. For me, the easiest way to do that is to click to the right of button. Once you see the bounding box, the alignment feature will display.
How to Create an Anchor Link Button in WordPress 5.4.1
Why Create an Anchor Link?
Anchor links are common at the top of a page when you want to create an Table of Contents. It allows site visitors can quickly access the information they need.
In this example, Elsie Kerns wanted anchor link buttons instead of a traditional table of contents.
To create an anchor link button in the WordPress block editor, first select the area you want you reader to link to, NOT the button you want them to click on.
TIP: Watch the video below to see me create this anchor link button.
- Select the text
- In the Block setting (on the right), toggle open the Advanced bar
- Under HTML Anchor, give your link text a name
- I like to keep things simple, so I just name it exactly what the anchor is which is why I named it how to be listed
- NOTE: anchor text cannot have any spaces. WordPress will automatically add a dash if hit your space bar in between your words, and it will look similar to this: how-to-be-listed
- Once you name your anchor text, I recommend coping it
- because the link names have to be exact
- Now go to the area you want your visitor to click
- in my case it’s the How To Be Listed Button
- Select the button text
- Select the link feature
- In the link field, add a # (pound symbol) and paste in the link text you just created
- Save your changes by clicking update
- Check your work
How I Center Aligned a Button in WordPress 5.4.1 and Created Anchor Link Buttons
See how I easily aligned a button, once I knew how to bring up the alignment feature, and also how I created anchor link buttons.
Join Me Live on My Next 10-Minute Monday!
Get an invitation to join me LIVE on my next 10-Minute Monday, and receive a list of my favorite Free resources for great photography that you can use on your website or in any project.
Just fill out the form below.
When you join me live on 10-Minute Monday you’ll be able to ask a question, about the training, or even your own website.
Hope to see you on my next 10-Minute Monday.
Thank you for this! I’ve been banging my head against my desk for a few hours. The website is (still/always) a work in progress, but you’ve fixed a major frustration.
Nancy Fields says