Saturday, May 16, 2020

How to Create a Contact Form in WordPress (Step by Step)

Are you looking to add a contact form on your WordPress site?

Every website needs a contact form, so visitors can easily contact you about your products and services. By default, WordPress does not come with a built-in contact form, but there is an easy way to add contact forms to your site.

In this WordPress tutorial, we’ll show you how to easily create a contact form in WordPress (step by step) without touching a single line of code.

Easily add a contact form in WordPress

Why Do You Need a Contact form?

You might be wondering why do I need a contact form? Can’t I just add my email address on my website, so people can email me?

That’s a very common question from beginners because they are afraid that adding a contact form requires code knowledge.

The truth is you don’t need to know any code. This step by step guide to adding a contact form is written for absolute beginners.

Below are the top 3 reasons why a contact form is better than pasting your email address on a page.

  • Spam Protection – Spam bots regularly scrape websites for the mailto: email address tag. When you post your email address on the website, you will start to receive a lot of spam emails. On the other hand, when you use a contact form, you can get rid of almost all spam emails.
  • Consistent Information – When emailing, people don’t always send you all the information that you need. With a contact form, you can tell the user exactly what information you’re looking for (such as their phone number, budget, etc).
  • Saves Time – Contact forms help you save time in more ways than you can imagine. Aside from consistent information that we mentioned above, you can also use form confirmations to tell the user what are the next steps. Such as watch a video or wait up to 24 hours to get a response, so they don’t send you multiple inquires.

Below is an example of a WordPress contact form that we will create in this tutorial.

Contact page preview

After creating the form above, we will also show you how you can easily add it on your contact page, or in your site’s sidebar using a WordPress contact form widget.

Sounds good? Ok so let’s get started.

Video Tutorial

If you prefer written instructions, then please continue reading.

Step 1. Choosing the Best Contact Form Plugin

The first thing you need to do is choose a WordPress contact form plugin.

While there are several free and paid WordPress contact form plugins you can choose from, we use WPForms on our site and believe it’s the best option in the market.

Below are the three reasons why we think WPForms is the best:

  1. It is the most beginner friendly contact form plugin available. You can use the drag & drop builder to easily create a contact form in just a few clicks.
  2. WPForms Lite is 100% free, and you can use it to create a simple contact form (over 3 million sites use it).
  3. When you are ready for more powerful features, then you can upgrade to WPForms Pro.

Now that we have decided on the contact form plugin, let’s go ahead and install it on your site.

Step 2. Install a Contact Form Plugin in WordPress

For this contact form tutorial, we will use WPForms Lite because it’s free and easy to use.

You can install this plugin on your site by logging into your WordPress dashboard and going to Plugins » Add New.

In the search field, type WPForms and then click on the Install Now button.

Install WPForms

After the plugin is installed, make sure you activate the plugin.

Activate WPForms

If you don’t see the plugins menu or want more detailed instructions, then please refer to our step by step guide on how to install a WordPress plugin.

Step 3. Create a Contact Form in WordPress

Now that you have activated WPForms, you are ready to create a contact form in WordPress.

In your WordPress dashboard, click on the WPForms menu and go to Add New.

Add new form

This will open the WPForms drag and drop form builder. Start by giving your contact form a name and then select your contact form template.

WPForms Lite only comes pre-built form templates such as Blank, Simple Contact Form, etc. You can use these to create just about any type of contact form you like.

For the sake of this example, we will go ahead and select Simple Contact Form. It will add the Name, Email, and Message fields.

Creating a new form in WordPress with WPForms

You can click on the fields to edit them. You can also use your mouse to drag and drop the field order.

If you want to add a new field, simply select from the available fields on the left sidebar.

Adding new field to your contact form

When you’re done click on the Save button.

Step 4. Configuring Form Notification and Confirmations

Now that you have created your WordPress form, it’s important that you properly configure the form notification and form confirmation.

Form confirmation is what your website visitor sees after they submit the form. It could be a thank you message, or you can redirect them to a special page.

Form notification is the email you get after someone submits the contact form on your WordPress site.

You can customize both of those by going to the Settings tab inside the WPForms form builder.

We usually leave the form confirmation as default Thank You message. However, you can change it to redirect to a specific page if you like.

Setting up form confirmation

The best part about WPForms is that the default settings are ideal for beginners. When you go to the notification settings, all fields will be pre-filled dynamically.

Setting up form notifications

The notifications by default are sent to the Admin Email that you have set up on your site.

If you want to send it to a custom email address, then you can change that. If you want to send the notification to multiple emails, then just separate each email address by a comma.

The email subject is pre-filled with your form name. The from name field is automatically populated with your user’s name. When you reply to the inquiry, it will go to the email that your user filled in the contact form.

We have a detailed guide on how to setup custom form notifications, so you can send forms to multiple recipients or different departments.

Step 5. Adding WordPress Contact Form in a Page

Now that you are done configuring your WordPress contact form, it’s time to add it to a page.

The first thing you need to do is either create a new page in WordPress or edit an existing page where you want to add the contact form.

We will be using the WPForms block to add the form in a page. Simply click on the add new block button to look for WPForm and then click to add it to your page.

Add WPForms contact form block to your page

WPForm block will now appear in the content area of your page. You need to click on the drop down menu to select the form you created earlier.

Select your contact form in WPForms block

WPForms will load your contact form preview inside the editor. You can now save or publish your page and visit your website to see it in action.

Here’s what the form would look like on a sample WordPress page:

Contact page preview

If you only wanted to add the contact form on page, then you’re done here. Congratulations.

WPForms also comes with a WordPress contact form shortcode. You can copy the contact form shortcode by visiting WPForms » All Forms page and then paste it in any WordPress post or page.

WordPress contact form shortcode to use in post and pages

If you want to add a contact form on a sidebar or another widget ready area, then go to step 6.

Step 6. Adding WordPress Contact Form in a Sidebar

WPForms come with a WordPress contact form widget that you can use to add your contact form in a sidebar or basically any other widget-ready area in your theme.

In your WordPress admin area, go to Appearance » Widgets. You will see a WPForms widget that you can easily drag into any widget-ready areas of your theme.

Add form using a sidebar widget

Next, add the title for your widget and select the form you want to display. Save the settings, and visit your website for the preview.

Sidebar contact form

We hope this article helped you create a simple contact form in WordPress. You may also want to check out our comparison of the best WordPress backup plugins and our guide on how to fix WordPress not sending email issue.

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 Contact Form in WordPress (Step by Step) appeared first on WPBeginner.


May 16, 2020 at 12:00PM

Friday, May 15, 2020

6 Best Online Resume Website Builders (Easy to Use)

Do you want to build an online resume website? Often beginners are not sure about which website builder to use to launch their resume site?

Whether you want a simple one-page resume that you can download or a fully-featured website, you need the right tool for the job.

In this article, we’ll compare the pros and cons of the best online resume website builders to help you land the job of your dreams.

Best online resume website builders (easy to use)

Why You Should Create an Online Resume

Even if you don’t plan to ever send out a link to your resume, it’s still a great idea to create a resume website.

Why? Because it’s highly likely that your potential employers will search for you online, so you want whatever appears in search results to look great.

Having an online resume can be a great way to dominate Google’s search results for your name.

Plus, building a resume website can be a great way to impress would-be employers with your technical skills.

If you’ve never created a website before, don’t worry. These website builders are all easy to use and won’t cost you a fortune, either.

1. WordPress.org

WordPress

WordPress.org is our top pick for building your resume website. It’s a highly flexible website-building tool used by millions. In fact, WordPress currently powers around 36% of all websites.

We recommend WordPress.org because it is more flexible, easy to use, and allows you to do anything you want with your website.

To use WordPress.org, you need to register a domain name and set up a web hosting account.

Your domain name is your website’s address. You might want to use your name, such as syedbalkhi.com or amandabalkhi.com. If your name is taken, then you could try including your middle initial.

Your domain name and web hosting are different things and can be purchased separately. If you’re a beginner, though, it’s definitely easiest to buy both from the same provider.

We recommend getting your web hosting and domain name from Bluehost. Our readers can get an exclusive 60% off discount and a free domain name. Basically you can get started for just $2.75/month.

Pros

You can create any type of website you want using WordPress.org. If you want to change your site or add to it in the future, it’ll be easy for you to do so.

WordPress has thousands of plugins that you can use to add extra functionality to your site. Many of these are free, including the Resume Builder plugin.

The Resume Builder plugin for WordPress

Because you run the WordPress software on your own site, you have full control. Your website will not show any third-party ads, and you can change your website design however you like.

The WordPress.org software is open-source and completely free. There’s a huge, supportive community of WordPress users and developers who can help you if you get stuck. Our friendly and welcoming Facebook group, WPBeginner Engage, is a great place to begin.

There are thousands of WordPress themes available for your website. Themes control the look and feel of your site. We’ve even listed some of the best WordPress themes for your online CV or resume.

Five WordPress themes that could work for your resume website

The skills you pick up from creating a WordPress website could be useful in your professional life. Many big name brands are using WordPress, including The New Yorker, BBC America, and The Walt Disney Company. Your new company might well use it too.

If you need some help getting started with WordPress, we offer a completely free WordPress setup service. While this is designed for bloggers, you could certainly use it for a resume website too.

Cons

If you’re a total beginner, WordPress.org can take a bit of time to get used to. That’s why we have a site full of helpful WordPress tutorials and our WPBeginner Engage Facebook group.

You’ll be responsible for managing your website. This means installing updates, making backups, and tightening WordPress security.

Luckily, WordPress makes all this super easy. For instance, you can install updates with the click of a button, set up a WordPress backup plugin to automatically save backups.

You’ll also need to make sure you keep your WordPress site secure. You don’t want your potential employers to come to your site only to find that it’s been hacked.

Pricing

The WordPress.org software itself is completely free. You’ll need to pay for website hosting and a domain name, though. Costs vary a lot, but there are lots of options for great deals on WordPress hosting.

2. Constant Contact’s Website Builder

The Constant Contact website builder

Constant Contact’s Website Builder is a fantastic all-in-one option for creating your resume. The web builder is powered by A.I. (artificial intelligence) and you can get your resume site up and running really quickly.

You don’t need to buy web hosting separately as you do with WordPress. Instead, Constant Contact handles web hosting and issues like security, backups, and updates.

Pros

Constant Contact provides an all-in-one platform that’s great if you’re a total beginner. When you sign up, you’ll be walked through the process of creating your site.

Creating your resume website using the Constant Contact website builder

Although Constant Contact is best known as an email marketing service, they’ve done a fantastic job with their website builder too. It has an easy to use drag and drop interface, so you can make your resume look great.

You’ll get a library of over 550,000 free images to use on your site. These could really help lift your online resume if you’re including multiple pages or additional information.

The library of images in Constant Contact's website builder

Cons

You can try out Constant Contact’s website builder for free, but you’ll need to pay to actually put your site live.

There are only limited additional features for the Constant Contact website builder. You may find that you can’t do as much as you wanted to with your resume site.

Pricing

The ‘Starter’ plan is $10/month. This includes 24/7 live support at no extra charge.

3. Gator

The Gator website builder's homepage

Gator is a website building platform from HostGator, a popular and well-established web hosting company. Like the Constant Contact Website Builder, Gator is an all-in-one option.

Note: Don’t confuse the Gator website builder with HostGator’s web hosting. You can use HostGator to host all sorts of websites including WordPress sites.

Pros

Gator has a drag and drop builder that’s really easy to use, so you can tweak the design of your resume website as much as you like.

It’s quick and easy to get started with Gator. There are over 200 of pre-built templates you can use, so you can get your site up and running really quickly. All the templates are mobile-friendly, too.

Some of the templates available with the Gator website builder

Like the Constant Contact Website Builder, Gator has a library of high-quality photos that you can use on your resume website if you want to.

There’s a 45-day money-back guarantee. If you try Gator and find it difficult to use, you can just get a refund.

When you first set up Gator, you’ll be taken through a simple tutorial that takes you through the key things you need to know. Support is available 24/7, by phone, email, and live chat.

You get unlimited bandwidth and storage for your website. This could be very helpful if you want to keep using your site after you land a job, perhaps as a portfolio of work.

Cons

There’s no free plan or free trial for Gator.

If you’re on the cheapest plan, you may find you have a bit of a wait for support. You need to pay for the premium plan if you want priority support.

Pricing

As a WPBeginner reader, you get 55% off all Gator plans when you go through our link. That means the starter plan costs from just $3.46/month. You’ll even get a domain name included for free.

The premium plan, which includes priority support, is from $5.99/month.

4. WordPress.com

The WordPress.com all-in-one website builder

WordPress.com is the commercial version of WordPress.org. It’s an all-in-one platform that includes hosting, whereas WordPress.org is free software that you pay to host yourself.

If you want to know more about how they differ, take a look at our article on the difference between WordPress.com and WordPress.org.

Pros

WordPress.com is an all-in-one platform, making it easy for beginners to get started with. You won’t need to worry about backups, security, or updates. All of that is handled for you.

There are a number of different themes (templates) to choose from. You can switch between these easily when you’re creating or editing your website.

Some of the website themes available with WordPress.com

The WordPress.com support team, who are called the “Happiness Engineers”, are available for live support on weekdays, if you have any of the paid plans. If you pay for the Business plan or higher, you can also get live support during the weekend.

If you want to try out the WordPress software before buying hosting, a free WordPress.com plan could be a good option. Note there are some significant differences in how WordPress.org and WordPress.com work, though.

Cons

WordPress.com doesn’t offer the same flexibility and power as the WordPress.org software. You can’t use third-party plugins with WordPress.com, for instance, unless you’re paying for a fairly expensive plan.

There aren’t so many built-in themes (layouts) with WordPress.com as with some other website builders. You may find it more challenging to find something that suits your site.

You’ll need to pay for a WordPress.com plan in order to use your own domain name. On the free plan, you’ll be assigned a domain name that may look odd, such as danielmatthews927034030.wordpress.com.

Pricing

You can use WordPress.com for free. However, you’ll probably want to pay for at least the $4/month “Personal” plan. This lets you use a custom domain name and get access to the support team.

The “Premium” plan offers more design tools and storage space and costs $8/month.

5. Kickresume

The Kickresume website builder

Kickresume is a site specifically designed for creating resumes. If you want to create a resume that you can download and send, this is a great tool to try. You can also use it to create your resume website, of course.

Pros

Kickresume lets you import information from your LinkedIn account, which could save you time if you’re in a hurry to create your resume.

You can use Kickresume to get help with actually writing your resume. The software suggests pre-written phrases that you can use. You can also use the grammar correction and proofreading services if you want.

There’s a free version available, though it doesn’t include many templates. If you’re a student or teacher, you can also get 6 months of the Premium account free (it’s normally $8/month if you pay for a year upfront).

It’s quick and easy to make your resume, cover letter, or website with their templates.

Some of the resume templates available from Kickresume

You can use Kickresume to create a website too. It’s easiest to do this by creating your resume first, so you can use their “one click” process to turn it into a website:

Creating a resume website with Kickresume

There are lots of real-life resume and cover letter examples on the website that you can learn from, plus plenty of tips and support.

Cons

The website templates are nicely designed, but all look very similar. You can only create a simple one-page website. You don’t have anything like the flexibility that full website builders offer.

You’ll need to have an active subscription to Kickresume to update and redownload your resume and cover letter in the future.

Pricing

Kickresume costs from $8/month if you pay for a full year. This includes email and live chat support, plus full customization of your resume templates.

6. VisualCV

The VisualCV website homepage

VisualCV is a resume builder with an international focus. Like Kickresume, it lets you create your own resumes and cover letters that you can download. It also has the option to create a website.

Pros

VisualCV has a whole range of templates to choose from. You can easily switch templates with a couple of clicks and your content will be moved to the new template.

There’s a free version of Visual CV available, though the 3 free templates are quite plain.

You can import your current resume or CV if it’s in Word or PDF format. The site will attempt to extract it. You can also import information from LinkedIn.

You can use the visual editor to add content, which lets you see how it’ll look on your current template instantly. There’s also the option of the basic editor, if you find that easier for entering your information.

If you’re using a free account, you can try out the pro templates if you want. Note you can’t download or share them unless you sign up for a paid plan.

You can quickly populate your resume with sample content from a range of positions. If you’re struggling to get started, this could help you get going.

Creating a resume using pre-written content

There’s a 30-day money-back guarantee. If you’re not satisfied for any reason, you can just email the VisualCV team and get a full refund.

VisualCV has lots of help and advice about resumes, job hunting, and interviews. You can browse through their articles if you need some help or inspiration.

Cons

The support team is only available from 9am – 5pm PDT. This could be frustrating if you’re in a different timezone or if you want support in the evenings.

You can only create a website if you’re on the paid plan. There isn’t a free website template option like there is on Kickresume.

You can’t preview the website options before signing up for a paid plan. The focus of VisualCV is very much on the resume itself rather than on creating a website.

Pricing

The pro version of VisualCV costs from $12/month (paid quarterly). This gives you access to all the templates.

Expert Pick: Which is the Best Resume Website Builder?

If you want the best website builder for your resume, use WordPress. It’s the most popular website builder in the world. In fact, it powers over 35% of all websites.

WordPress has loads of great resume templates (themes) that will work brilliantly for you. You can add as many pages and features to your website as you want.

Five WordPress themes that could work for your resume website

It’s also a really affordable option. If you use our Bluehost web hosting offer, you’ll get your domain name completely free for a year. That might well be all you need if you land that dream job in a few months’ time.

To create your resume website, you can follow our step by step guidance on how to make a website with WordPress (video included).

Or if you prefer, we can get you up and running with our WordPress setup service.

What if you’d like an alternative to WordPress? In that case, we recommend using Constant Contact’s website builder. It’s really easy to get up and running with it. You can try it out completely free. You only need to pay when you’re ready to put your website live.

We hope this article helped you learn about the best online resume builders. You might also want to take a look at our tutorial on how to setup a professional business email address and how to get a virtual business phone number.

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 6 Best Online Resume Website Builders (Easy to Use) appeared first on WPBeginner.


May 15, 2020 at 04:24PM

Thursday, May 14, 2020

How to Create a Custom WordPress Widget

Do you want to create your own custom widgets in WordPress? Widgets allow you to add non-content elements into a sidebar or any widget-ready area of your website.

You can use widgets to add banners, advertisements, newsletter sign up forms, and other elements to your website.

In this article, we will show you how to create a custom WordPress widget, step by step.

Creating a custom WordPress widget

Note: This tutorial is for DIY WordPress users who are learning WordPress development and coding.

What is a WordPress Widget?

WordPress widgets contain pieces of code that you can add to your website’s sidebars or widget-ready areas.

Think of them as modules that you can use to add different elements by using a simple drag and drop interface.

By default, WordPress comes with a standard set of widgets that you can use with any WordPress theme. See our beginner’s guide on how to add and use widgets in WordPress.

Adding widgets in WordPress

WordPress also allows developers to create their own custom widgets.

Many premium WordPress themes and plugins come with their own custom widgets that you can add to your sidebars.

For example, you can add a contact form, a custom login form, or a photo gallery to a sidebar without writing any code.

Having said that, let’s see how to easily create your own custom widgets in WordPress.

Video Tutorial

If you prefer written instructions, then please continue reading.

Creating a Custom Widget in WordPress

If you are learning WordPress coding, then you will need a local development environment. You can install WordPress on your computer (Mac or Windows).

There are several ways to add your custom widget code in WordPress.

Ideally, you can create a site-specific plugin and paste your widget code there.

You can also paste the code in your theme’s functions.php file. However, it will only be available when that particular theme is active.

Another tool that you can use is the Code Snippets plugin which allows you to easily add custom code to your WordPress website.

In this tutorial, we will create a simple widget that just greets visitors. The goal here is to familiarize yourself with the WordPress widget class.

Let’s get started.

Creating a Basic WordPress Widget

WordPress comes with a built-in WordPress Widget class. Each new WordPress widget extends the WordPress widget class.

There are 18 methods mentioned in the WordPress developer’s handbook that can be used with the WP Widget class.

However, for the sake of this tutorial, we will be focusing on the following methods.

  • __construct() : This is the part where we create the widget ID, title, and description.
  • widget : This is where we define the output generated by the widget.
  • form : This part of the code is where we create the form with widget options for backend.
  • update: This is the part where we save widget options in the database.

Let’s study the following code where we have used these four methods inside the WP_Widget class.

// Creating the widget 
class wpb_widget extends WP_Widget {

// The construct part  
function __construct() {

}
 
// Creating widget front-end
public function widget( $args, $instance ) {

}
         
// Creating widget Backend 
public function form( $instance ) {

}
     
// Updating widget replacing old instances with new
public function update( $new_instance, $old_instance ) {

}

// Class wpb_widget ends here
} 

The final piece of the code is where we will actually register the widget and load it inside WordPress.

function wpb_load_widget() {
    register_widget( 'wpb_widget' );
}
add_action( 'widgets_init', 'wpb_load_widget' );

Now let’s put all of this together to create a basic WordPress widget.

You can copy and paste the following code in your custom plugin or theme’s functions.php file.


// Creating the widget 
class wpb_widget extends WP_Widget {
 
function __construct() {
parent::__construct(
 
// Base ID of your widget
'wpb_widget', 
 
// Widget name will appear in UI
__('WPBeginner Widget', 'wpb_widget_domain'), 
 
// Widget description
array( 'description' => __( 'Sample widget based on WPBeginner Tutorial', 'wpb_widget_domain' ), ) 
);
}
 
// Creating widget front-end
 
public function widget( $args, $instance ) {
$title = apply_filters( 'widget_title', $instance['title'] );
 
// before and after widget arguments are defined by themes
echo $args['before_widget'];
if ( ! empty( $title ) )
echo $args['before_title'] . $title . $args['after_title'];
 
// This is where you run the code and display the output
echo __( 'Hello, World!', 'wpb_widget_domain' );
echo $args['after_widget'];
}
         
// Widget Backend 
public function form( $instance ) {
if ( isset( $instance[ 'title' ] ) ) {
$title = $instance[ 'title' ];
}
else {
$title = __( 'New title', 'wpb_widget_domain' );
}
// Widget admin form
?>
<p>
<label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e( 'Title:' ); ?></label> 
<input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo esc_attr( $title ); ?>" />
</p>
<?php 
}
     
// Updating widget replacing old instances with new
public function update( $new_instance, $old_instance ) {
$instance = array();
$instance['title'] = ( ! empty( $new_instance['title'] ) ) ? strip_tags( $new_instance['title'] ) : '';
return $instance;
}

// Class wpb_widget ends here
} 


// Register and load the widget
function wpb_load_widget() {
    register_widget( 'wpb_widget' );
}
add_action( 'widgets_init', 'wpb_load_widget' );

After adding the code you need to head over to Appearance » Widgets page. You will notice the new WPBeginner Widget in the list of available widgets. You need to drag and drop this widget to a sidebar.

Demo widget

This widget has only one form field to fill, you can add your text and click on the Save button to store your changes.

Now you can visit your website to see it in action.

Previewing your custom widget

Now let’s study the code again.

First we registered the ‘wpb_widget’ and loaded our custom widget. After that we defined what that widget does, and how to display the widget back-end.

Lastly, we defined how to handle changes made to the widget.

Now there are a few things that you might want to ask. For example, what’s the purpose wpb_text_domain?

WordPress uses gettext to handle translation and localization. This wpb_text_domain and __e tells gettext to make a string available for translation. See how you can find translation ready WordPress themes.

If you are creating a custom widget for your theme, then you can replace wpb_text_domain with your theme’s text domain.

We hope this article helped you learn how to easily create a custom WordPress widget. You may also want to see our list of the most useful WordPress widgets for your site.

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

The post How to Create a Custom WordPress Widget appeared first on WPBeginner.


May 14, 2020 at 03:00PM

Wednesday, May 13, 2020

How to Auto-Apply Coupons in WooCommerce Using Coupon URLs

Do you want to give your WooCommerce customers a special link that automatically applies a coupon for them?

Normally, users need to add their coupon code before checking out. However, coupon URLs make it easy to auto-apply coupons and make it even faster for users to finish the purchase.

In this article, we’ll be showing you how to auto-apply coupons in WooCommerce using coupon URLs.

Auto applying coupon URLs in WooCommerce

Why Use Coupon URLs in WooCommerce?

Coupon links can be a great way to increase sales on your online store because they’re quick and easy for your customers to use.

Customers don’t have to write down or remember a code to put in at checkout. You can send the discount via your email newsletter or in a social media message, and all customers have to do is click on the link to claim the coupon.

Smart business owners use coupon URLs to boost sales during seasonal holidays, such as for Black Friday. This means the coupon is quick and straightforward for your customers to use when they’re likely getting a lot of coupon emails.

Another great time to use coupon URLs is for a flash sale on social media. Again, the coupon is easy for your customers to use, plus only giving the URL (not the coupon code) means you can keep your message short.

Creating a Coupon Link for WooCommerce

The best way to create coupon links in WooCommerce is by using the Advanced Coupons. It is the best WordPress coupon code plugin on the market and allows you to easily create and manage coupons on your eCommerce store.

First, you need to install and activate the Advanced Coupons plugin. If you’re not sure how, our step by step guide on how to install a WordPress plugin will walk you through the process.

Next, you can go to WooCommerce » Coupons to create your coupon link. Click ‘Create your first coupon’ or ‘Add coupon’ to create a new coupon.

Create a new coupon using the Advanced Coupons plugin

At the top of the page, enter your chosen coupon code and (optionally) a description.

Adding the code for your coupon in Advanced Coupons

Next, you’ll need to enter the coupon’s details in the ‘Coupon Data’ section. Start with ‘General’, where you can set the discount.

For our example, we’re going to use a ‘Fixed cart discount’ for the discount type. We’ll give the customer a discount of 25%.

Creating a 25% discount coupon

If you want to, you can set specific restrictions for your coupon under the ‘Usage restriction’ and ‘Usage limits’ tabs. For instance, you might want to set a usage limit so that the coupon can only be used once per user.

Setting a usage limit using Advanced Coupons

You can also schedule coupons with a start and end date. This is useful if you want to set it up for use in the future, or if you want to automatically end your promotion at a specific point.

Setting a start and end date for your coupon in Advanced Coupons

Next, click the ‘URL Coupons’ tab. This is where you can enter the details of your coupon.

Entering the details for your auto-apply coupon in Advanced Coupons

The ‘Coupon URL’ in WooCommerce is automatically generated for you, so you don’t need to enter anything here.

If you want to use something other than your coupon code itself at the end of the URL, then you can type it in the ‘Code URL Override’ box.

In ‘Redirect To URL’, you should paste the link of the page you want the customer to go to. This might be your storefront or a specific area of your store.

Your ‘Custom Success Message’ can be whatever you like.

To get your coupon URL, you’ll need to click ‘Publish’ on the right hand side of your screen. Then, you can go back to the ‘URL Coupons’ tab and you’ll see your URL in place:

The auto-generated URL for your coupon

Now, you can send out your URL by email or social media. When someone clicks on it, the coupon will be automatically applied to their cart.

How to Promote Your Coupon URLs in WooCommerce

The next step is to promote your Coupon URLs.

First, you would obviously want to promote it to your email newsletter subscribers and social media followers.

Next, you can promote the coupon URL on your website.

The easiest way to do this is by using OptinMonster. It is the best conversion optimization software on the market and helps you convert website visitors into paying customers.

It comes with beautiful lightbox popups, slide-in popups, fullscreen welcome mats, and more.

Promoting your coupon URL in WooCommerce

You can simply add popups on the individual product pages with a button to auto-apply coupon URL. For details, see our article on how to add coupon popup in WooCommerce.

We hope this article helped you learn how to auto-apply coupons in WooCommerce using URLs. You might also like our expert pick of the best WooCommerce plugins for your online store, and our guide on how to create a WooCommerce contest to boost loyalty and engagement.

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 Auto-Apply Coupons in WooCommerce Using Coupon URLs appeared first on WPBeginner.


May 13, 2020 at 05:04PM

Tuesday, May 12, 2020

How to Easily Change the Font Size in WordPress

Do you want to change the font size in your WordPress posts or pages?

Sometimes, you may want to make a line or a paragraph larger, or you might want to increase the font size of your entire page content.

In this article, we’ll show you how to easily change the font size in WordPress. You’ll learn not only how to change font size in your WordPress posts, but also how to do it across your website.

Change font size in WordPress

Method 1: Using Paragraph Headings

It takes your visitors just a couple of seconds to decide whether they want to stay or leave your website. This gives you very little time to convince them to stay on your website.

Using Headings in your content is a great way to grab user attention.

They allow you to break your posts and pages into sections using different headings (often called “subheadings”).

Headings are great for SEO as well. Search engines give proper headings more weight than normal paragraph text.

How to add a heading in the default WordPress block editor

You can add a heading to your posts or pages by simply adding the ‘Heading’ block. You can search for it or find it in the ‘Common Blocks’ section in the WordPress block editor.

Adding a heading block in Gutenberg

The block will default to Heading 2. Normally, it makes sense to stick with Heading 2 for your subheadings. If you want to change this, then you can simply click on the ‘H2’ drop-down to select a different size.

Selecting your Heading size in the block editor

Alternatively, you can change this in the block settings on the right-hand side of the screen. You can also change the heading’s color there as well.

How to add a heading in the older Classic Editor

If you are still using the older classic editor in WordPress, then you can add headings using the ‘Paragraph’ drop-down.

Just highlight the text that you want to turn into a heading, click the ‘Paragraph’ drop-down, and select your heading size.

Creating a heading by clicking on the Paragraph drop-down in the classic editor

The sizes and colors of the different Heading styles are controlled by your theme’s stylesheet (style.css).

If you’re using a premium WordPress theme, then you may have the option to change these settings under Appearance » Customize.

Using subheadings in your articles makes it easier for readers to follow what you’re telling them. At the same time, it also makes your WordPress posts SEO friendly.

Method 2: Changing the Size of the Text in the Block Editor

What if you want to have a paragraph or even your whole post in a larger font? You can do this really easily using the default WordPress block editor.

Just click on any paragraph block, then select the font size under ‘Text Settings’ on the right-hand side.

Changing the text size of a paragraph block

You can select from the drop-down, which covers Small, Normal, Medium, Large, and Huge. If you change your mind, then just click the ‘Reset’ button to set your paragraph back to the default text.

There’s also a ‘Custom’ option where you can simply type in the pixel size that you’d like. If you want, you can also set a large Drop Cap to appear at the start of your paragraph.

These options aren’t available in the older classic editor for WordPress. If you want to use them, then think about making the switch. Our tutorial on how to use the new WordPress block editor will help you.

If you are determined to stick with the classic editor, then this next option is for you.

Method 3: Change Font Size Using The TinyMCE Advanced Plugin

TinyMCE Advanced is a WordPress plugin that gives you more control over font sizes and text formatting, as well as a range of other features.

This is particularly useful with the older classic editor, but it also works with the block editor. It adds a new block called “Classic Paragraph” that has all the TinyMCE controls.

To use it, you’ll first need to install and activate the TinyMCE Advanced plugin. If you’re not sure how to do that, check out our step by step guide on how to install a WordPress plugin.

Next, go to Settings » TinyMCE Advanced to configure the editor settings. This is where you can set up the buttons you want to use in the TinyMCE Advanced toolbar.

If you’re using it with the Classic editor, then you should see that TinyMCE has the ‘Font Size’ drop-down enabled by default in the second row of icons.

You can move it to the first row by dragging it upwards if you want.

The font sizes drop-down button on the TinyMCE Advanced menu for the classic editor

If you’re using the block editor, then you’ll need to scroll down the screen and add the Font Sizes drop-down to the toolbar by dragging and dropping it:

Adding the font sizes button to the TinyMCE Advanced block toolbar

Make sure you click ‘Save Changes’ at the bottom of the screen.

To see the button in action, create a new post or edit an existing one.

In the block editor, you’ll now have the option to add a ‘Classic Paragraph’ block. It will have the TinyMCE Advanced controls, like this:

The Classic Paragraph block in the block editor, added by the TinyMCE Advanced plugin

In the classic editor, you’ll see the TinyMCE Advanced toolbars with a font size drop-down:

Changing the font size using the TinyMCE Advanced editor

You can select any font size from the drop-down.

Note: this doesn’t give you as many options as the WordPress block editor, and you can’t type in your own font size.

Method 4: Change Site-Wide Font Size Using CSS

If you are changing font sizes every time you edit a post, then you may want to make it easier by changing it permanently in your theme.

The good news is that you can change the default paragraph size across your whole site. The best way to do this is by using the Theme Customizer under Appearance » Customize.

Some WordPress themes may come with an option for you to change the font size. If you can find this option, then you can use it without writing CSS code.

However, if your theme does not have that feature, then you can add custom CSS to add your own font size rules.

Simply click on the ‘Additional CSS’ option in the theme customizer. This is where you can store all your custom CSS code.

Using the Customizer to add CSS code to your site

Now under the additional CSS text box, simply add your CSS code. In this example, we are changing the font size to ’16px’, you can choose a different font size.

p { 
font-size:16px; 
} 

You’ll immediately see the changes on the preview on the right-hand side of the screen. If you’re happy with the font size, click the ‘Publish’ button at the top of your screen to make it live.

Note: Your custom CSS will only be applied to the theme you’re using. If you later choose to switch to a different WordPress theme, you’ll need to copy and paste it into the Customizer again.

The above code only applies to paragraph text. What if you wanted to change the font size of all h2 sub-headings?

Simply modify the above code to target the h2 element in your theme like this:

h2 { 
font-size:32px; 
} 

You can do the same thing with other headings as well by simply changing h2 to h3, h4, or h5.

We hope this article helped you learn how to easily change the font size in WordPress. You may also want to see our guide on how to use custom fonts in WordPress or our list of the best drag & drop 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 Easily Change the Font Size in WordPress appeared first on WPBeginner.


May 12, 2020 at 03:20PM