WordPress Custom Fields 101: Tips, Tricks, and Hacks

Custom fields are a handy WordPress feature that allows you to add various additional data / information to your WordPress posts and pages.

A lot of popular WordPress plugins and themes use custom fields to store important data. You can also use custom fields to store your own data and then use it on your website.

In this article, we’ll show you how to use WordPress custom fields with some tips, tricks, and hacks.

Since this is a lengthy article, we have added a table of contents for easier navigation.

• What are WordPress custom fields?
• Adding custom fields in WordPress
• Display custom fields in WordPress themes
• Can’t find custom field in dropdown on post edit screen
• Creating user interface for custom fields
• Adding Custom Fields Using Advanced Custom Fields
• Hide empty custom fields with conditional statement
• Adding multiple values to a custom field
• Displaying posts with a specific custom key
• Add guest author name using custom field
• Display contributors to an article using custom fields
• Display custom fields outside the loop in WordPress
• Display custom header, footer, sidebar using custom fields
• Manipulate RSS feed content with custom fields
• Manipulate RSS feed title with custom fields
• Set expiration date for posts using custom fields

What are WordPress Custom Fields?

WordPress custom fields are metadata that are used to add additional information related to the post or page that you are editing.

By default, when you write a new post, page, or any content type, WordPress saves it into two different areas.

The first part is the body of your content that you add using the post editor.

The second part is the information about that particular content. For example, title, author, date, time, and more. This information bit of the post is called metadata.

WordPress automatically adds all the required metadata to each post or page you create.

You can also create and store your own metadata by using the custom fields.

By default, the custom fields option is hidden on the post edit screen. To view it, you need to click on the three-dot menu at the top-right corner of the screen and select ‘Options’ from the menu.

This will bring up a popup where you need to check the ‘Custom fields’ option under the Advanced Panels. After that, click on the ‘Enable & Reload’ button to reload the post editor.

The post editor will reload, and you’ll be able to see the custom fields panel below the content editor.

Custom fields can be used to add any information related to the post, page, or any content type. This meta-information can be displayed in your theme.

However, to do that you will need to edit your WordPress theme files.

This is why this tutorial is recommended for users familiar with editing theme files. It is also helpful for aspiring WordPress developers who want to learn how to properly use custom fields in their own themes or plugins.

Having said that, let’s take a look at how to add and use custom fields in WordPress.

Adding Custom Fields in WordPress

First, you need to edit the post or page where you want to add the custom field and go to the custom fields meta box.

Next, you need to provide a name for your custom field and then enter its value. Click on the Add Custom Field button to save it.

The field will be stored and displayed in the custom fields meta box like this:

You can edit this custom field any time you want and then click on the update button to save your changes. You can also delete it as needed.

Now you can save your post to store your custom field settings.

Displaying Custom Fields in WordPress Themes

To display your custom field on your website, you will need to edit your WordPress theme files. If you haven’t done this before, then take a look at our guide on how to copy and paste code in WordPress.

First, you will need to find the theme file that you need to edit to display your custom field. Ideally you would want to display it on a single post page. You will need to edit the single.php or content-single.php file.

You will need to enter your custom fields code inside the WordPress loop. Look for the line that looks like this:

<?php while ( have_posts() ) : the_post(); ?>

You want to make sure that you add your code before the following line:

<?php endwhile; // end of the loop. ?>

Now you need to add this code to your theme file:

<?php echo get_post_meta($post->ID, 'key', true); ?>

Don’t forget to replace key with the name of your custom field. For example, we used this code in our demo theme:

<p>Today's Mood: <?php echo get_post_meta($post->ID, 'Mood', true); ?></p>

You can now save your changes and visit the post where you added the custom field to see it in action.

Now you can use this custom field in all your other WordPress posts as well.

Simply create a new post or edit an existing one. Go to the custom fields meta box and select your custom field from the drop down menu and enter its value.

Click on ‘Add Custom Field’ button to save your changes and then publish or update your post.

Can’t Find Custom Field in Dropdown on Post Edit Screen

By default, WordPress only loads 30 custom fields in this form.

If you are using WordPress themes and plugins that already use custom fields, then there is a chance that those will appear first in the drop-down menu and you’ll not be able to see your newly created custom field.

To fix this issue, you’ll need to add the following code to your theme’s functions.php file or a site-specific plugin.

add_filter( 'postmeta_form_limit', 'meta_limit_increase' );
function meta_limit_increase( $limit ) {
    return 50;
}

The above code will change that limit to 50. If you still can’t see your custom field then try increasing that limit even further.

Creating a User Interface for Custom Fields

As you can see, that once you add a custom field, you will have to select the field and enter its value each time you write a post.

If you have many custom fields or multiple users writing on your website, then this is not an ideal solution.

Wouldn’t it be nice if you could create a user interface where users can fill in a form to add values to your custom fields?

This is what so many popular WordPress plugins already do. For example, the SEO title and meta description box inside the popular All in One SEO plugin is a custom meta box:

The easiest way to do this is by using the Advanced Custom Fields plugin.

Adding Custom Fields Using Advanced Custom Fields

First thing you need to do is install and activate the Advanced Custom Fields plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, you need to visit Custom Fields » Field Groups page and click on the add new button.

A field group is like a container of a set of custom fields. This allows you to add multiple panels of custom fields.

Now, you need to provide a title for your field group and then click on the the ‘Add Field’ button.

You can now provide a name for your custom field and select a field type. Advanced Custom Fields allows you to create all sorts of fields including text, image upload, number, dropdown, checkboxes, and more.

Scroll down, and you’ll see other options for that particular field. You can change them to your own requirements.

You can add multiple fields to your field group if you want. Once you are finished, click on the publish button to save your changes.

You can now edit a post or create a new one and you’ll see a new panel for your custom fields below the content editor.

For detailed step by step instructions, see our guide on how to add custom meta boxes in WordPress posts and post types.

Hide Empty Custom Fields with Conditional Statement

So far we have covered how to create a custom field and display it in your theme.

Now let’s see how to check if the custom field is not empty before displaying it. To do that, we will modify our code to first check if the field has data in it.

<?php 

$mood = get_post_meta($post->ID, 'Mood', true);

if ($mood) { ?>

<p>Today's Mood: <? echo $mood; ?></p>

<?php 

} else { 
// do nothing; 
}

?>

Don’t forget to replace Mood with your own custom field name.

Adding Multiple Values to a Custom Field

Custom fields can be reused in the same post again to add multiple values. You just need to select it again and add another value.

However, the code we have used in the above examples will only be able to show a single value.

To display all values of a custom field, we need to modify the code and make it return the data in an array. You will need to add the following code in your theme file:

<?php 
$mood = get_post_meta($post->ID, 'Mood', false);
if( count( $mood ) != 0 ) { ?>
<p>Today's Mood:</p>
<ul>
<?php foreach($mood as $mood) {
            echo '<li>'.$mood.'</li>';
            }
            ?>
</ul>
<?php 
} else { 
// do nothing; 
}
?>

Don’t forget to replace Mood with your own custom field name.

In this example, you would notice that we have changed the last parameter of get_post_meta function to false. This parameter defines whether the function should return a single value or not. Setting it to false allows it to return the data as an array, which we then displayed in a foreach loop.

Displaying Posts with a Specific Custom Key

WordPress allows you to display posts with custom keys and their values. For example, if you are trying to create a custom archive page to display all posts with specific custom keys, then you can use WP_Query class to query posts matching those fields.

You can use the following code as a starting point.

$args = array(
        'meta_key'   => 'Mood',
        'meta_value' => 'Happy'
);
$the_query = new WP_Query( $args );

<?php 
// the query
$the_query = new WP_Query( $args ); ?>

<?php if ( $the_query->have_posts() ) : ?>

        <!-- the loop -->
        <?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
                <h2><?php the_title(); ?></h2>
                <?php the_content(); ?>

        <?php endwhile; ?>
        <!-- end of the loop -->

        <!-- pagination here -->

        <?php wp_reset_postdata(); ?>

<?php else : ?>
        <p><?php _e( 'Sorry, no posts matched your criteria.' ); ?></p>
<?php endif; ?>

Don’t forget to replace meta_key and meta_value parameters with your own values.

Add Guest Author Name Using Custom Fields

Do you want to add a guest post but don’t want to add a new user profile just to add a single post? An easier way to do that is by adding guest author name as a custom field.

First, you need to add the following code in your theme’s functions.php file or a site-specific plugin.

add_filter( 'the_author', 'guest_author_name' );
add_filter( 'get_the_author_display_name', 'guest_author_name' );
function guest_author_name( $name ) {
global $post;
$author = get_post_meta( $post->ID, 'guest-author', true );
if ( $author )
$name = $author;
return $name;
}

This code hooks a function to the_author and get_the_author_display_name filters in WordPress.

The function first checks for the guest author name. If it exists, then it replaces the author’s name with the guest author name.

Now you will need to edit the post where you want to display the guest author name. Go to the custom fields meta box and add your guest author name.

For details, see our article on how to rewrite guest author name with custom fields in WordPress.

Display Contributors to an Article Using Custom Fields

On many popular blogs and news sites, multiple authors contribute to write an article. However, WordPress only allows a single author to be associated with a post.

One way to solve this problem is by using Co-Authors Plus plugin. To learn more, see our guide on how to add multiple authors on a WordPress post.

Another way to do that is by adding contributors as a custom field.

First you need to edit the post where you want to display co-authors or contributors. Scroll down to custom fields meta box and add author names as co-author custom field.

Now add this code to your theme files where you want to show co-authors.

<?php 

$coauthors = get_post_meta($post->ID, 'co-author', false);
if( count( $coauthors ) != 0 ) { ?>
<ul class="coauthors">
<li>Contributors</li>
<?php foreach($coauthors as $coauthors) { ?>
           <?php echo '<li>'.$coauthors.'</li>' ;
            }
            ?>
</ul>
<?php 
} else { 
// do nothing; 
}
?>

To display author names separated by commas, you can add the following custom CSS.

.coauthors ul { 
display:inline;
}
.coauthors li { 
display:inline;
list-style:none;
}
.coauthors li:after { 
content:","
}
.coauthors li:last-child:after {
    content: "";
}
.coauthors li:first-child:after {
    content: ":";
}

This is how it looked on our demo site.

Display Custom Fields Outside the Loop in WordPress

So far we have shown you all the examples where custom fields are displayed inside the WordPress loop. What if you needed to show them outside the loop? For example, in the sidebar of a single post.

To display the custom fields outside the WordPress loop add the following code:

<?php
global $wp_query;
$postid = $wp_query->post->ID;
echo get_post_meta($postid, 'key', true);
wp_reset_query();
?>

Don’t forget to replace the key with your custom field name.

Display Custom Header, Footer, Sidebar using Custom Fields

Usually most WordPress themes use the same header, footer, and sidebar on all pages. There are multiple ways to show different sidebars, header, or footer for different pages on your website. See our guide on how to display different sidebar for each WordPress post or page.

One way to do this is by using custom fields. Edit the post or page where you want to show a different sidebar and then add the sidebar as custom field.

Now you need to edit your WordPress theme files like single.php where you want to display custom sidebar. You will be looking for the following code:

<?php get_sidebar(); ?>

Replace this line with the following code:

<?php 
global $wp_query;
$postid = $wp_query->post->ID;
$sidebar = get_post_meta($postid, "sidebar", true);
get_sidebar($sidebar);
wp_reset_query();
?>

This code simply looks for the sidebar custom field and then displays it in your theme. For example, if you add wpbpage as your sidebar custom field, then the code will look for sidebar-wpbpage.php file to display.

You will need to create sidebar-wpbpage.php file in your theme folder. You can copy the code from your theme’s sidebar.php file as a starting point.

Manipulating RSS feed Content with Custom Fields

Want to display additional meta data or content to your RSS feed users? Using custom fields you can manipulate your WordPress RSS feed and add custom content into your feeds.

First you need to add the following code in your theme’s functions.php file or a site-specific plugin.

function wpbeginner_postrss($content) {
global $wp_query;
$postid = $wp_query->post->ID;
$coolcustom = get_post_meta($postid, 'coolcustom', true);
if(is_feed()) {
if($coolcustom !== '') {
$content = $content."<br /><br /><div>".$coolcustom."</div>
";
}
else {
$content = $content;
}
}
return $content;
}
add_filter('the_excerpt_rss', 'wpbeginner_postrss');
add_filter('the_content', 'wpbeginner_postrss');

Now just create a custom field called “coolcustom” and add any value you like. You can use it to display advertisements, images, text, or anything you want.

Manipulate RSS Feed Title with Custom Fields

Sometimes you may want to add extra text to a post title for RSS feed users. For example, if you are publishing a sponsored post or a guest post.

First you add the following code in your theme’s functions.php file or a site-specific plugin.

function wpbeginner_titlerss($content) {
global $wp_query;
$postid = $wp_query->post->ID;
$gpost = get_post_meta($postid, 'guest_post', true);
$spost = get_post_meta($postid, 'sponsored_post', true);

if($gpost !== '') {
$content = 'Guest Post: '.$content;
}
elseif ($spost !== ''){
$content = 'Sponsored Post: '.$content;
}
else {
$content = $content;
}
return $content;
}
add_filter('the_title_rss', 'wpbeginner_titlerss');

Next, you need to edit the post where you want to display the extra text in the title field and add guest_post and sponsored_post in custom fields.

If any of these two custom fields are found with a value “true”, then it will add the appropriate text before the title. This technique can be utilized in various ways to fit whatever you like.

Want to learn more cool RSS feed hacks? See our guide on how to add content and manipulate your WordPress RSS feeds.

Set Expiration Date for Posts in WordPress Using Custom Fields

Want to set an expiration date for some posts on your WordPress site? This comes handy in situations when you want to publish content only for a specific period like running surveys or limited time offers.

One way to do this is by manually removing the post content or by using a plugin like Post Expirator plugin.

Another way to do this is by using custom fields to automatically expire posts after a specific time.

You will need to edit your theme files and add modify the WordPress loop like this:

<?php
if (have_posts()) :
while (have_posts()) : the_post(); 
$expirationtime = get_post_meta($post->ID, "expiration", false);
if( count( $expirationtime ) != '' ) { 
if (is_array($expirationtime)) {
$expirestring = implode($expirationtime);
}

$secondsbetween = strtotime($expirestring)-time();
if ( $secondsbetween >= 0 ) {
echo 'This post will expire on ' .$expirestring.'';
the_content();
} else { 
echo "Sorry this post expired!"
}
} else { 
the_content();
} 
endwhile;
endif;
?>

Note: You will need to edit this code to match your theme.

After adding this code, you can add the expiration custom field to the post you want to expire. Make sure you add the time in this format mm/dd/yyyy 00:00:00.

Style Individual Posts Using Custom Fields

Want to change the look of an individual post using CSS? WordPress automatically assigns each post its own class which you can use to add custom CSS.

However, using custom fields you can add your own custom classes and then use them to style posts differently.

First you need to edit a post that you would like to style differently. Go to custom fields box and the post-class custom field.

Next, you need to edit your WordPress theme files and add this code at the beginning of WordPress loop.

<?php $custom_values = get_post_meta($post->ID, 'post-class'); ?>

Now you need to find a line with the post_class() function. Here is how it looked in our demo theme:

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

Change this line to include your custom field value, like this:

<article id="post-<?php the_ID(); ?>" <?php post_class($custom_values); ?>>

Now if you examine the post’s source code using Inspect tool, then you will see your custom field CSS class added to the post class.

Now you can use this CSS class to add custom CSS and style your post differently.

That’s all, we hope this article helped you learn more about WordPress custom fields. You may also want to see our ultimate step by step guide to boost WordPress speed and performance for beginners.

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 WordPress Custom Fields 101: Tips, Tricks, and Hacks appeared first on WPBeginner.

April 16, 2020 at 07:00PM

How to Create a Welcome Mat for Your WordPress Site (+ Examples)

Do you want to add a full-screen welcome mat to your website?

A welcome mat is a full screen dynamic overlay that can help you get more newsletter subscribers, eBook downloads, sales to your products, etc.

In this article, we’ll share how to create a welcome mat for your WordPress site along with some great welcome mat examples to learn from.

Why a Welcome Mat Can Boost Your Conversions

More than 70% of visitors leaving your website will never return, unless you convert them into an email subscriber or a customer.

A welcome mat is a large, fullscreen interstitial that blocks the view of the rest of your website’s content to capture user’s attention.

That might sound like a bad idea, but it’s a great way to get your message in front of visitors straight away.

If visitors don’t want what you’re offering, then they can simply close the welcome mat.

Similar to exit-intent popups, welcome mats are effective in driving high conversion rates.

Of course, you’ll want to give people a good reason to sign up. If you don’t already have a lead magnet, then you could offer a discount code or even a freebie.

Here are two very different welcome mat examples that have very high conversion rates:

The above is a welcome mat that we use on our WPForms blog, and it converts very well.

The screenshot below is a welcome mat that we use to give one of our lead magnets that does a really good job in getting users to join our email newsletter:

That being said, let’s take a look at how to easily add a welcome mat to your website.

How to Create a Welcome Mat for Your Website

First, you need to sign up for an OptinMonster account. It is the best lead generation software in the world and allows you to easily create optin forms including welcome mats.

Note: WPBeginner founder, Syed Balkhi, first built OptinMonster to help grow our own subscribers and sales. Now it’s a premium plugin that’s used by hundreds of thousands of websites.

Next, you’ll need to install and activate the OptinMonster WordPress plugin. For more details, see our step by step guide on how to install a WordPress plugin.

The plugin connects the OptinMonster app to your website. Once you’ve activated the plugin, click on the OptinMonster menu in your WordPress dashboard to connect your account.

After that, you’re ready to create your welcome mat.

Creating a Welcome Mat for Your Website

In your WordPress dashboard, click the ‘Create New Campaign’ button to start creating your welcome mat.

This will take you to the OptinMonster website.

Next, choose ‘Fullscreen’ for your campaign type.

You’ll need to choose a template for your campaign. We’re going to use the ‘Entrance’ template, but you can pick a different one if you want.

After you click the ‘Use Template’ button, you’ll see a campaign builder screen like this:

You can change anything you like here. You’ll want to edit the text to correspond to your own offer, of course.

Simply click on any element, and you’ll see that you can edit it in the left-hand pane.

Next, go to Optin Settings » Fullscreen Background. Click on ‘Background Color’ and set the A (Alpha) value to 100.

This ensures that your welcome mat won’t be transparent at all, so none of your site content will show through.

The next step is to let your welcome mat slide in. You can do this by clicking the ‘Home’ button on the left-hand side then clicking ‘Fullscreen Settings’.

From here, you need to toggle the ‘Display a Page Slide?’ option on, so that it’s green.

This means that your welcome mat will slide down from the top of the screen instead of fading into view.

Next, you need to switch to the ‘Success’ view of your welcome mat. This is what your users will see after they perform the desired action.

Once you’re happy with your welcome mat, you can set up how it’s going to display on your site.

Getting Your Welcome Mat to Display on Your Site

You can set how you want to display your welcome mat popup by switching to the Display Rules tab in OptinMonste.

By default, OptinMonster campaigns display on all pages of your site after the visitor has been there for 5 seconds. Since this is a welcome mat, you’ll probably want it to display immediately. Just change this value to 0 seconds.

By default, the welcome mat will display on every page of your site. You can easily include or exclude specific pages by using OptinMonster’s personalization rules.

There are a lot of other personalization and targeting options like user’s location, what items they have in their eCommerce cart, what have they done previously on your site, etc.

Once you are ready to make your welcome mat live, simply click ‘Publish’ at the top of the screen. You will need to switch the toggle next to ‘Status’ so that it shows ‘Live’.

Don’t forget to click ‘Save’ to save your changes.

Now, head to your WordPress website and click on the OptinMonster menu item. You should see your welcome mat campaign, plus any other campaigns you’ve created.

If it’s not appearing, just click ‘Refresh Campaigns’ to fetch data from the OptinMonster website.

To check out your campaign, you can visit your website in a new incognito browser window. You should see your welcome mat slide in seamlessly from the top of your screen.

Examples of Great Welcome Mats

Let’s take a look at some welcome mat examples from different industries. For each, we’ll go through what they’re doing well, plus any minor changes we might suggest.

1. Singularity

This welcome mat from Singularity prompted users to sign up and watch the livestream of the Singularity University Global Summit. It was hugely successful and captured over 2,000 new email signups in under 9 days.

We particularly liked the great use of the logo, the clear fonts, and the bright “Remind Me!” button.

2. Goins, Writer

This welcome mat from Goins, Writer offers a free guide. It’s a clear, simple offer, and the minimalist design is in keeping with the rest of the website.

We felt that the “Yes” and “No Thanks” buttons are clear and easy to use, and the use of numbers in the headline makes for a compelling offer.

3. AVweb

This welcome mat has a large, clear image of a small airplane. It’s instantly eye-catching.

We liked the great image, and the clear “Sign Me Up!” call to action. One small possible tweak would be to shorten the tagline to avoid having it cover the top of the airplane.

4. Loaded Landscapes

This welcome mat from Loaded Landscapes is a little different from other examples. The background is slightly transparent.

We liked the clear offer and the enthusiasm of the red call to action button. The background of the site beneath the welcome mat could be a little distracting, so it might be worth changing it to be fully opaque, however.

5. OptimizeMyBnb

This welcome mat was used on a specific page, linked to from a book the website owner sold through third-party retailers. These retailers didn’t pass on customers’ details, though. Using a welcome mat in this way helped capture customers’ email addresses.

We felt the very clear headline, subheading, and call to action text all worked well. However, we thought that “item” on the button should probably be “items” plural. This highlights the importance of carefully proofreading your welcome mat’s text.

There are dozens more full screen welcome mat examples that you can see, but we didn’t add them all in this guide.

If you’re looking for more inspiration, here are some things you can do with a fullscreen welcome mat:

• Present a targeted offer or coupon
• Showcase new products and services
• Let visitors know what to expect from the site
• Win new subscribers by highlighting their best content
• Point visitors to their social media profiles
• Collect email subscribers as part of a prelaunch phase

If you’re serious about improving your website conversions, then welcome mat and even exit fullscreen interstitial are one of the highest converting items you can add to your website.

We hope this article helped you learn how to create a welcome mat for your website and that you found the examples inspiring. You may also want to take a look at our comparison of the best email marketing services and our list of the must have WordPress plugins.

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 Create a Welcome Mat for Your WordPress Site (+ Examples) appeared first on WPBeginner.

April 15, 2020 at 05:42PM

How to Add Navigation Menu in WordPress (Beginner’s Guide)

Do you want to add a navigation menu to your WordPress site?

WordPress comes with a drag and drop menu interface that you can use to create header menus, menus with dropdown options, and more.

In this step by step guide, we will show you how to easily add a navigation menu in WordPress.

What is a Navigation Menu?

A navigation menu is a list of a links pointing to important areas of a website. They are usually presented as a horizontal bar of links at the top of every page on a website.

Navigation menus give your site structure and help visitors find what they’re looking for. Here’s how the navigation menu looks on WPBeginner:

WordPress makes it really easy to add menus and sub-menus. You can add links to your most important pages, categories or topics, blog posts, and even custom links such as your social media profile.

The exact location of your menu will depend on your WordPress theme. Most themes will have several options, so you can create different menus that can be displayed in different places.

For instance, most WordPress themes come with a primary menu that appears on the top. Some themes may include a secondary menu, a footer menu, or a mobile navigation menu as well.

Creating Your First Custom Navigation Menu

To create a navigation menu, you need to visit the Appearance » Menus page in your WordPress admin dashboard.

First, you need to provide a name for your menu, like ‘Top Navigation Menu’ and then click the ‘Create Menu’ button. This will expand the menu area, and it will look like this:

Next, you can choose the pages you want to add to the menu. You can either automatically add all new top-level pages, or you can select specific pages from the left column.

First, click the ‘View All’ tab to see all your site’s pages. After that click the box next to each of the pages you want to add to your menu, and then click on the ‘Add to Menu’ button.

Once your pages have been added, you can move them around by dragging and dropping them.

Note: All menus have their items listed in a vertical (top to bottom) list in the menu editor. When you put the menu live on your site, it’ll either display vertically or horizontally (left to right), depending on the location you select.

Most themes have several different locations where you can put menus. In this example, we’re using the default 2020 theme, which has 5 different locations.

After adding pages to the menu, select the location where you want to display the menu and click on the ‘Save Menu’ button.

Tip: If you’re not sure where each location is, try saving the menu in different places, then visiting your site to see how it looks. You probably won’t want to use all the locations, but you might want to use more than one.

Here’s our finished menu on the site:

Creating Drop-Down Menus in WordPress

Drop-down menus, sometimes called nested menus, are navigation menus with parent and child menu items. When you run your cursor over a parent item, all the child items will appear beneath it in a sub-menu.

To create a sub menu, drag an item below the parent item, and then drag it slightly to the right. We’ve done that with 3 sub-items beneath ‘Services’ in our menu:

Here’s the sub-menu live on the site:

You can even add multiple layers of dropdown, so that your sub menu can have a sub menu. This can end up looking at bit cluttered, and many themes do not support multi-layer drop-down menus.

In this example, you can see that ‘Logo Design’ (a child item of ‘Services’) has two child items of its own.

Adding Categories to WordPress Menus

If you’re using WordPress to run a blog, then you may want to add your blog categories as a drop-down in your WordPress menu. We do this on WPBeginner:

You can easily add categories to your menu by clicking the Categories tab on the left side of the Menus screen. You may also need to click the ‘View All’ tab to see all your categories.

Simply select the categories you want to add to the menu, and then click the ‘Add to Menu’ button.

The categories will appear as regular menu items at the bottom of your menu. You can drag and drop them into position. We’re going to put all of these categories under the Blog menu item.

Do you want to have a blog page on your site that’s separate from your homepage? If so, check out our tutorial on how to create a separate page for blog posts in WordPress.

Adding Custom Links to Your WordPress Navigation Menus

Aside from categories and pages, WordPress also makes it super easy to add custom links to your menu. You can use it to link to your social media profiles, your online store, and / or other websites that you own.

You will need to use the ‘Custom Links’ tab on the Menu screen. Simply add the link along with the text you want to use in your menu.

You can even get creative and add social media icons in your menu.

Editing or Removing a Menu Item in WordPress Navigation Menus

When you add pages or categories to your custom navigation menu, WordPress uses the page title or category name as the link text. You can change this if you want.

Any menu item can be edited by clicking on the downward arrow next to it.

You can change the name of the menu item here. This is also where you can click ‘Remove’ to take the link off your menu altogether.

If you’re struggling with the drag and drop interface, then you can also move the menu item around by clicking the appropriate ‘Move’ link.

Adding WordPress Menus in Sidebars and Footers

You don’t have to just stick to the display locations for your theme. You can add navigation menus in any area that uses widgets, like your sidebar or footer.

Simply go to Appearance » Widgets and add the ‘Navigation Menu’ widget to your sidebar. Next, add a title for the widget and choose the correct menu from the ‘Select Menu’ drop down list.

Here’s an example of a custom WordPress footer menu built on Syed Balkhi website.

Going Further with Navigation Menus

If you want to create a truly epic menu with loads of links, we’ve got a tutorial on how to create a mega menu in WordPress. This lets you create a drop-down with lots of items including images.

Mega menus are a great option if you have a large site, like an online store or news site. This type of menu is used by sites like Reuters, Buzzfeed, Starbucks, etc.

We hope this article helped you learn how to add a navigation menu in WordPress. You may also want to check out our guides on how to style navigation menus in WordPress and how to create a sticky floating navigation menu in 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 Navigation Menu in WordPress (Beginner’s Guide) appeared first on WPBeginner.

April 14, 2020 at 05:17PM

How to Buy a Domain Name That is Taken (9 Pro Tips)

We often hear from readers who want to buy a domain name that’s already been taken.

If you’re in that position, then you might be wondering how to go about getting hold of a domain name that someone already owns.

The easiest solution would be to find another suitable domain name. However, sometimes this may not be the best option.

In this article, we’re going to share our expert tips on how to buy a taken domain and give you some insider tips on what to watch out for. We will also cover few proven strategies that you can use if your domain isn’t available.

Note: Unlike other guides on the internet, this resource is based on our actual collective experience of buying premium domains. We have spent anywhere from few hundred to few million dollars in buying premium domains and established website businesses.

The Basics of Buying a Domain Name That’s Already Taken

All websites need a domain name. It is your website’s address on the internet. See our beginner’s guide on how domain names work if you’re not 100% sure what a domain name actually is.

You can register a new domain name for around $10 – $15 from any of the top domain registrars. Alternatively, you can even get a free domain name when you sign up with hosting companies like Bluehost, Dreamhost, etc.

But what if the domain name you want is already taken?

In that case, you have two options: come up with a different name or buy the one you really want from it’s current owner.

Buying a taken domain name from someone who’s already registered it could be a great move for your business.

However, it’s important to beware of risks and scams, so you don’t waste time or money. That’s why we have put together these tips on how to buy a taken domain as safely as possible.

What to Consider Before Buying a Domain Name

One key question to ask yourself is whether you want to purchase a domain name alone or an established website.

Buying a website, if it’s one that has a consistent track record of making money, can be a great shortcut. It lets you get a money-making business straight away rather than having to build one from scratch.

However, it’s going to be way more expensive to buy a website than just a domain name. You’ll also have more risks and legal liabilities to consider.

How to Actually Buy a Taken Domain Name

There are two main routes to buying domain names that are already taken:

• Privately approaching the domain name’s owner and agreeing on the sale
• Look for the name in domain marketplaces.

The first method avoids involving a third-party into the sale, and you may be able to persuade the owner towards more favorable pricing.

If the domain name already has a website with a contact form, then you can use that to reach out to the site owner.

Alternatively, you can search for it using the Domain WHOIS tool. You may be able to get the contact details of the owner from the domain details there.

The second method is to look for the name using online domain marketplaces. This is where many domain owners go to sell their domain names.

We recommend using Domain.com. It is one of the best places to register a domain name or buy a domain name for sale.

Simply search for the domain name you are looking for to see if it is available for sale.

Domain names that are already taken may be highlighted as a premium domain name with a higher price. If you find the domain name listed there, then you can add it to the cart and proceed to payment.

You can try multiple domain marketplaces like Sedo, Flippa, etc to see if the domain is listed for sale there.

If the domain name is not listed anywhere, then it is probably not available for sale. You can still try the first method of approaching the owner with your offer.

That being said, let’s take a look at tips on making sure that you buy your domain name safely.

Tip 1. Avoid Using a Different Extension Instead

If you find that your domain name is taken when using a .com, then you might be tempted to use a different domain extension like .net or .org.

However, this can cause problems as people may forget your domain name and type in .com or .org.

You may even face legal issues if the .com owner argues that you’re trying to infringe on their brand name. This is particularly the case if they’ve registered it as a trademark.

We cover more on why you need a .com domain in our article on how to choose the best domain name.

Tip 2. Check the Domain Name isn’t a Registered Trademark

If the domain name is a registered trademark of an existing business, then you could end up having to take your website offline completely in the future.

It’s well worth doing a quick search of the US trademark database to check whether your domain name is already being used by another company. You may also want to check local databases too.

Even a domain name that uses a trademark within it could be a problem. For instance, you can’t use the word “WordPress” in your domain name.

Tip 3. Don’t Get Too Emotionally Attached

Starting a new online business idea is exciting. Since your domain name plays a crucial role, it’s easy to get emotionally attached to a specific name.

However you need to be smart and rational about all financial investment decisions, including this one.

We recommend keeping your options open and look around for multiple domain names, or at least give them serious considerations.

This will help you in negotiation, so you can get the best deal without overpaying for your domain name.

Remember, the cost of premium domain names can vary from few hundred dollars to a few hundred thousand dollars.

Having options make sure that you don’t end up paying a huge sum of money for a domain name that’s really not any better than something else that was 1/10th of the price.

Tip 4. Check if a Website Has Ever Been Built There

Make sure that you check website history using the Wayback Machine. It is possible that the domain name may have been used by someone else.

It is alright if the domain name has been used before, but you want to make sure that it wasn’t used for malicious, spammy, or illegal activities.

This may harm your business’ reputation and may even cause legal issues in the future. If there’s a Google penalty on the domain, then that could take a lot of work and resources to wipe out.

WayBack Machine is also a smart way of finding domain owner information as well.

Tip 5. Figure Out What the Domain is Worth

Domain name pricing is tricky. If you’re new to buying domains, then you might wonder whether the price you’re being quoted is a bargain, a rip-off, or something in between.

Well, the truth is that there is no standard regulation for premium domain name pricing. Sellers independently decide the price, and it’s up to you as a buyer to decide if it’s worth the investment.

Premium domain names can range from few hundred dollars to a few hundred thousand dollars. Some rare premium domain names even go into the million dollar range.

If you’re new, then you can use a tool like EstiBot to get a general idea of what the domain may be worth.

Disclaimer: Automatic domain name evaluations aren’t necessarily very accurate, but they do show similar domain sales data which is helpful.

If the domain is priced too high (and it often will be), then you’ll need to be prepared to haggle. Don’t start by offering the maximum you’d be willing to consider. Instead, start at a lower price with the expectation that you’ll likely end up meeting half-way.

Keep in mind that there’s a limit to how low the seller will go. Don’t expect someone to accept $500 if they originally asked for $20,000.

However just because someone asked for $20,000 doesn’t mean you need to meet them half way either. We’ve often secured $20k domain deals in the $3k – $6k range.

Tip 6. Know Exactly What You’re Buying

Make sure you know exactly what you’re going to be getting. Is it just the domain name you’re buying? Or are you buying a website too? If you’re buying the website, then does this include all the content?

Established websites may well use lots of different plugins and tools that the owner has licenses for. It’s unlikely that these licenses will be transferred over to you along with the sale, so you’ll need to be prepared to purchase them for yourself.

You’ll also want to be clear on whether you’re receiving assets like the website’s email list data.

If the domain name or website is a large purchase, then you should definitely have a lawyer draw up a contract for you. Consult someone who’s an expert in IP (Intellectual Property) law.

Even if you’re making a small purchase, be sure to get crucial details in writing at the very least.

Bonus: ask if the owner has access to existing social media accounts for the domain name, so you can get that as part of the deal.

Tip 7. Make Sure You’re Buying From the Domain’s Owner

Imagine this. You hand over your money for a domain name, only to find that the domain has been stolen. You never see your money again, and you’re not the legal owner of the domain either.

It’s a nightmare scenario, but unfortunately, it can happen. A good initial check is to use a tool such as DNS Trails to see whether there have been any recent changes to the DNS records. If you see something odd, then ask for an explanation.

If all your contact with the domain name owner has been through email, it’s well worth getting a phone number, so you actually talk to them. Email accounts can be hacked and email addresses can be faked.

Tip 8. Use Escrow to Transfer the Money

You might be nervous about buying a domain name, particularly for a significant sum. What if the seller takes your money and doesn’t hand over the domain name?

The best solution is to use a site like Escrow.com. You give your money to the site, and they hold it securely until you confirm you’ve received the domain name. At that point, they hand the money to the seller.

Escrow.com has been used for the purchase of some hugely famous domain names, including Twitter.com, Gmail.com, WordPress.com and more. Note that you will need to pay a fee to Escrow.com.

Important: Don’t take a shortcut here and try to save on Escrow fees. We always use Escrow for domain purchases unless the domain owner is willing to transfer the domain to us before receiving payments. Trust us, it’s not worth the risk!

Tip 9. Consider Backordering a Domain You Want

Every day, thousands of domain names get expired and are not renewed or registered. A lot of businesses fail to take off or the domain owners lose interest.

In some cases, the owner might simply forget to re-register the domain.

You don’t have to watch the domain name to see when it’s about to expire. Instead, there are plenty of services that will monitor the domain name on your behalf. They’ll automatically try to register it the moment it’s available.

You can use GoDaddy for domain backorders. There are plenty of other sites that offer a similar service too.

The problem with back-ordering is that it may not work at all. The domain owner may renew their domain name, or someone else may have placed a backorder before you which will be given priority.

Final Thoughts + Alternative Strategies

Buying a domain name that’s already taken is not easy, and the process can take anywhere from few days to a few months. And if the owner doesn’t want to sell, then it can even take years to convince them.

This is why we always recommend having few options when you’re searching for domains. You can use a domain name generator like Nameboy to come up with ideas.

Here are some clever tips that can help you come up with alternatives:

• Add a verb to your keyword – for example: getpocket.com, getcloudapp.com, and tryinteract.com
• Extend your brand with a keyword – for example: invisionapp.com, gogoair.com, etc. Remember Tesla didn’t own tesla.com, so they started with TeslaMotors.com. Buffer didn’t own buffer.com, so they used bufferapp.com in the beginning.
• Use abbreviations – for example: wpbeginner.com, wpforms.com, etc.
• Use a catch phrase or adjective – for example: optinmonster.com, trustpulse.com, monsterinsights.com, etc.

We hope this article helped you learn how to buy a domain name that’s taken. You may also want to see our guide on proven ways to make money online, and our comparison of the best website builder platforms.

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 Buy a Domain Name That is Taken (9 Pro Tips) appeared first on WPBeginner.

April 13, 2020 at 07:01PM