Author: Editorial Staff

Do you need to underline or justify text in WordPress?

WordPress used to have both justify and underline text buttons in the visual editor. However, they have been removed and are no longer available.

In this article, we’ll show you how to add underline and justify text buttons in WordPress.

Why Add Underline and Justify Text Buttons in WordPress?

Would you like to restore the missing underline and justify buttons when editing posts and pages on your WordPress website? These buttons were removed from the post editor in WordPress 4.7, but luckily there’s a way to bring them back.

However, there are a few reasons you should consider not underlining and justifying text on your website.

First, underlined text can look like links, and your users may become frustrated when what they think is a link doesn’t work. Also, justified text can make your content harder to read, especially on small screens.

With that being said, let’s take a look at how to add underline and justify text buttons in WordPress. We’ll show you how to do this for the block and classic editor. We’ll also show you how to underline and justify text using keyboard shortcuts, without the need for a button.

• Underlining and Justifying Text Using Keyboard Shortcuts
• Adding Underline and Justify Text Buttons to the Block Editor
• Adding Underline and Justify Text Buttons to the Classic Editor

Underlining and Justifying Text Using Keyboard Shortcuts

You don’t need a plugin or toolbar icons to underline or justify text in WordPress. Instead, you can simply use a keyboard shortcut.

To underline text, just select the text you want to underline in WordPress and press Ctrl+U on Windows or Command+U on Mac. That’s it. This keyboard shortcut will work with both the block and classic editor.

There’s another keyboard shortcut for justifying text. Simply select the text and press Shift+Alt+J in Windows or Command+Option+J on Mac and your text will be justified.

However, the keyboard combination for justifying text will only work with the classic editor. If you use the block editor, then you will not be able to justify text with a keyboard shortcut and should use the plugin method below.

Adding Underline and Justify Text Buttons to the Block Editor

First, you’ll need to install and activate the Gutenberg Block Editor Toolkit – EditorsKit plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, the plugin will make underline, justify, and other formatting features available when using the WordPress block editor.

These additional icons can’t be added directly to the block editor’s toolbar, but you will find the extra options when clicking the ‘Displays more block tools’ down arrow on the toolbar.

To underline text, you should first select the text, then click the ‘Displays more block tools’ down arrow, and then click on ‘Underline’ from the drop down menu.

To justify a paragraph, first make sure that your cursor is in that paragraph. Then click the ‘Displays more block tools’ down arrow and select ‘Justify’ from the drop down menu.

Adding Underline and Justify Text Buttons to the Classic Editor

If you are using the classic editor, then you should start by installing and activating the Advanced Editor Tools plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, you will need to navigate to Settings » Advanced Editor Tools (TinyMCE Advanced) in your admin menu. Next, you need to click on the ‘Classic Editor (TinyMCE)’ tab at the top of the page.

You will notice a preview of the WordPress classic editor. Below the preview, it will show you all the unused buttons.

Now you need to drag and drop underline and justify text buttons from ‘Unused Buttons’ box to the post editor.

When you have finished, make sure you click the ‘Save Changes’ button at the top of the screen to store the new settings.

Now when you are creating or editing a WordPress blog post or page, the new formatting buttons will be available on the classic editor’s toolbar.

We hope this tutorial helped you learn how to add underline and justify text buttons in WordPress. You may also want to learn why WordPress is free, or check out our list of must have plugins to grow your site.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Add Underline and Justify Text Buttons in WordPress first appeared on WPBeginner.

Often while reading WordPress tutorials, you may be asked to add custom code snippets in your theme’s functions.php file or in a site-specific plugin.

The problem is that even the slightest mistake can break your website.

In this article, we will show you an easy way to add custom code in WordPress without breaking your site.

The Problem with Custom Code Snippets (And How to Fix It)

Often you’ll find code snippets in WordPress tutorials with instructions to add them into your theme’s functions.php file or a site-specific plugin.

The biggest problem is that even a tiny mistake in the custom code snippet can break your WordPress site and make it inaccessible.

Not to mention, if you update your WordPress theme, then all your customizations get removed.

The other problem is that if you add multiple code snippets in a site-specific plugin, it can become hard to manage the file.

Luckily, there is an easier way for users to add and manage custom code snippets in WordPress.

WPCode is the most popular code snippets plugin used by over 1 million WordPress websites. It makes it easy to add code snippets in WordPress without having to edit your theme’s functions.php file.

WPCode also makes it simple to add tracking codes for Google Analytics, Facebook Pixel, Google AdSense, and more to your site’s header and footer areas.

You’ll never have to worry about breaking your site because the smart code snippet validation helps you prevent common code errors.

In addition, WPCode comes with a built-in snippets library where you can find all of the most popular WordPress code snippets like disable REST API, disable comments, disable Gutenberg, allow SVG file uploads, and much more. This eliminates the need to install separate plugins for each feature request.

The best part is that you can manage all your code snippets from one central screen and add tags to organize them.

With that said, let’s take a look at how to easily add custom code snippets in WordPress with WPCode.

Adding Custom Code Snippets in WordPress

The first thing you need to do is install and activate the WPCode plugin on your website.

For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, the plugin will add a new menu item labeled ‘Code Snippets’ to your WordPress admin bar. Clicking on it will show you a list of all the custom code snippets you have saved on your site.

Since you just installed the plugin, your list will be empty.

Go ahead and click on the ‘Add New’ button to add your first custom code snippet in WordPress.

This will bring you to the ‘Add Snippet’ page. Here you can choose a code snippet from the pre-made library or add your custom code.

To add custom code, click on the ‘Use snippet’ button underneath the ‘Add Your Custom Code (New Snippet)’ option.

You need to start by entering a title for your custom code snippet. This could be anything that helps you identify the code.

After that, you can copy and paste your code snippet into the code box. Be sure to also select the correct code type from the drop-down menu on the right.

In the screenshot above, we have added a custom code snippet to remove the WordPress version number from our test site.

function wpb_remove_version() {
return '';
}
add_filter('the_generator', 'wpb_remove_version');

Below the code box, you will see insertion options. There are two main insertion options: Auto Insert and Shortcode (Default).

If you chose the ‘Auto Insert’ method, the snippet will be automatically inserted and executed on your site.

You can automatically run the snippet only in the WordPress admin area, on the front-end of your site, or everywhere. If you are unsure, then select the default ‘Run snippet everywhere’ option.

With the ‘Shortcode’ method, the snippet is not automatically inserted. Once you save the snippet, you’ll get a shortcode specific to the snippet that you can use anywhere on your site.

When you scroll further down, you will see a ‘Basic info’ area. You can add anything here that helps you understand what this code does, where you found it, and why you are adding it to your website.

You can also assign tags to your code snippet. This will help you sort your code snippets by topic and functionality.

The priority field allows you to control the order in which the snippets are executed when you want to display multiple snippets in the same location. By default, all snippets get a priority of 10. If you want a snippet to display earlier than others, simply set the snippet priority to a lower number, like 5.

Lastly, you can use the powerful ‘Smart Conditional Logic’ section to either show or hide auto-inserted snippets based on a set of rules.

For example, you can show code snippets to logged-in users only, load code snippets only on specific page URLs, and more.

When you’re finished choosing options, you can click the ‘Save Snippet’ button in the top-right corner of the screen and toggle the switch from ‘Inactive’ to ‘Active.’

If you want to save the code snippet and not activate it, then simply click on the ‘Save Snippet’ button.

Once you have saved and activated the code snippet, it will be added to your site automatically, if that’s the insertion method you chose, or displayed as a shortcode.

Handling Errors in Custom Code

Often, if you make a mistake in adding the custom code in your site-specific plugin or theme file, then it would immediately make your site inaccessible.

You would start seeing a syntax error or a 500 internal server error on your site. To fix this you’ll need to manually undo your code using an FTP client.

The neat part about the WPCode plugin is that it will automatically detect a syntax error in the code and immediately deactivate it.

It will also show you a helpful error message, so you can debug the error.

WPCode’s smart code snippet validation will also detect any errors as you’re adding your custom code.

Hovering over the error will bring up instructions to help you fix it.

Managing Your Custom Code Snippets

WPCode plugin provides an easy user interface to manage your custom code snippets in WordPress.

You can save code snippets without activating them on your site, and then activate or deactivate the snippet at any time you want. It’s also possible to filter code snippets by type and location, and use tags to organize your code snippets easily.

You can also export specific code snippets or bulk export all of them.

Simply go to Code Snippets » Tools and click on the ‘Export’ tab.

If you’re moving websites to a different server, you can easily import your code snippets to the new site.

Just visit the Code Snippets » Tools » Import page and upload the export file.

We hope this article helped you learn how to easily add custom code in WordPress. Want to experiment with some code snippets on your website? Check out our list of extremely useful tricks for the WordPress functions file, and don’t forget to see our ultimate guide to speeding up your WordPress site.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Easily Add Custom Code in WordPress (Without Breaking Your Site) first appeared on WPBeginner.

Do you want to add an old post notification in WordPress?

If you have been producing content for some time now, then there is a chance that some of your content may be outdated.

In this article, we’ll show you how to easily add old post notification to your WordPress blog.

Why Add Old Post Notification to WordPress Blog Posts

Content decay (outdated blog posts) can be a bit of a problem for a growing WordPress blogs.

Depending on your niche, sometimes your content may become irrelevant, incorrect, or inappropriate over a period of time. This may cause a bad user experience, a higher bounce rate, and lower search rankings.

Ideally, you would want to edit those articles and update them with more useful, accurate, and up-to-date information.

But that’s not always possible because your site may have too many old articles, and you may not have enough resources to update them. In that case, adding an old post notification may be helpful for your users.

It will let them know that the content is a bit older, and they should keep this in mind when using the information presented on that page.

Another solution that many blogs use is by simply adding the ‘Last updated date’ instead of the publishing date.

That being said, let’s take a look at how you can add the old post notification in WordPress, and how to display the last updated date on your articles.

• Method 1. Display Old Post Notification Using a Plugin
• Method 2. Display Last Updated Date in WordPress
• Method 3. Display Old Post Notification without Plugin (Code Method)

Method 1. Display Old Post Notification Using Plugin

This method is easier and recommended for all users that want to display an old post notification.

First, you need to install and activate the DX Out of Date plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.

Upon activation, you need to visit the Settings » Out of Date page to configure plugin settings.

Here, you need to choose the period and duration. This is the time after which a post will be considered old by the plugin.

Below that you can provide a custom message to display on older posts and enable the notification to be displayed for all old posts. Don’t worry, you’ll be able to hide it for specific posts by editing them.

On the settings page, you can also choose post types, colors for the notification box, and add custom CSS if needed.

Don’t forget to click on the Save Changes button to store your settings.

You can now visit an old post on your website to see the plugin in action.

Hiding Old Post Notification on Individual Posts

Now let’s say you have an article that is older, but it is still accurate, up-to-date, and has great search rankings. You may want to hide the old post notification there.

Similarly, what if you have updated an old post with new information. The plugin will keep showing old post notification because it uses the post’s published date to determine its age.

To fix this, you can edit the post and scroll down to the ‘Out of Date Notification’ tab under the Post panel of the block editor. From here, simply uncheck the notification option and save your changes.

The plugin will now stop showing old post notification on this particular article.

Method 2. Display Last Modified Date for Your Posts

A lot of WordPress websites display the last modified date for their blog posts. Some replace the publish date with the last modified date as well.

The advantage of this method is that it shows users when a post was last updated without showing an old post message.

First, you need to install and activate the WP Last Modified Info plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, head over to Settings » WP Last Modified Info page to configure plugin settings.

On the settings page, you need to turn on the Global display of the last modified info toggle. After that, you can choose how you want to display the modified date.

You can replace the published date, show it before or after the content, or manually insert it into a post.

Below that, you’ll find a bunch of options. If you are unsure, then you can leave them to default.

Don’t forget to click on the Save Settings button to store your changes.

You can now visit your website to see the last updated information for all your blog posts.

This problem with this method is that it will show the last updated date for all posts including the newer posts.

You can set a time gap under plugin settings. But this gap is only limited to 30 days.

The plugin also provides three blocks that you can manually insert into a post or page to display last modified info.

You also have the option to use custom CSS to style your last updated date notice. We used the following custom CSS in the screenshots above.

p.post-modified-info {
    background: #fbffd8;
    padding: 10px;
    border: 1px solid orange;
    font-size: small;
    font-weight: bold;
}

Method 3. Add Old Post Notification Using Code

This method requires you to manually add code to your WordPress theme files. If you haven’t done this before, then take a look at our guide on how to add custom code snippets in WordPress.

Simply copy and paste the following code in your theme’s single.php template.

// Define old post duration to one year
$time_defined_as_old = 60*60*24*365; 

// Check to see if a post is older than a year
if((date('U')-get_the_time('U')) > $time_defined_as_old) {

$lastmodified = get_the_modified_time('U');
$posted = get_the_time('U');

//check if the post was updated after being published
 if ($lastmodified > $posted) {
 
// Display last updated notice
      echo '<p class="old-article-notice">This article was last updated ' . human_time_diff($lastmodified,current_time('U')) . ' ago</p>';   

  } else { 
// Display last published notice 
echo '<p class="old-article-notice">This article was published ' . human_time_diff($posted,current_time( 'U' )). 'ago</p>';

}
}

This code defines old posts to be any articles published at least one year ago.

After that, it checks if a post is older than a year. If it is, then it checks if the post was updated after publication. Then it displays a notice based on those checks.

Here is how it looked on our demo website for post that is old and was never updated.

Here is how it looked for a post that is old, but it was updated after being published.

We customized the old post notification with the following custom CSS.

p.old-article-notice {
    background: #fbffd8;
    padding: 10px;
    border: 1px solid orange;
    font-size: small;
    font-weight: bold;
}

We hope this article helped you learn how to easily display old post notification on your WordPress blog. You may also want to see our WordPress SEO guide or see our pick of the best popular posts plugins for WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Add Old Post Notification on Your WordPress Blog first appeared on WPBeginner.