How to Highlight Text in WordPress (Beginner’s Guide)

Category Image 052

Are you looking for a way to highlight text in a WordPress post or page?

Highlighting text can help point the user’s attention to a specific part of your content. This can be great to show off a call to action, a special offer, or to simply add emphasis on specific sentences.

In this article, we will show you how to easily highlight text in WordPress.

Adding text highlight color in WordPress

Why and When to Highlight Text in WordPress

Text highlighting is an easy way to emphasize important information in your content. It helps you direct the user’s attention to details that you don’t want them to miss.

For instance, highlighting a discount offer on your WordPress website in a different color will draw the reader’s attention to it, helping you generate more sales.

Here’s a sample of what text highlighting might look like in a blog post:

Preview for highlighting text in the block editor

Highlighting text in a different color can also help users with visual impairments or reading difficulties to navigate and understand the content more easily. It can even enhance the appearance of your content and make it more visually appealing.

However, highlighting too much text on your page can be distracting and reduce its effectiveness. That’s why we recommend only highlighting very important text like calls to action, warnings, and other details that readers should pay attention to.

That being said, let’s take a look at how to easily highlight text in WordPress. You can use the quick links below to jump to the method you wish to use:

Method 1: Highlight Text in WordPress Using the Block Editor

This method is for you if you want to easily highlight text in WordPress using the block editor.

First, you will need to open up an existing or new post in the block editor from the WordPress admin sidebar.

Once you are there, simply select the text that you want to highlight and then click the ‘More’ icon in the block toolbar at the top.

This will open up a dropdown menu where you must the ‘Highlight’ option from the list.

Expand the More dropdown menu from the block toolbar and select the Highlight option

A color picker tool will now open up on your screen. From here, you will first need to switch to the ‘Background’ tab.

After that, you can choose a default highlight color from the given options.

You can also select a custom color to highlight text by clicking on the ‘Custom’ option to launch an ‘Eyedropper’ tool.

Choose a highlight color from the color picker tool

Finally, don’t forget to click the ‘Publish’ or ‘Update’ button to save your changes.

You can now visit your website to check out the highlighted text in action.

Preview for highlighting text in the block editor

Method 2: Highlight Text in WordPress Using WPCode (Recommended)

If you want to consistently use a specific color to highlight text all over your WordPress website, then this method is for you.

You can easily highlight text in WordPress by adding CSS code to your theme files. However, the smallest error when entering the code could break your website, making it inaccessible.

That’s why we recommend using WPCode, which is the best WordPress code snippet plugin on the market. It is the easiest and safest way to add code to your website without directly editing your theme files.

Create a Code Snippet With WPCode

First, you need to install and activate the free WPCode plugin. For more instructions, please see our beginners’ guide on how to install a WordPress plugin.

Upon activation, head over to the Code Snippets » + Add Snippet page from the WordPress admin sidebar.

Next, just click the ‘Use Snippet’ button under the ‘Add Your Custom Code (New Snippet)’ option.

Add new snippet

This will take you to the ‘Create Custom Snippet’ page, where you can start by typing a name for your code snippet.

After that, you need to select the ‘CSS Snippet’ option from the ‘Code Type’ dropdown menu.

Note: The ‘CSS Snippet’ option is only available in the premium version of WPCode. If you are using the free version, then you will have to select the ‘Universal Snippet’ option instead.

CSS Snippet as code type for the highlighting text in WordPress

Next, click inside the ‘Code Preview box’.

Then, you have to copy and paste the following code:

mark {
background-color: #ffd4a1;
}

Once you have done that, add the hex code for your preferred highlight color next to the background-color line in the code.

In our example, we are using #ffd4a1, which is a light brown color.

Paste the code snippet to highlight text in WordPress

After that, scroll down to the ‘Insertion’ section.

From here, select the ‘Auto Insert’ method to automatically execute the code upon activation.

Choose an insertion method

Next, head to the top of the page and toggle the ‘Inactive’ switch to ‘Active’.

Finally, click the ‘Save Snippet’ button to store your changes.

Save text highlight code snippet

Highlight Text in the Block Editor

Now that the CSS snippet has been activated, we will have to add some HTML code in the block editor to highlight the text in WordPress.

First, open up an existing or new post in the WordPress block editor.

From here, click on the ‘Options’ icon in the block toolbar at the top. This will open up a new dropdown menu where you must select the ‘Edit as HTML’ option.

Choose the edit as HTML option from the Options dropdown menu in the block toolbar

You will now see the block content in HTML format.

Here, simply wrap the text that you want to highlight inside the <mark> </mark> tags like this:

<mark>highlighted-text</mark>

This will highlight the text in the hex color that you choose in your WPCode snippet.

After that, click the ‘Edit Visually’ option in the block toolbar. to switch back to the visual editor.

Write HTML code on both sides of the text that you want to highlight

Once you are done, go ahead and click the ‘Update’ or ‘Publish’ button to save your changes.

Now, you can visit your website to check out the highlighted text in action.

Demo of highlighting text in WordPress

We hope this guide helped you learn how to highlight text in WordPress. You may also want to see our guide on how to customize colors in WordPress to make your website more aesthetically pleasing and our comparison of the best email marketing services to grow your traffic.

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 Highlight Text in WordPress (Beginner’s Guide) first appeared on WPBeginner.

How to Add Additional User Profile Fields in WordPress Registration

Category Image 091

Do you want to add extra profile fields for users to fill in when they register on your WordPress website?

Maybe you want to allow users to submit their social media profiles. Or you might want them to submit their business phone number when registering. This can all be done by adding additional profile fields.

In this article, we will show how to easily add additional user profile fields in WordPress registration forms.

Adding additional user profile fields in WordPress registration

Why Add Additional User Profile Fields in WordPress Registration?

By adding more user profile fields to your WordPress website’s registration form, you can collect extra information from users to improve your marketing campaigns, personalize content, or simply learn more about your audience.

For example, you can ask your users to provide their phone numbers or social media profiles when registering on your WordPress site.

This way, you will be able to send targeted SMS messages to your users or can ask them to promote your WordPress blog on their social media accounts.

All of these extra fields can be handy if you run a membership website or allow users to sign up as subscribers to your blog. They can also be helpful if you want to store extra contact information for the other writers on your multi-author blog.

That being said, let’s see how to easily add additional user profile fields in WordPress. For this tutorial, we will be discussing two methods, and you can use the links below to jump to the method of your choice:

Method 1: Add Custom User Profile Fields Using Advanced Custom Fields (Recommended)

The best way to add extra user profile fields in WordPress is to use the Advanced Custom Fields plugin. It lets you choose from multiple fields and customize them to fit your needs.

First, you need to 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 head to the ACF » Field Groups page from the WordPress admin sidebar and click the ‘+ Add Field Group’ button.

Click the Add Field Group button

This will take you to a new page where you can start by typing a name for the field group.

Keep in mind that this will be the name of the entire field group and not the individual user’s field.

Type field group name

After that, scroll down to the ‘Fields’ section and choose a field type from the dropdown menu.

For example, if you want users to provide their phone number upon registration, then you can choose the ‘Number’ option. Alternatively, if you want users to provide their social media profiles, then you can pick the ‘Text’ option.

Choose a field type from the dropdown menu

Once you have done that, just type the name of your field into the ‘Field Label’ option. For instance, if you want users to provide their Twitter handle before registering, then you can enter that into the field.

The plugin will then automatically generate a field name according to your label name.

Add field name and label

Next, you must switch to the ‘Validation’ tab from the top. From here, you can make the field required by toggling on the switch. This way, users won’t be able to register on your WordPress site without filling in the additional field.

After that, you can even set a character limit for your custom field.

Toggle the Required switch for the additional field

Now, switch to the ‘Presentation’ tab from the top.

Once you are there, you can add placeholder text, instructions, and wrapper attributes for your additional user profile field.

Configure the Presentation settings

Next, scroll down to the ‘Settings’ section and make sure that the ‘Location Rules’ tab is selected. From here, you must set up conditional logic for your custom field so that it will only be displayed for your WordPress site registration.

To do this, select the ‘User Form’ option from the dropdown menu in the left corner of the screen. After that, choose the ‘Register’ option from the dropdown menu in the right corner.

Add conditional logic for the additional user field

Finally, click the ‘Save Changes’ button at the top of the screen to store your settings.

If you want to add another additional field, then you can also click the ‘+ Add Field’ button.

Save the additional field

Now visit your user registration page to view the additional user profile field in action.

This is how it looked on our demo website.

Preview for additional user profile field

Method 2: Add Additional User Profile Fields With Profile Extra Fields (Easy & Simple)

This method allows you to quickly and easily add extra fields to user profiles and user registration forms in WordPress. It is a little less flexible, but it gets the job done.

First, you need to install and activate the Profile Extra Fields plugin. If you are not sure how to do this, then you can check out our full guide on how to install a WordPress plugin.

Once the plugin is activated, it’s time to create some additional user profile fields to use on your registration forms.

We are going to create a phone number field as an example, but you can add as many of these fields as you want.

First, visit the Profile Extra Fields » Add New page from the WordPress admin sidebar. From here, type the name of the field next to the ‘Name’ option.

For example, if you are creating a field for users to submit their phone number, then you can type ‘Phone Number’ as the field name.

After that, select a field type from the dropdown menu. If you are adding a social media profile field, then you can use the ‘Text Field’ option.

However, if you want a field for phone numbers, then you need to select that option from the dropdown menu.

Add field name and type

After that, you can also type a pattern for your phone number field or add a description for it.

Next, scroll down to the ‘Field Properties’ section and check the boxes for the user roles that you want this field to be displayed for.

For instance, if you want this field to be displayed for all the authors registering on your WordPress site, then you can check the box next to this user role.

You can choose as many user roles as you want.

Configure field properties

Next, you can also check the ‘Required’ box if you don’t want users to register without filling in this field in the form. Make sure that the ‘Always Show in User Registration Form’ box is checked so that your user field will be displayed in the form.

Finally, click the ‘Save Changes’ button to store your settings.

Check the box to show the field in user registration form

Now, you will need to go into your WordPress dashboard to change some settings for new registrations.

Head to the Settings » General page in your WordPress admin area and then check the membership box so that anyone can register on your website.

Next, you need to make sure that the default role is set to the role which you have added extra fields for. After that, click the ‘Save Changes’ button to store your settings.

Set user default role

This way, you can control the level of access new users have, and this will force the registration form to show the fields you selected earlier in this tutorial.

Here’s what the default registration form looked like on our demo website.

Preview for the user field in registration form

Bonus: Make a Custom User Registration Form in WordPress

The methods in this tutorial have shown you how to add extra user profile fields to the default WordPress registration form.

However, if you would like to create a custom user registration form in WordPress, then you can also easily do that by using the WPForms plugin.

It is the best WordPress form plugin that allows you to design your own user registration form using drag and drop. It also integrates seamlessly with plugins like Advanced Custom Fields, so you can easily insert additional user profile fields.

Edit user registration form

For detailed instructions, please follow our tutorial on how to create a custom user registration form in WordPress.

We hope this tutorial helped you learn how to add additional user profile fields in WordPress registration. You may also want to see our beginner’s guide on how to create a custom WordPress login page and our comparison of the best WordPress membership plugins to create and sell courses.

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 Additional User Profile Fields in WordPress Registration first appeared on WPBeginner.

How to Add the WordPress Logout Link to Navigation Menu

Featured Imgs 13

Do you want to add a WordPress logout link to your site?

If you run a membership site, bbPress forum, eCommerce store, or a learning management system (LMS) using WordPress, having a prominent logout link is helpful for your users.

In this article, we will show you how to add the WordPress logout link to your navigation menu, as well as to other areas of your site.

Adding a logout link in WordPress navigation menu

The Logout Link for WordPress

Normally you can log out of your WordPress site by clicking on the logout link. This link is located below your profile picture in the top right corner of the WordPress admin bar.

All you have to do is take your mouse over to your username, and it will appear in the dropdown menu.

Log out link in WordPress admin bar

In case you or your site administrator have disabled the WordPress admin bar, then you will not be able to see the WordPress logout link.

The good thing is that the WordPress logout link can be directly accessed to log out of your current WordPress session.

The logout link for your WordPress site looks like this:

http://example.com/wp-login.php?action=logout

Don’t forget to replace example.com with your own domain name.

You can access this link directly in your browser window to log out of your WordPress site.

When you visit the WordPress logout link, it will take you to a warning page. You will need to click on the logout link to confirm that you really want to log out.

Logout confirmation

You can also manually add this logout link anywhere on your WordPress site. Let’s take a look at how to do that.

Video Tutorial

If you don’t like the video or need more instructions, then continue reading.

Adding the Logout Link in WordPress Navigation Menus

Adding the WordPress logout link in your site’s navigation menu will make it easily accessible from any page on your website.

Simply head over to the Appearance » Menus page in your WordPress admin. After that, you need to click on the custom links tab to expand it and add the logout link in the URL field.

Logout link in navigation menu

Once you are done, click on the ‘Add to menu’ button, and you will notice the link appear in the right column. You can adjust its position by simply dragging it up or down.

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

You can now visit your website to see the logout link in your navigation menu.

Logout link in the navigation menu

The problem with adding the logout link in the menu is that it is visible to all users (both logged-in and logged-out). It only makes sense to show the logout link to users who are actually logged in.

You can do that by following our instructions on how to show different menus to logged in users.

Add WordPress Logout Link in the Sidebar Widget

WordPress comes with a default widget called Meta. This widget shows a bunch of useful links including a logout or login link to users.

Meta widget in WordPress

Some people find the other links in the Meta widget are not quite as useful.

As an alternate, you can also add a plain text or custom HTML widget with the logout link in plain HTML. Here is the HTML code you’ll need to add:

<a href="http://example.com/wp-login.php?action=logout">Logout</a>

Logout HTML widget

Adding a Dynamic Login / Logout Link in WordPress

If you manually add a logout link in WordPress, then the problem is that it does not change based on the user’s login status.

To fix that, you can use a plugin to dynamically display the login or logout link based on the user’s session.

First, you’ll need to install the Login or Logout Menu Item plugin. For details, see our step-by-step guide on how to install a WordPress plugin.

After you install and activate the plugin, you’ll go to Appearance » Menus in your WordPress admin and add the Login/Logout link to your menu.

Login Logout menu WordPress plugin

After you hit ‘Save Menu’ and check your WordPress website, you’ll see the link in your menu.

Login link in menu

When you click on it, it’ll take you to a page to login, or if you’re already logged in, it will log you out.

This method also works with WooCommerce, MemberPress, and other WordPress eCommerce platforms.

We hope this article helped you find the direct WordPress logout link and add it to your navigation menu. You may also want to see our guide on how to add a call button in WordPress, and how to track link / button clicks in WordPress to make data-driven decisions.

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 the WordPress Logout Link to Navigation Menu appeared first on WPBeginner.

150+ Black Friday / Cyber Monday 2020 WordPress Deals – Big Savings

Featured Imgs 23

Looking for the best Black Friday and Cyber Monday deals on your favorite WordPress products?

The next few days are the perfect time to buy premium WordPress plugins, themes, web hosting, and tools to grow your business. As always, to help you find the best deals, we have created the ultimate listed of best WordPress Black Friday and Cyber Monday deals for 2020. Some of these are exclusive just for WPBeginner readers.

View our Complete Black Friday and Cyber Monday List for 2020

We will be updating this page on a daily basis to add more deals.

View our Complete Black Friday and Cyber Monday List for 2020

The post 150+ Black Friday / Cyber Monday 2020 WordPress Deals – Big Savings appeared first on WPBeginner.

How to Create a Sticky Floating Navigation Menu in WordPress

Category Image 091

Recently, one of our users asked us how to create a sticky navigation menu for their site?

Sticky navigation menus stay on the screen as users scroll down the page. This makes the top menu always visible, which is good for user experience because it contains links to the most important sections of your website.

In this article, we’ll show you how to easily create a sticky floating navigation menu in WordPress.

Creating a sticky floating navigation menu in WordPress

What is a Sticky Floating Navigation Menu?

A sticky or floating navigation menu is one that ‘sticks’ to the top of the screen as a user scrolls down. This makes your menu visible to users at all times.

Here’s a sticky menu in action. We’re going to show you how to create a menu exactly like this for your own site:

A sticky navigation menu in action on our demo website

Why and when sticky menus can be useful?

Usually, the top navigation menu contains links to the most important sections of a website. A floating menu makes those links always visible, which saves users from scrolling back to the top. It is also proven to increase conversions.

If you run an online store, then your top navigation menu likely include links to the cart, product categories, and product search. Making this menu sticky, can help you reduce cart abandonment and increase sales.

Some of the best WordPress themes have built-in support for a sticky navigation menu. Simply see your theme settings under Themes » Customize to enable this feature.

If your theme does not have this option, then keep reading, and we’ll show you how to easily create a sticky floating navigation menu in any WordPress theme or WooCommerce store.

Method 1: Add Your Sticky Floating Navigation Menu Using a Plugin

This is the easiest method. We recommend it for all WordPress users, particularly for beginners.

If you haven’t set up your navigation menu yet, go ahead and do that using our instructions on how to add a navigation menu in WordPress.

After that, you need to install and activate the Sticky Menu (or Anything!) on Scroll 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 » Sticky Menu (or Anything!) page to configure the plugin settings.

The Sticky Menu plugin's settings page

First you need to enter the CSS ID of the navigation menu that you want to make sticky.

You will need to use your browser’s inspect tool to find the CSS ID used by your navigation menu.

Simply visit your website and take your mouse to the navigation menu. After that, you need to right-click and select Inspect from your browser’s menu.

Inspecting the navigation menu element on your website

This will split your browser screen, and you will be able to see the source code for your navigation menu.

You need to find a line of code that relates to your navigation, or your site header. It will look something like this:

<nav id="site-navigation" class="main-navigation" role="navigation">

If you’re struggling to find it, bring your mouse cursor over the different lines of code in the Inspect pane. The navigation menu will be fully highlighted when you have the right line of code:

Finding the navigation menu ID using the inspect tool

In this case, our navigation menu’s CSS ID is site-navigation.

All you need to do is enter your menu’s CSS ID in the plugin settings with a hash at the start. In this case, that’s #site-navigation.

Entering the ID of the element that you want to make sticky (in this case, the navigation menu)

Don’t forget to click the ‘Save Changes’ button at the bottom of the page.

Now, go ahead and check out your sticky menu live on your WordPress website. It should stay on the page as you scroll down, like this:

Viewing the sticky menu on your website

The next option on the plugin’s settings page is to define the space between the top of your screen and the sticky navigation menu. You only need to use this setting if your menu is overlapping an element that you do not want to be hidden. If not, then ignore this setting.

We recommend leaving the box checked next to the option: ‘Check for Admin Bar’. This allows the plugin to add some space for the WordPress admin bar, which is only visible to logged-in users.

Here, you can see that the admin bar on our test site is correctly displaying above the sticky menu:

The WordPress admin bar appears above the sticky menu

The next option allows you unstick the navigation menu if a user is visiting your website using a smaller screen such as a mobile device:

The sticky menu plugin offers further options too

You can test how your site looks on mobile devices or tablets. If you don’t like how it looks, simply add 780px for this option.

Don’t forget to click on the Save Changes button after making any changes to your options.

Method 2: Manually Add a Sticky Floating Navigation Menu

This method requires you to add custom CSS code to your theme. We don’t recommend it for beginners.

We also recommend that you take a look at our guide on how to easily add custom CSS to your WordPress site before you begin.

First, you need to visit Appearance » Customize to launch the WordPress theme customizer.

Adding custom CSS in WordPress theme

Next, click on ‘Additional CSS’ in the left pane and then add this CSS code.

#site-navigation {
    background:#00000;
    height:60px;
    z-index:170;
    margin:0 auto;
    border-bottom:1px solid #dadada;
    width:100%;
    position:fixed;
    top:0;
    left:0;
    right:0;
    text-align: center;
}

Note: This will produce a navigation menu with a black background. If you want a different color, change the number next to background. For example, using background: #ffffff will give you a white menu background.

Just replace #site-navigation with the CSS ID of your navigation menu then click on the Publish button at the top of the screen.

Go ahead and visit your website to see your sticky floating navigation menu in action:

A sticky / floating navigation menu created using CSS

What if your navigation menu normally appears below the site header instead of above it? If so, this CSS code could overlap the site title and header or appear too close to it before the user scrolls:

The sticky navigation menu is slightly overlapping the site title

This can be easily adjusted by adding a margin to your header area using some additional CSS code:

.site-branding {
margin-top:60px !important;
}

Replace site-branding with the CSS class of your header area. Now, the sticky navigation menu will no longer overlap your header before the user scrolls down:

There's now room for the title below the sticky navigation menu

We hope this article helped you add a sticky floating navigation menu to your WordPress site. You may also want to see our guide on how to create a custom WordPress theme without writing any code, and our comparison of the best WordPress page builder 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 Sticky Floating Navigation Menu in WordPress appeared first on WPBeginner.

How to Edit the Footer in WordPress (Step by Step)

Featured Imgs 29

Do you need to edit the footer area of your WordPress website? The footer area appears at the bottom of each page on your WordPress site.,

There are several different ways website owners can utilize this area and make it more useful for their website visitors.

In this article, we will show you how to edit the footer in WordPress.

Editing your footer in WordPress

What is the Footer in WordPress?

The ‘footer’ in WordPress is the bottom part of your website that appears after the content area. It normally appears on all pages on your website.

Example of the footer area on a WordPress powered website

This part of the website is located far down below and is often ignored by most beginners for a long time. However, there are several ways you can utilize this area by making it more helpful for your users, WordPress SEO, and your business.

All top WordPress themes come with footer widget area that’s easy to edit. You can also carefully edit the footer.php template file in your theme to remove unwanted links from this area.

That being said, let’s take a look at how to easily edit the footer in WordPress. You can use the following links to jump to the section you want to read.

Editing Widgets in Your Footer in WordPress

Many popular WordPress themes have widget areas in the footer.

You can use these widget areas to add text, images, or links to your privacy policy and legal disclaimers in the footer area.

Adding text and images is quite straight forward. You can simply go to the Appearance » Widgets page and add a Text, Image, or Gallery widget to your footer widget area.

Add widgets to footer in WordPress

To add a widget, simply drag and drop it into a footer area. If you need more help, then see our article on how to add and use widgets in WordPress.

Note that many themes will have multiple footer areas, and they may use them differently. You can preview your website after adding widgets to make sure that they appear where you want them to be.

Adding Links in Footer Widget Area

You may also want to add links to different pages, categories, or to the legal pages of your website in the footer area.

WordPress comes with an easy to to manage those links using the navigation menus. Simply head over to the Appearance » Menus page and click on the ‘create new menu’ link.

Create new menu in WordPress

WordPress will ask you to provide a name for your new menu. Enter a name that helps you easily identify this menu and then click on the ‘Create Menu’ button.

Enter your navigation menu name

Your menu is now ready and you can start adding links to it. Simply select the pages, posts, categories from the left column to add them to your menu.

Add pages to your menu

Once you are finished, click on the Save Menu button to store your changes. For more help, see our article on how to create navigation menus in WordPress.

Your menu is now ready to be added to the WordPress footer widget area. Simply visit the Appearance » Widgets page in your WordPress admin and then add the Navigation Menu widget to your footer area.

Adding a navigation menu widget to your website's footer

In the widget settings, select the footer navigation menu you created earlier from the dropdown menu and click on the Save button.

You can now visit your website to see your footer links in action.

A footer section with navigation menu links

You can create multiple navigation menus in WordPress and add as many navigation menu widgets to your sidebar as you need. If you need another set of links simply repeat the same steps again.

Removing the ‘Powered by WordPress’ Text from Your Footer

When you first install WordPress, your site may have a ‘Powered by WordPress’ link in a footer bar at the bottom. This isn’t a widget, so it’s often not clear how to change it.

The 'Powered by WordPress' text and link in the Twenty Twenty theme

Some themes will alter this to their own text and link. If so, you can normally change this text using the live theme customizer. Simply go to Themes » Customizer in your WordPress admin. Look for an option to edit your site footer:

The Footer tab in the WordPress theme customizer

We’re using the Astra theme for this example. With Astra, you need to go to Footer » Footer Bar in the customizer. You will then have the option to change the text of your footer bar:

Editing the footer text in the theme customizer for the Astra theme

Once you’ve finished editing the text, don’t forget to click the Publish button at the top of the screen to put your changes live.

Go ahead and view your site to see your new footer:

Viewing the new footer text live on your website

For more help, take a look at our in-depth guide to the WordPress theme customizer.

Editing the Footer Text Manually

What if your theme doesn’t have the option to edit the footer text using the customizer?

In this case, you need to edit the footer.php file. It is a template file stored in your WordPress theme folder and is responsible for displaying the footer area for that particular theme.

The easiest way to edit this is by using an FTP client to connect with your WordPress hosting.

First, download the /wp-content/themes/yourtheme/footer.php file and then edit it in a text editor.

You will need to find the line in the file with the ‘Powered by WordPress’ text. This is how it looks in the Twenty Twenty theme:

<div class="footer-credits">

	<p class="footer-copyright">&copy;
		<?php
		echo date_i18n(
			/* translators: Copyright date format, see https://www.php.net/date */
			_x( 'Y', 'copyright date format', 'twentytwenty' )
		);
		?>
		<a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a>
	</p><!-- .footer-copyright -->

	<p class="powered-by-wordpress">
		<a href="<?php echo esc_url( __( 'https://wordpress.org/', 'twentytwenty' ) ); ?>">
			<?php _e( 'Powered by WordPress', 'twentytwenty' ); ?>
		</a>
	</p><!-- .powered-by-wordpress -->

</div><!-- .footer-credits -->

Then, simply delete or change that text, and reupload your footer.php file.

Tip: Make a copy of your footer.php file before making changes. That way, if you accidentally break anything, you can easily upload the original file again.

For more help, check out our guide on removing the ‘Powered by WordPress’ footer link.

Adding Code to Your WordPress Footer

Sometimes, you may need to add code snippets to your WordPress footer. This is often done in order to connect your site with an external app.

For instance, to add a Pinterest button to your site, you need to add Pinterest’s script to your footer. You may also see a tutorial that asks you to insert your Google Analytics code there.

The easiest way to do this is to install and activate the Insert Headers and Footers plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, simply go to Settings » Insert Headers and Footers in your WordPress admin. Go ahead and copy and paste your footer code into the ‘Scripts in Footer’ box:

Using the Insert Headers and Footers plugin to add code to your website's footer

Don’t forget to click the Save button before moving on.

For more help, take a look at our guide to adding header and footer code in WordPress.

If you’re looking to add Google Analytics, then we recommend you use another method instead which helps with better tracking.

We hope this article helped you learn how to edit the footer in WordPress. You may also want to see our comparison of the best drag & drop WordPress page builder plugins, and our guide on how to create a custom WordPress theme without writing any code.

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 Edit the Footer in WordPress (Step by Step) appeared first on WPBeginner.

How to Change Sender Name in Outgoing WordPress Email

Category Image 051

Do you want to change the default sender name and email address for outgoing WordPress emails?

By default, WordPress uses ‘WordPress’ as the sender name for all outgoing WordPress notification emails. This doesn’t look very professional, and you may want to change that to your business name.

In this article, we will show you how to easily change the default sender name and email address in outgoing WordPress emails.

Changing sender name and email address in outgoing WordPress emails

Why You Should Change the Default Sender Information in WordPress?

WordPress sends several email notifications to the site administrator as well as other users on your website.

This includes very important email notifications such as forgot password emails, website error and recovery emails, new user registration, and more.

By default, it uses ‘WordPress’ as the sender’s name and a non-existent email address (wordpress@yourdomain.com) as the sender email.

Many spam filters block your WordPress emails believing it to be spam. Sometimes it does not even make it to the spam folder.

For more on this topic, take a look at our guide on how to fix WordPress not sending email issue.

The outgoing email notifications are important, and you should use your own brand and email address. This increases the authenticity of your brand and increases name recognition among your users.

For instance, if you run an online store, then you would want customers to get email notifications with your store name as the sender.

See our guide on how to get a free business email address for your website in 5 minutes.

Having said that, let’s see how to change the default sender name and email address in outgoing WordPress email notifications.

Method 1. Changing Default Sender Name and Email using WP Mail SMTP

This method is easier and recommended for all WordPress users.

For this method, we’ll be using the WP Mail SMTP Pro plugin. It is the best WordPress SMTP plugin on the market, used by over 1 million website owners.

This plugin allows you to easily change the default sender name and email address for outgoing WordPress emails. It also helps you fix the WordPress email deliverability problem.

First thing you need to do is install and activate the WP Mail SMTP Pro plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, you need to visit WP Mail SMTP » Settings to configure plugin settings. Under the Mail section, you can simply enter the email address and the name you want to use to send WordPress emails.

Change sender name and email in WordPress using WP Mail SMTP

Below that you can find the options to set up an SMTP server to send WordPress emails. By default, the plugin will use PHP method provided by your WordPress hosting company which is less reliable.

We recommend using any of the listed SMTP services to properly send WordPress emails for higher guaranteed deliverability.

Select mailer

If you choose an SMTP service, then follow the on-screen instructions to connect the plugin with your SMTP service provider.

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

Test Your WordPress Emails

WP Mail SMTP Pro also allows you to test your WordPress email settings. Simply go to the WP Mail SMTP » Settings page and switch to the ‘Email Test’ tab.

Test WordPress emails using WP Mail SMTP

From here, you just need to provide an email address that you can access and then click on the ‘Send Email’ button.

The plugin will now send a test email to the address you provided. You can check your inbox to make sure that you can receive WordPress emails, and it has the correct sender name and sender email address.

WP Mail SMTP works with all popular WordPress plugins like WooCommerce, WPForms, and more.

For more detailed instructions, you may want to see our article on how to use SMTP to send WordPress emails.

Method 2: Changing Default Sender Name and Email using a CB Change Mail Sender

This method is only recommended if you don’t use an SMTP service, or the first method is not working for you.

Using this method does not improve your WordPress email deliverability or make it easier to troubleshoot email issues. However, if your WordPress emails are working, then it will allow you to change sender name and email address.

First thing you need to do is install and activate the CB Change Mail Sender plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, you will notice a new menu item labeled CB Mail Sender in your WordPress admin bar. Clicking on it will take you to plugin’s settings page.

CB Mail Sender

You will need to enter the name and email address you want to be used for outgoing WordPress emails.

Don’t forget to click on the save changes button to store your settings.

That’s all, your WordPress notification emails will now show the name and email address you entered in plugin settings.

There is no method provided by the plugin to test your email settings. You can do that by performing actions that generate WordPress notification emails like creating a new user, requesting a password reset, and more.

Method 3: Manually Change Sender Name and Email Address

This method is not recommended for beginners. This method requires you to paste code into your WordPress files. It also does not fix any email deliverability issues and is harder to troubleshoot.

If you are new to adding code in WordPress, then take a look at our beginners guide on pasting snippets from web into WordPress.

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


// Function to change email address
function wpb_sender_email( $original_email_address ) {
    return 'tim.smith@example.com';
}

// Function to change sender name
function wpb_sender_name( $original_email_from ) {
	return 'Tim Smith';
}

// Hooking up our functions to WordPress filters 
add_filter( 'wp_mail_from', 'wpb_sender_email' );
add_filter( 'wp_mail_from_name', 'wpb_sender_name' );

This code simply replaces the default WordPress sender name and email address with your custom sender name and email address.

You can test this by adding a new user, changing passwords, or any other action that sends a WordPress notification email.

We hope this article helped you learn how to change the sender’s name and email address in outgoing WordPress emails. You may also want to see our guide on the best bulk email marketing services to bulk send email to all your users, and our comparison of the best WordPress page builder plugins to customize your site without any code.

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 Change Sender Name in Outgoing WordPress Email appeared first on WPBeginner.

How to Create a Questionnaire in WordPress (Easy Way)

Category Image 091

Do you want to create a questionnaire in WordPress to survey your visitors or collect data?

Getting feedback on your products or simply learning more about your users can help your business to succeed.

In this article, we will show you how to easily create a questionnaire in WordPress, step by step.

The easy way to create a questionnaire in WordPress

Why Create a Questionnaire in WordPress?

Creating a questionnaire is a great way to learn more about your audience. This lets you tailor your content to their needs. You can also use the results to create or modify the products / services that will be most helpful to your audience.

There are several survey tools that you can use outside your website, but having your questionnaire on your website itself means you have full control over how it’s displayed. Plus, it’s more familiar and reassuring for your audience.

That being said, let’s take a look at how to easily add a questionnaire to your WordPress site.

Creating a Questionnaire Form in WordPress

For this tutorial, we’ll be using WPForms to create a questionnaire.

WPForms is the best forms plugin for WordPress and allows you to easily create any kind of forms using a simple drag and drop form builder.

First, you need to install and activate the WPForms plugin on your WordPress site. For more details, see our step by step guide on how to install a WordPress plugin.

Note: You’ll need the Pro version of the plugin to get the features that we will use in this tutorial.

Upon activation, you need to visit the WPForms » Settings page in your WordPress admin area to enter your license key. You’ll find the license key under your account on the WPForms website.

Entering your license key for WPForms

Now, it’s time to move on and create your questionnaire.

Creating a Questionnaire Using WPForms’ Survey and Polls Feature

WPForms’ powerful surveys and polls addon lets you create questionnaires easily. It also produces beautiful visual graphs of the results.

First, visit the WPForms » Addons page to install the Survey and Polls addon. Use the search bar to find it, then click the Install Addon button.

Installing the Survey and Polls addon for WPForms

Next, go to WPForms » Add New to create a new form. First, type in a name for your form at the top of the screen:

Naming your questionnaire in WPForms

There are 4 different pre-built survey form templates to choose from. These are the Poll Form, the Survey Form, the NPS Survey Simple Form, and the NPS Survey Enhanced Form.

We are going to use the Survey Form for our questionnaire.

Select the Survey form template in WPForms

After you select the template, it will open up in the WPForms editor.

The Survey template in the WPForms editor

We recommend that you edit the questions to make them appropriate for your audience and needs. We are going to use the form to gather customer feedback on products and delivery.

To edit any field, simply click on it. The editing view will then open up on the left-hand side of your screen. Here, we are editing the Name field at the top. We changed the format to ‘Simple’ using the dropdown.

We also made it optional by unchecking the ‘Required’ box.

Editing the Name field in our WPForms questionnaire

The ‘How can we improve?’ box only appears if the user rates their experience as 1 star or 2 stars.

We’re going to add a new feedback box that will appear if the user rates their experience as 3 or 4 stars. To do this, simply bring your mouse cursor over the ‘How can we improve?’ box then click the Copy button:

Clicking the button to copy a field in WPForms

Next, WPForms will check that you want to duplicate the field. Go ahead and click the ‘OK’ button to continue:

Click the OK button to go ahead and duplicate the field

Now, you can edit your new field on the left-hand side of the screen. We have changed the label, which appears above the box. We also changed the description, which appears below the box:

Editing the new feedback box that you've created in WPForms

You also need to set the conditional logic for this field. To do that, click the Conditionals tab. Then, set the numbers to 3 and 4 instead of 1 and 2:

Opening up and editing the conditional logic for the field in WPForms

Finally, we are going to edit the ‘How satisfied are you with’ Likert scale. A Likert rating scale is a 5 or 7 point scale that is often used to measure satisfaction or attitudes.

Again, simply click on the field to edit it. Then, change the labels of the rows or columns to the text you want to use.

We are going to change the labels of the rows to make them more specific:

Editing the options on the Likert satisfaction scale

Go ahead and make as many changes to the form as you like. Don’t forget to click the ‘Save’ button at the top of the screen:

Save the customer feedback form after editing

Setting Up Notifications for Your Questionnaire

WPForms will send each completed questionnaire to the business email address that’s set in your website settings. It’s easy to change this by going to Settings » Notifications.

Simply delete the {admin_email} in the ‘Send To Email Address’ box and enter the email address you want to use instead:

Changing the email address that the questionnaire is sent to

Tip: Not sure what your WordPress administration email is? Go to Settings » General and check what is listed in the ‘Administration Email Address’ box.

Don’t forget to save your questionnaire after making any changes.

Adding Your Questionnaire to Your Website

You can add your questionnaire to any post or page on your website. You can even add it to your sidebar.

To add your form to a page, edit your page or go to Pages » Add New to create a new one. Then, click the + button to add a new block. Select the ‘WPForms’ block:

Add a WPForms block to your page in WordPress

Next, simply click on the dropdown and select your questionnaire form.

Select your questionnaire from the dropdown list

Now, simply preview or publish your post to see the form live on your WordPress website:

Your finished questionnaire live on the website

Creating a Questionnaire Using Conversational Forms

You can also use WPForms’ conversational forms feature.

A conversational form is an interactive form that flows like a conversation. Users answer a question and it automatically shows them the next one.

It makes longer forms like a questionnaire easier to fill out and reduces form abandonment.

Conversational forms example

First, you need to go to WPForms » Addons in your WordPress admin. Then, search for and install the Conversational Forms addon:

Installing the conversational forms addon in WPForms

After that, go to WPForms » Add New and create a new form using the instructions in the previous method.

If you already created your form, then simply go to WPForms » All Forms page and click on it to edit it:

Editing your questionnaire form in WPForms

Now, we are going to convert your form into a conversational form. First, go to the Settings » Conversational Forms tab. Then, simply check the ‘Enable Conversational Form Mode’ box.

Enabling conversational form mode for your questionnaire form

You will then see a number of extra options to fill in. Conversational forms can’t be embedded in a post or page, so you need to give your form a title here. You can also write any text that you want to display above the form:

Entering a title and message for your conversational form

WPForms will automatically create a URL for your conversational form based on the form’s name. If you want to change this, simply type in a different URL here.

Optionally, you can also upload a header image, choose a color scheme, and change the Progress Bar style.

Editing the other options for your conversational form

Once you are happy with your form’s settings, don’t forget to click the ‘Save’ button at the top of the screen:

Make sure you save your conversational form before moving on

Now, click the ‘View’ button next to the permalink for your form to see it live on your site:

Click the button to view your conversational form live on your site

The customer simply clicks the Start button to begin the form.

The conversational questionnaire - user clicks the Start button to begin

They can then enter their responses one question at a time. The questions that aren’t active will be faded out until the customer moves to them.

The questions displaying on the conversational questionnaire

The sticky progress bar at the bottom of the screen will show how far through the form the customer is:

WPForms will show the user how far through the questionnaire they are, using the progress bar

That’s it. You’ve successfully created your conversational questionnaire.

Viewing the Results from Your Questionnaire

Whether you created a regular survey or a conversational form, the process for viewing the results is the same.

Each questionnaire response will be emailed to the email address you set up under Settings » Notifications.

WPForms also stores all your survey results in your WordPress database. To view them, go to WPForms » Entries in your WordPress dashboard. Then, click on the name of your survey form:

Click on the name of your form to view the questionnaire results

You will then see some of the answers from your questionnaire. Simply click the ‘View Survey Results’ button to view all the questionnaire results.

Click the View Survey Results button to see all the graphs and charts from your questionnaire results

WPForms will automatically create graphs and charts to make it easy to interpret the results:

Two of the charts that WPForms has automatically created from the questionnaire results

It’s easy to export any of the graphs as a PDF or JPG. You can even print them to share with others in your organization. Just click the ‘Export’ link next to any item and choose from the dropdown menu:

Exporting a chart from the questionnaire using the Export dropdown for that question

You can also download all your results as a CSV file. Just click the ‘Export All (CSV)’ button near the top of the page to download all the results:

Exporting all answers from the questionnaire as a CSV file

If you want to view the questionnaire answers from individual customers, then click the ‘Back to All Entries’ button at the top of the screen:

Going back to view all the entries for the WPForms questionnaire

Next, scroll down to the table at the bottom of the screen. Click the ‘View’ button for the entry you want to see:

Viewing individual answers to the questionnaire

You will now see all the answers submitted by that person.

Viewing the details of one submitted survey response

We hope this article helped you learn how to create a questionnaire in WordPress. You might also enjoy our articles on the best email marketing services and how to start an online store.

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 Questionnaire in WordPress (Easy Way) appeared first on WPBeginner.

7 Tips on Choosing WordPress Themes for Your Website

Featured Imgs 23

In 2020, a whopping 35% of the Internet is powered by WordPress, which means over 455,000,000 websites are using WordPress as their platform. The reason why WordPress is so popular is because of its ease of installation, ability to customize everything, its safety features, and ease of use for beginners. One of the most distinctive features […]

The post 7 Tips on Choosing WordPress Themes for Your Website appeared first on WPArena.