Tag - Site
17 Apr

How to Easily Display Code on Your WordPress Site


Do you want to display code in your WordPress blog posts? If you tried to add code like regular text, then WordPress will not display it correctly.

WordPress runs your content through several cleanup filters each time you save a post. These filters are there to make sure someone does not inject code via post editor to hack your website.

In this article, we will show you the proper ways to easily display code on your WordPress site. We will show you different methods, and you can choose the one that best fits your needs.

How to easily display code in WordPress posts

Method 1. Display Code Using The Default Editor in WordPress

This method is recommended for beginners and users who don’t need to display code very often.

Simply edit the blog post or page where you want to display the code. On the post edit screen, add a new code block to your post.

Add code block to your WordPress posts

You can now enter the code snippet in the text area of the block.

Add code to your blog post

After that, you can save your blog post and preview it to see the code block in action.

PHP code displayed in WordPress

Depending on your WordPress theme, the code block may look different on your website.

Method 2. Display Code in WordPress Using a Plugin

For this method, we will be using a WordPress plugin to display code in your blog posts. This method is recommended for users who often display code in their articles.

It gives you the following advantages over the default code block:

  • It allows you to easily display any code in any programming language
  • It displays the code with syntax highlighting and line numbers
  • Your users can easily study the code and copy it

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

Upon activation, you can go ahead and edit the blog post where you want to display the code. On the post edit screen, add the ‘SyntaxHighlighter Code’ block to your post.

SyntaxHighlighter code block

You will now see a new code block in the post editor where you can enter your code. After adding the code, you need to select the block settings from the right column.

SyntaxHighlighter code block settings

First, you need to select the language for your code. After that, you can turn off line numbers, provide first line number, highlight any line you want, and turn off the feature to make links clickable.

Once you are done, save your post and click on the preview button to see it in action.

Code displayed with syntax highlighting

The plugin comes with a number of color schemes and themes. To change the color theme, you need to visit Settings » SyntaxHighlighter page.

SyntaxHighlighter settings

From the settings page, you can select a color theme and change SyntaxHighlighter settings. You can save your settings to see a preview of the code block at the bottom of the page.

Code block preview

Using SyntaxHighlighter with Classic Editor

If you are still using the old classic WordPress editor, then here is how you would use SyntaxHighlighter plugin to add code to your WordPress blog posts.

Simply wrap your code around square brackets with the language name. For example, if you are going to add PHP code, then you will add it like this:

[php]
<?php
private function get_time_tags()
$time = get_the_time('d M, Y');
return $time;

?>
[/php]

Similarly, if you wanted to add an HTML code, then you will wrap it around the HTML shortcode like this:

[html]
<a href="example.com">A sample link</a>
[/html]

Method 3. Display Code in WordPress Manually (No Plugin or Block)

This method is for advanced users because it requires more work and does not always work as intended.

It is suitable for users who are still using the old classic editor and want to display code without using a plugin.

First, you need to pass your code through an online HTML entities encoder tool. It will change your code markup to HTML entities, which will allow you to add the code and bypass the WordPress cleanup filters.

Now copy and paste your code in the text editor and wrap it around <pre> and <code> tags.

Adding code manually in classic editor

Your code would look like this:

<pre><code>
&lt;p&gt;&lt;a href=&quot;/home.html&quot;&gt;This is a sample link&lt;/a&gt;&lt;/p&gt;
</pre></code>

You can now save your post and preview the code in action. Your browser will convert the HTML entities and users will be able to see and copy the correct code.

Manually displaying code in WordPress

We hope this article helped you learn how to easily display code on your WordPress site. You may also want to see our ultimate list of the most wanted WordPress tips, tricks, and hacks.

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 Display Code on Your WordPress Site appeared first on WPBeginner.



Source link
By News , , , , Comments OffRead more...
03 Apr

Why You Can’t Find .htaccess File on Your WordPress Site


Are you having trouble finding the .htaccess file in WordPress? We are often asked by beginners ‘Where is my .htaccess file?’ and ‘Why I cannot find it on my WordPress site?’.

Sometimes you may need to edit the .htaccess file or delete it to fix a common WordPress errors. In this article, we will explain why you can’t find .htaccess file on your WordPress site, and how to easily locate it.

Finding the .htaccess file for your WordPress site

What is .htaccess file?

The .htaccess file is a server configuration file which tells your server how to handle certain things on your website. Like how to redirect users, password protect admin area, or protect some directories, etc.

It is located in your WordPress site’s root folder. WordPress uses it to manage redirects and permalinks.

The .htaccess file is an incredibly powerful configuration file and can be used to do a lot useful things. See our article on the most useful .htaccess tricks for WordPress for some examples.

Why I Can’t Find .htaccess File?

There are two common reasons for not finding the .htaccess file in your website’s root folder. It’s either hidden by your file manager software, or it doesn’t exist at all.

We will explain both of them with solutions.

1. Your FTP Client is Not Showing Hidden Files

The dot before the htaccess file name indicates that it is a hidden file. By default, when you connect to your WordPress hosting server using an FTP client, it will not show the hidden files.

To make hidden files visible, you will need to change your FTP client settings.

For example, in FileZilla, you can find the option under ‘Server » Force showing hidden files’ menu.

Show hidden files in FileZilla

If you are using the File Manager app in cPanel, then you will find the option to show hidden files before launching the app.

Show hidden files in cPanel

For other FTP clients, you will find the option to show hidden files in app settings or preferences menu.

After enabling this option, you would be able to view all hidden files including .htaccess file for your WordPress site.

2. The .htaccess File Doesn’t Exist

The second most common reason for missing .htaccess file is that your WordPress site has not generated it yet.

WordPress automatically generates .htaccess file because it is required to properly redirect permalinks.

If your .htaccess file is missing, then the first thing you need to do is to visit Settings » Permalinks page and click on ‘Save Changes’ button without changing anything.

Permalinks settings page

WordPress will now try to generate the .htaccess file for you.

On some rare occasion, WordPress may not be able to generate the .htaccess file due to file permissions issue.

In that case, it will show you a message at the bottom of the Settings » Permalinks page, saying that the ‘.htaccess file is not writeable’.

You will need need to manually create the .htaccess file and add the required code inside it.

htaccess file not writeable

Simply copy and paste this code in a text editor like Notepad. After that, you need to save it as .htaccess file on your desktop.

Now connect to your website using an FTP client and upload the .htaccess file from your desktop.

If you get an error while uploading the file, then you need to change the file permission for your root directory.

Let’s suppose all your WordPress files reside under /home/johnsmith/public_html/ directory.

This makes public_html folder your root directory. You need to go to its parent directory and right click on the public_html folder. Select File Permissions, which will open a file permissions dialog box.

Now enter 755 into the file permission dialog box and then try to upload your .htaccess file to the public_html folder.

Changing file permissions via FTP

We hope this article helped you find .htaccess file on your WordPress site. You may also want to see our WordPress troubleshooting guide to learn how to diagnose and fix WordPress issues all by yourself.

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 Why You Can’t Find .htaccess File on Your WordPress Site appeared first on WPBeginner.



Source link
By News , , , , Comments OffRead more...
22 Mar

How to Make a Niche Review Site in WordPress Like a Pro


Do you want to create a reviews website and make money blogging?

Online reviews help others make a buying decision while allowing you to earn referral fees, known as affiliate commissions. You can build a reviews website dedicated to a specific niche, or you can add a reviews section to your existing blog.

In this article, we will show you how to easily create a niche review site in WordPress and make money from it.

Making a review site with WordPress

Here are the steps we will cover in this guide.

  • Why create a reviews site
  • Before you start
  • Chosing a theme for your reviews website
  • Installing WordPress reviews plugin
  • Adding a review in WordPress
  • Displaying reviews in sidebars
  • Making money from your reviews site
  • Taking your reviews site to the next level
  • Mastering WordPress skills

Why Create a Reviews Site?

What’s the first thing that you do when you’re looking to buy something online?

If you’re like most of us, then you check the online reviews of that product to see what others are saying about it.

This is why a popular online review site, TripAdvisor, is worth roughly $8.5 billion dollars.

While everyone cannot be as big as TripAdvisor, we know several folks that are earning anywhere from a few hundred to a few thousand dollars a month from running a niche review site.

There are two popular ways to create a review website. The first is to add a reviews section on your existing WordPress blog. The second is to create a completely independent online reviews site.

Regardless of the direction you choose, it’s important that you don’t pick a highly competitive niche.

For example, there are tons of sites talking about digital camera reviews, but not as many that are talking about camera accessory reviews.

The secret to building a successful review site is to find the right niche. A perfect niche has low competition, and it should be something that you’re passionate about.

Here are a few factors to think about:

  • What resources can you offer to build traffic?
  • Can you easily attract advertisers? (i.e are there people selling paid products)
  • Are there affiliate programs available?
  • Are other people making money in this niche?
  • What is the competition like?

You can use tools like SEMRush, Ahrefs, and Google Keyword Planner to help with research. See our beginner’s guide on how to do keyword research for step by step instructions.

Once you have picked your niche, let’s take a look at how you can create a reviews site.

Step 0. Before You Start

Before you start your website, you need to choose the right blogging platform. Ofcourse WordPress is #1, but there are actually two different types of WordPress.

First, there is WordPress.com which is a limited hosted platform. Second, you have the popular WordPress.org, also known as self-hosted WordPress. When you hear WordPress, people are typically talking about WordPress.org. To understand the difference, see our comparison of WordPress.com vs WordPress.org.

We recommend using WordPress.org because it gives you full freedom to create any kind of website. It also gives you full access to all WordPress features out of the box.

To get started with WordPress, you’ll need a good WordPress hosting company and your own domain name.

We highly recommend Bluehost because they are an officially recommended WordPress hosting provider, and one of the largest hosting companies in the world.

Not to mention, they are giving our users a free domain name, free SSL certificate, and 63% off their hosting plan (special for WPBeginner users).

→ Click Here to Claim This Exclusive Bluehost Offer ←

If you want a Bluehost alternative, then take a look at Siteground who also offer an exclusive discount to WPBeginner readers.

Once you have signed up for hosting and set up your domain name, the next step is to install WordPress. With Bluehost, WordPress comes pre-installed. Most other hosting companies offer 1-click WordPress install option. We have created a step by step guide on how to install WordPress which covers every major hosting platform.

Once you have your WordPress site setup, you will reach the WordPress dashboard.

WordPress dashboard

Step 1. Choosing the Perfect WordPress “Review” Theme

The first step after setting up your WordPress site is to select a perfect WordPress theme.

When you’re searching for best WordPress review themes, you will likely come across several themes that offer complete review-site functionality baked into the theme. You need to avoid those at all cost.

You don’t need a WordPress review site template. Most of those WordPress review themes are bloated and will lock you into using them forever.

That’s why it’s better to use a WordPress reviews plugin because plugins will work with any theme/design that you choose.

You will have the flexibility to change your themes in the future without having to hire a developer.

We have an article that will help you find the perfect theme. Basically, pick a theme that you like in terms of look and feel. We will show you how to add the reviews functionality in the next step.

Once you have found the theme you like, you can go ahead and install it. Need help installing theme? See our guide on how to install a WordPress theme for step by step instructions.

Step 2. Installing the best WordPress Reviews Plugin

Now that your website is ready, it is time to add reviews functionality to your website. We will be using a plugin to add SEO friendly reviews that make your website more easily discoverable by search engines and users.

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

This base plugin is available for free and comes with all essential features. However, you may need to upgrade to the premium version of the plugin to unlock advanced features like product comparison table, Amazon Affiliate integration, multiple templates, and more.

WP Product Review plugin is easy to use, and it helps you stand out in search engines by adding schema markup or rich snippets for your reviews.

In plain English, it adds those star ratings next to your reviews in Google to help you stand out.

Rich snippets in Google search

Upon activation, you will notice a new menu item labeled ‘Product Review’ in your WordPress admin menu. Clicking on it will take you to the plugin’s settings page.

WP Product Review settings

The settings page is divided into different sections. First, you need to set up the general settings.

Start by selecting where you want to display the review box. There are three options to choose from. You can show the review box after the content, before the content, or you can manually add it using the shortcode.

The next option is to choose whether you want to allow users to add their reviews as comments. If you allow this, then you also need to select how much influence user reviews will have on the actual review.

After that, you need to choose the numbers of options, pros, and cons that you want to be displayed. By default, the plugin will allow you to add 5 of each. You can adjust that as needed.

Another important option on this page is to enable the ‘Review’ post type. Basically, the plugin allows you to convert any WordPress blog post or page into a review.

However, some users may want to keep reviews separate from their blog posts and pages. The default option is ‘No’, and if you are unsure, then you can leave it as is.

Now move on to the rating colors tab in settings. This is where you can define the default colors used by the plugin for ratings. WP Product review uses different colors for excellent, good, not bad, and weak ratings.

Choose rating colors

You can change the rating colors to match with your theme design.

Next, click on the ‘Typography’ tab in the settings. This is where you can choose the default text for pros and cons columns. You can also change the text colors for different sections.

Typography

The final tab on the settings page is the buy button. On this tab, you can select the colors you want to use for the buy button.

Buy button will also have your affiliate link, so it is important that you choose a color that’s likely to stand out, so more users can click on it.

Buy button

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

Step 3: Adding a Review in WordPress

Adding a review using WP Product Review plugin is quite easy. There are basically two ways you can add product reviews in WordPress using WP Product Review plugin.

  • Add reviews to the reviews post type
  • Add review to any WordPress post or page

Regardless of how you choose to publish reviews, adding reviews in WordPress will be the same.

The plugin allows you to convert any WordPress post or page into a review. Simply edit or create a new post in WordPress.

If you have enabled the reviews post type, then you will need to visit Reviews » Add New page to add your review.

You will write your main review like you would write any other post in WordPress.

Under the ‘Document’ meta box in the right column, you will find the option labeled ‘Is this post a review’. Turning it on will display the options to add your product review.

Enable product review features

First, you need to provide product details like images, buy now button text, product or affiliate link, and product price.

Product review details

After that, you need to add specific product features and your grade score for that respective feature. Click on the Add option button to add more features if needed.

Product features and grading

Next, you will add the pros and cons lists. You need to add the best features of the product in the pros list and the features it lacked in the cons list.

Pros and cons

Once you are done, simply save or publish your post.

You can now visit the post to see the review box in action.

Review box

Note: If you are still using the old Classic Editor, then you will find the product review meta box below the post editor.

Product review box in classic editor

Step 4. Displaying Your Reviews in Sidebar

WP Product Review allows you to show your review posts in the sidebar and other widget-ready areas.

Visit Appearance » Widgets page, and you will find the top products and the latest products widgets.

Latest product reviews widget

Simply add the widget to a sidebar and configure its options. You can select the number of products you want to display, product title and image display settings. Once you are done, click on the save button.

Next, go ahead and visit your website to see the reviews widget in action. It will show the latest reviews with ratings and product image.

Reviews in sidebar widget

Step 5. Making Money From Your Reviews Site

Reviews site are a great way to generate passive income on the side. There are multiple ways to make money from your niche review site.

Following are some of the most common ways used by reviews websites to generate revenue.

1. Affiliate Marketing

Affiliate marketing allows you to make money from your reviews by recommending products on your website. You earn a commission when users click on your referral link and buy the product.

You will need to find products that have an affiliate program. The easiest way to find awesome products in every niche is by joining a large affiliate network like ShareAsale or Amazon Associates.

To learn more, see our beginner’s guide to affiliate marketing with detailed instructions and tools/plugins you’ll need to grow your business.

2. Advertisements

Most websites on the internet generate their revenue by displaying ads. You get paid either for impressions or when a user clicks on the ad from your website.

The easiest way to displays ads on your reviews site is by using Google AdSense. This gives you access to thousands of advertisers who are looking for targetted audiences.

To learn more, see our guide on how to properly add Google AdSense to your WordPress site.

Apart from Google AdSense, you can join other advertising networks like Media.net or sell ads directly to advertisers. This allows you to diversify and maximize advertising revenue on your reviews website.

3. Paid Reviews

This direct approach allows you to cut the middleman and directly reach out to businesses that want their products to be reviewed.

You get paid for testing and writing your honest opinion of the product. This approach requires a lot of outreach and can influence the quality of your reviews.

For more ways to make money from your reviews site, see our list of proven ways to make money online.

Step 6. Taking Your Reviews Site to The Next Level

WordPress is a powerful platform, and it gives you access to thousands of awesome plugins that you can use to grow your reviews site.

Following are just some of the essential plugins that you can install right away.

Pretty Links – It allows you to cloak affiliate links and easily add, manage, and edit affiliate links in WordPress.

WPForms – It is the best WordPress contact form plugin and allows you to quickly create beautiful forms using simple drag and drop form builder.

Yoast SEO – It is the most comprehensive WordPress SEO plugin on the market and will help you get more visitors from search engines.

MonsterInsights – It allows you to easily install Google Analytics in WordPress and shows human-readable reports to understand where your visitors are coming from and which reviews on your website are popular. It also allows you to easily track outbound affiliate links which helps you improve your marketing strategy overtime.

For more plugin recommendations, see our list of the essential WordPress plugins for all websites.

Step 7. Improving Your WordPress Skills

WordPress is quite easy to use even for the beginners. However, occasionally you’ll need help in learning new things as your website grows. This is where WPBeginner can help.

WPBeginner is the largest free WordPress resource site for beginners. We have lots of helpful content which is created specifically for beginners, business owners, and bloggers.

Following are a few of the helpful resources you will find on WPBeginner (all of them are completely free).

  • WPBeginner Blog – The central place for all our WordPress tutorials and guides.
  • WPBeginner Dictionary – Our WordPress glossary is the best place to familiarize yourself with the WordPress lingo
  • WPBeginner Videos – New WordPress users can start with these 23 videos to master WordPress.
  • WPBeginner on YouTube – Need more video instructions? Subscribe to our YouTube channel with more than 130,000 subscribers and 12 Million+ views.
  • WPBeginner Blueprint – Check out plugins, tools, and services we use on WPBeginner.
  • WPBeginner Deals – Exclusive discounts on WordPress products and services for WPBeginner users.

We hope this article helped you learn how to create a niche review site in WordPress like a pro. You may also want to see these practical tips get more traffic to your reviews website.

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 Make a Niche Review Site in WordPress Like a Pro appeared first on WPBeginner.



Source link
By News , , , , Comments OffRead more...
19 Mar

How to Get Rid of /wordpress/ From your WordPress Site URL


Are you trying to remove /wordpress/ from your website’s URL? Sometimes beginners end up installing WordPress in a subdirectory, which causes /wordpress/ to appear in their website URL.

If you accidentally installed WordPress in a subdirectory and want to move it to the root directory, then you’re in the right place. In this article, we will show you how to get rid of /wordpress/ from your WordPress site’s URL.

Removing /wordpress/ from your WordPress site url

Note: The method shown in this tutorial works for other subdirectories as well.

Why You See /wordpress/ in Your WordPress Site URL

WordPress is quite easy to install and nowadays most WordPress hosting companies offer quick WordPress installers in thier hosting control panel.

However, some beginners who are manually installing WordPress may end up accidentally installing it in a subdirectory. Most often this subdirectory is named wordpress.

This happens primarily because users end up uploading the wordpress folder they find inside the official WordPress.org download.

Let’s take a look at how to easily fix this and get rid of /wordpress/ from your site’s URL.

Removing /wordpress/ from WordPress Site URL

If you have just installed WordPress and there is no content on your website, then you can just go ahead and start over.

Simply delete the current installation, and follow the instructions in our WordPress installation tutorial to properly reinstall WordPress.

If you have already added content to your website, then there are two easy ways to remove the /wordpress/ from your site’s URL.

Method 1: Change WordPress Site Address

If you have an established WordPress site, then this method is easier and quicker. The downside of this method is that your media files such as images will still use /wordpress/ in the URL.

First, you need to login to your WordPress site’s admin area and go to Settings » General page.

You will notice the ‘WordPress Address’ and ‘Site Address’ fields and both will have the same URL.

You need to change the Site Address option and point to your root domain, e.g. http://www.example.com and leave WordPress Address option as it is.

Once you do that, click on Save Changes button to store your settings.

Change WordPress site address

Next, you need to connect to your website using an FTP client. Once you are connected, go to the /wordpress/ directory and download the .htaccess and index.php files to your computer.

If you are unable to locate the .htaccess file, then you may need to force your FTP client to show hidden files. If you are using Filezilla, then you need to click on Server from the menu bar and select ‘Force Showing Hidden Files’ option.

Show hidden files in your FTP client

Once you have downloaded both files to your Desktop, you need to open index.php file in a text editor like Notepad. In this file you will find a line like this:

require( dirname( __FILE__ ) . '/wp-blog-header.php' );

This line loads the wp-blog-header.php file which is required to load your WordPress site.

What you need to do now is enter the correct location of the file by replacing the existing line with this one:

require( dirname( __FILE__ ) . '/wordpress/wp-blog-header.php' );

Save your changes and upload both index.php and .htaccess files from your desktop to the root of your domain using FTP. The root folder is the parent folder with the wordpress folder inside it usually called /www/ or /public_html/

Root directory with a separate WordPress folder inside it

That’s all. You can now visit your website using the root domain, and everything will work fine. However, if you need to login to your WordPress admin, then you will still need to go to the wp-admin inside the wordpress directory like this:

http://www.example.com/wordpress/wp-admin

Method 2: Move WordPress to Root Directory

This method is more comprehensive and will permanently move your WordPress site from the subdirectory to the root folder of your website.

Step 1. Create a Duplicator Package

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

Upon activation, you need to visit Duplicator » Settings page and click on the ‘Create New’ button.

Create new duplicator package

This will launch the Duplicator wizard, which will create an installer package of your complete website. Click on the next button to continue.

Next, the plugin will run some scans. If everything looks OK, then you can click on the Build button.

Build duplicator package

Duplicator will now create a package and prompt you to download it along with the installer script. Go ahead and download both files to your computer.

Download duplicator package

Step 2. Create a New Database for a Fresh WordPress Install

You can use the existing WordPress database, but it is better to create a new one so that your old database is safe and unchanged. This way you could revert back to your site without much fuss if something goes wrong.

Visit your hosting account’s cPanel dashboard, scroll down to the ‘Databases’ section, and then click on the ‘MySQL Databases’ icon.

Database cPanel

After that simply provide a name for your database and click on the ‘Create Database’ button.

Create database

Cpanel will now create a new database for you. After that, you need to scroll down to the ‘MySQL Users’ section.

From here you need to provide a username and password for your new database user and click on the ‘Create a user’ button.

Create MySQL user

Now you need to assign database permissions to the new user.

Scroll down to the ‘Add User to Database’ section. Simply select the database user you created from the dropdown menu next to the ‘User’ field, then select the database, and click on the add button.

Add user to database

Your new database is now ready to be used for the fresh WordPress installation.

Step 3. Run the Duplicator Wizard

Now, you need to upload the Duplicator archive package and the installer file you downloaded earlier to the root directory of your website.

This will be the directory containing the /wordpress/ folder.

Upload Duplicator files to the root folder of your website

After you have uploaded both files, open the installer script in a browser window. You will need to enter your site’s root URL and then prefix it with /installer.php.

https://example.com/installer.php

This will open the Duplicator installer wizard.

Duplicator wizard

Check the terms and conditions box and then click on the ‘Next’ button to continue.

Next, it will ask you to provide the database information. Enter the information for the database we created earlier in step 2.

Connect your database

After entering database information, click on the next button to continue.

Duplicator will now unpack your WordPress database backup from the archive into your new database.

Next, it will ask you to update the site URL and Path. You don’t need to do anything here as it will automatically detect new URL and path. However, if it doesn’t, then you can manually enter it here.

New site settings

Duplicator will now finish the migration, and you will be able to click on the Admin login button to access your website on the new location.

Migration finished

Step 4. Set up Subdirectory to Root Folder Redirects

Congrats, you have moved your WordPress site from subdirectory to the root folder.

Now it is time to setup redirects, so that your users and search engines can find your website’s new location.

First, you need to connect to your WordPress site using an FTP client and then delete the old /wordpress/ folder.

Delete old wordpress subdirectory

After that, switch to the admin area of your WordPress site. Since you have moved it to the root of your website your WordPress admin URL will be like this:

https://example.com/wp-admin

Now, you need to install and activate the Redirection plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, you need to visit Tools » Redirection page. The plugin will now show you a setup wizard. Simply click on the continue setup and then finish setup button.

Redirection setup

Next, you need to switch to the ‘Redirects’ tab and add your new redirect.

First check the ‘Regex’ checkbox at the corner of the first field.

After that, For source URL you will add https://example.com/wordpress/.* and for Target URL you will add https://example.com/$1.

Redirect subdirectory to root folder

Don’t forget to replace example.com with your own domain name. Click on the ‘Add Redirect’ button to save your changes.

From now on all users accessing your website with /wordpress/ in the URL will be automatically redirected to correct posts with your new root URL.

That’s all. We hope this article helped you learn how to get rid of /wordpress/ from your WordPress site URL. You may also want to see our comprehensive guide to most common WordPress errors and how to fix them.

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 Get Rid of /wordpress/ From your WordPress Site URL appeared first on WPBeginner.



Source link
By News , , , Comments OffRead more...
29 Jan

Ultimate Guide to Creating a WordPress Membership Site


Do you want to build a membership website? For a long time, website owners relied solely on advertising and affiliate revenue to monetize their content.

A membership website allows you to make money online by allowing users to pay for premium content, features, and access to the community.

You will need a platform that has features for managing users, memberships, payments, etc. Luckily, there are some really great membership plugins for WordPress that make it super easy.

In this step by step guide, we will show you how to easily create a WordPress membership site without any coding knowledge.

Creating a WordPress membership website

What Do You Need to Start a WordPress Membership Website?

Unlike 10 years ago, it’s quite easy to make a website these days. Out of all the platforms and website builders, WordPress makes it the easiest for anyone to build their own membership website and start selling with little to no technical skills.

You’ll need the following three things to start:

  1. A domain name. This will be your website’s address (Example, wpbeginner.com).
  2. A web hosting account. This is where your website files are stored.
  3. A membership addon (It will convert your regular website into a membership platform).

You can set up a fully functional membership website with WordPress in less than 30 minutes, and we’ll walk you through every step of the process.

Below are the steps that we will cover to help you make a powerful membership website with WordPress.

  1. Getting started with a membership site
  2. Choosing a WordPress membership plugin
  3. Setting up your membership website
  4. Adding payment methods
  5. Adding membership levels
  6. Restricting access based on membership plans
  7. Creating members only content
  8. Creating a pricing page
  9. Adding sign up and login forms
  10. Customizing email templates
  11. Viewing reports to grow your website
  12. Extending your membership website

Ready? Let’s get started.

Step 1. Getting Started with a WordPress Membership Site

To create a membership site, you must make sure that you are using the right WordPress platform. Yes, there are two types of WordPress.

We recommend using the self-hosted WordPress.org version because it gives you unrestricted access to all features and tools that you need (see the full comparison of WordPress.com vs WordPress.org).

For a self hosted WordPress site, you’ll need a WordPress hosting account, domain name, and a SSL certificate.

Typically, a domain name costs around $14.99 / year, web hosting around $7.99 / month, and SSL certificate costs around $69.99 / year.

If you are just starting out, then these startup costs can add up quickly.

Thankfully, we have a way to fix that.

Bluehost, an official WordPress recommended hosting provider, has agreed to offer our users a free domain name, free SSL certificate, and a discount on web hosting.

Basically, you can get all of the above for $2.75 per month.

→ Click here to Claim this Exclusive Bluehost offer ←

Note: At WPBeginner we believe in full transparency. If you sign up with Bluehost using our referral link, then we will earn a small commission at no extra cost to you (in fact, you will save money and get a free domain + SSL certificate). We would get this commission for recommending just about any WordPress hosting service, but we only recommend products that we use personally and believe will add value to our readers.

Once you have signed up for hosting, the next step is to install WordPress. Follow the instructions in our step by step guide on how to start a WordPress blog, and you’ll be up and running in no time.

Since Bluehost already comes with WordPress pre-installed, you can move on to setting up your WordPress membership site.

Step 2. Choosing a WordPress Membership Plugin

There are plenty of free and paid WordPress membership plugins that you can use. However, each one of them has its own pros and cons. We have a full comparison of the best WordPress membership plugins.

To choose the right WordPress membership plugin, you need to decide what kind of membership website do you want to build and what features will you need?

If you just want to allow user registration on your WordPress site, then you can use WPForms. It is a WordPress form builder plugin that allows you to easily create user login and registration forms. You can even allow users to submit articles without accessing the WordPress admin area.

On the other hand, if you want to sell subscriptions, paid content, or digital downloads, then you’ll need a more robust WordPress membership plugin, like MemberPress.

MemberPress comes with advanced membership features that allow you to accept payments, create membership levels, restrict access based on levels, and more.

Selling online courses can be another possible scenario. In this case, you’ll need LearnDash, a complete WordPress LMS plugin with all the learning management features.

You can also integrate LearnDash into MemberPress to create a powerful website with online courses as well as membership subscriptions.

That being said, let’s start setting up your WordPress membership website.

Step 3. Setting up Your WordPress Membership Website

We are choosing MemberPress as our go-to plugin because it has all the features we mentioned above, and it works perfectly with third-party plugins necessary for the growth of your business.

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

Upon activation, you need to visit the MemberPress » Options page to configure the plugin settings.

MemberPress options page

Step 4. Add a Payment Method

The options page is divided into different tabs. The first thing you need to set up is a payment gateway because it allows you to accept payments on your membership site.

You can do this by switching to the ‘Payments’ tab and then selecting your payment gateway.

MemberPress payments

MemberPress supports PayPal (Standard, Express, and Pro), Stripe, and Authorize.net out of the box. You need to select the payment method you want to setup and provide the required credentials.

You can also add multiple payment methods by clicking on the add button to add another payment method.

We typically use two options: Stripe for credit cards and PayPal as a secondary option because some users prefer PayPal over giving out credit card details.

Don’t forget to click on the ‘Update Options’ button at the bottom of the page to save your settings.

Step 5. Creating Membership Levels

The next step is to create membership levels that your users can purchase. Each membership level can have different pricing plans, perks, and access. You can even have a free membership plan.

To create a membership level, you need to go to MemberPress » Memberships page and click on the ‘Add New’ button at the top.

Add membership level

On the next page, enter a title for this particular membership plan and then provide the plan details in the post editor.

You will need to set the pricing and expiration for this plan under the membership terms section.

Membership plan

In the example above, we have created a yearly membership plan.

After that, you need to scroll down to the membership options meta box below the post editor. This is where you can customize permissions and membership options for this particular plan.

Membership options

Once you are satisfied with the membership plan, you can click on the publish button to make it available.

Go ahead and repeat this process to create as many membership plans that you need.

Step 6. Restrict Access for Membership Plans

The next step is to select which content would be available to different membership plans on your website. MemberPress makes it very easy to control access using ‘Rules’.

You can setup rules by visiting the MemberPress » Rules page and clicking on the Add New button at the top.

Add new rules

The rule edit page allows you to select different conditions and associate them to a membership plan.

For example, you can select all content that matches a particular tag or category to be available only to members with the silver subscription plan.

Add a rules set to MemberPress

You can also create more specific rules. For example, a single post or page, child pages, or a specific URL.

Below the rules editor, you’ll see the content drip and expiration options.

Drip content allows you to gradually release content to users instead of giving it all away at once. The expiration option makes the content unavailable after a defined period of time.

If you are not sure, then you should leave them unchecked.

Once you are satisfied, go ahead and click on the ‘Save Rule’ button to save your rule settings.

Repeat the process to create more rules as needed for your membership site.

Step 7. Adding Members Only Content

MemberPress makes it super easy to create members-only content using Rules.

In the above example, we created a rule that restricted all content tagged as paid to be restricted. Now all we need to do is to create our paid content and add the paid tag to it.

Adding members only content

MemberPress also adds ‘MemberPress Unauthorized Access’ metabox below the post editor. This allows you to select what logged out users (non-members) will see when they reach this content.

Restricted content options

You can use the global default settings, or you can show excerpts, login form, or a custom message.

Once you have added members-only content, you can go ahead and publish it. As the page reloads, you will see a success message that this content is protected.

Protected content

Step 8. Create a Pricing Page

This is the page your users will see when they want to sign up for a membership plan. On this page, users will be able to select a membership plan and then move to the payment page.

Users who try to access the restricted or paid areas of your website will also be redirected to this page.

You can configure this by going to MemberPress » Groups page and clicking on the Add New button at the top.

Creating a group

First, enter a title for the group plan page. This will also be the title for the plans page that users will see.

Next, go down to ‘Group options’ metabox and add memberships that you want to display on the page.

Pricing group options

You can also select a theme for the pricing table. MemberPress comes with few ready-made templates for that.

Once satisfied, click on the ‘Publish’ button to make your plan publicly visible.

To preview your pricing page, click on the ‘View Group’ link after publishing it.

Pricing page

Redirect users to pricing page

Now that we have the pricing page ready, the next step is to redirect unauthorized users to the pricing page.

To do that, first you need to visit MemberPress » Groups page and copy the URL next to the group you created in the previous step.

Pricing page URL

After that, go to MemberPress » Options page and scroll down to the ‘Unauthorized Access’ section.

You need to check the box next to ‘Redirect unauthorized visitors to a specific URL’ option and then paste the group URL you copied earlier.

Redirect unauthorized users to pricing page

Click on the ‘Update Options’ button to save your settings.

Now unauthorized users will be redirected to the pricing plans page when they try to access a members only area.

Step 9. Add Sign up and User Login Forms

Now that you have everything set up, it is time to allow your users to easily find their way around your website.

First, you need to add a user login form so that members can sign in to their accounts.

Go to Appearance » Widgets and add ‘MemberPress login’ widget to a sidebar.

MemberPress login widget

Next, we will be adding the pricing page link to the navigation menu, so that new users can select a plan and register.

You can do this by visiting the Appearance » Menus page in your WordPress admin. From the left column, you need to click on the Groups tab to expand it. It will show the pricing plan group you created earlier.

Add pricing plans to the menu

Check the box next to your pricing page and then click on the ‘Add to menu’ button.

The pricing plan page will now appear in the right column. You can drag and drop to rearrange its position in the menu. You can also edit it and change the link text.

Edit menu item

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

You can now log out of the WordPress admin area and visit your website to see everything in action.

Membership website preview

Step 10. Customizing Membership Email Templates

Your WordPress membership plugin will send several email notifications to members. MemberPress allows you to easily edit those emails and make changes to include your own branding.

Simply go to MemberPress » Options page and click on the ‘Emails’ tab. From here you can manage email notifications sent by MemberPress.

Editing email notifications in MemberPress

You will see all the email notifications sent by MemberPress to members as well as Administrators. You can click on the edit button to customize any of these notices.

Edit email notices

You can use a simple text editor to edit the email message with basic formatting options and smart tags to insert dynamic items like names, username, membership level, and more.

Make sure that you click on ‘Send Test’ button to send yourself a couple of test notifications. This will ensure that MemberPress can send email notifications.

If you are having trouble receiving email notifications, then see our guide on how to fix WordPress not sending email issue.

Step 11. Viewing Reports to Grow your Membership Website

To grow any business, you need data to make informed decisions. MemberPress comes with built-in reports to see how your membership website is doing.

Simply go to the MemberPress » Reports page. From here, you can sort reports by monthly, yearly, or all time data.

MemberPress reports

It will show you number of active, inactive, free, paid, and total members. It will also show you average member lifetime value and other data. You can scroll below to see more charts and click on a date to view transactions.

However, the most important metric of judging a membership website’s success is user engagement.

This is where you’ll need Google Analytics. It allows you to see where your users are coming from and what they do when they are on your website.

MonsterInsights, the most popular Google Analytics plugin for WordPress, offers a complete MemberPress integration that makes it easy to enable Enhanced Ecommerce Tracking for MemberPress.

For detailed instructions, see our guide on how to track user engagement using Google Analytics in WordPress.

Taking Your Membership Website to The Next Level

MemberPress is a powerful WordPress membership plugin. It allows you to easily grow your membership website.

It works beautifully with LearnDash, which allows you to easily create courses and leave the selling part to MemberPress.

You can also use it alongside BuddyPress and bbPress.

Here are some other useful resources to help you grow your WordPress membership site.

That’s all, we hope this article helped you setup your WordPress membership website. You may also want to see our step by step WordPress SEO guide for beginners.

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

The post Ultimate Guide to Creating a WordPress Membership Site appeared first on WPBeginner.



Source link
By News , , , , , Comments OffRead more...
17 Jan

How to Move WordPress From Local Server to Live Site (2 Methods)


One way to speed up your website development is to build your website locally on your own computer using a software like WAMP (for Windows) or MAMP (for Mac).

Once you’re finished perfecting your website, the next step is to move it from your computer to a live site and share your creation with the world. In this article, we will show you how to easily move WordPress from local server to a live site.

Move WordPress From Local Server to Live Site

We will cover two different methods to move WordPress from local server to your live website (step by step).

The first method uses a WordPress migration plugin and is recommended for beginners. In the second method, we will show you how to manually move WordPress from local server to a live site.

You can choose the method that best suits you:

Before You Begin

In order for you to migrate WordPress from localhost to live server, you need to have a few things in place.

First, we’re assuming that you have a WordPress site running on local server (also called localhost) on your computer, and you have full access to it.

Next, you’ll need to have a domain name and web hosting. We have a list of the best WordPress hosting companies that you can choose from.

To speed it up, you can use Bluehost. They’re an official WordPress recommended hosting provider, and they are offering our users an exclusive 60% off discount + a free domain.

If you need help setting up your website, follow our step by step guide on how to make a website.

Finally, you will need to have a FTP program and know how to use FTP, so you can upload your content to the live site.

Ready? Let’s begin migrating your WordPress site.

Method 1. Transfer WordPress from Local Server to Live Site Using a Migration Plugin

This method is easier and recommended for beginners. We’ll be using a WordPress migration plugin to move WordPress from localhost to a live site.

Step 1. Install and Setup Duplicator Plugin

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

Upon activation, you need to go to Duplicator » Packages page and click on the ‘Create New’ button.

Creating a new Duplicator package

After that, click on the next button to continue.

Duplicator will now run some tests to see if everything is in order. If all items are marked ‘Good’ then click on the ‘Build’ button.

Build package

This process may take a few minutes depending on the size of your website. You need to leave this tab open until the process is complete.

Once finished, you’ll see download options for Installer and the Archive package. You need to click on the ‘One click download’ link to download both files to your computer.

Download package

So what are these files?

Well, the archive file is a copy of your complete WordPress website. It includes all WordPress core files as well as your images, uploads, themes, plugins, and a backup of your WordPress database.

The installer file is a script that will automate the migration by unpacking the archive file.

Step 2. Create a Database for Your Live Site

Before you can run the installer or upload the WordPress website from localhost to your hosting server, you will need to create a MySQL database for your live website.

If you have already created a MySQL database, then you can skip this step.

To create a database you need to visit your hosting account’s cPanel dashboard. Scroll down to the Databases section and then click on the MySQL Databases icon.

Database icon in cPanel

On the next screen, you’ll see a field to create a new database. Simply provide a name for your database and click on the ‘Create Database’ button.

Create new database

cPanel will now create a new database for you. After that, you need to scroll down to the MySQL Users section.

Next, provide a username and password for your new user and click on the ‘Create a user’ button.

Add a MySQL user

The new user you just created, still does not have permission to work on the database. Let’s change that.

Scroll down to the ‘Add User to Database’ section. Simply select the database user you created from the dropdown menu next to the ‘User’ field, then select the database, and click on the add button.

Save user to the database

Your database is now ready to be used with your WordPress site. Make sure to note down the database name, username, and password. You’ll need this information in the next step.

Step 3. Upload Files from Local Server to Live Site

Now you need to upload the archive and installer files from your local site to your hosting account.

First, connect to your live site using an FTP client. Once connected, make sure that the root directory of your website is completely empty.

Normally, root directory is the /home/public_html/ folder.

Some WordPress hosting companies automatically install WordPress when you sign up. If you have WordPress files there, then you need to delete them.

After that, you can upload the archive and installer files from Duplicator to your empty root directory.

Migration files in the root directory

Step 4. Runing The Migration Script

After you have uploaded the migration files, you need to visit the following URL in your browser:

http://example.com/installer.php

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

This will launch the Duplicator migration wizard.

Duplicator intialized

The installer will automatically scan for the archive file and run a validation test. You need to check the terms & conditions checkbox and continue by clicking on the Next button.

On the next screen, it will ask you to enter your WordPress database information.

Your host will likely be localhost. After that, you will enter the details of the database you created in the earlier step.

Connect your database

Click on the next button to continue.

Duplicator will now import your WordPress database backup from the archive into your new database.

Next, it will ask you to update site URL or Path. You shouldn’t have to change anything since it automatically detects the URL of your live website, and its path.

Update site URL

Click on the next button to continue.

Duplicator will now finish the migration and will show you a success screen. You can now click on the ‘Admin Login’ button to enter the WordPress admin area of your live site.

Successfully moved

Once you login to your live site, Duplicator will automatically clean up the installation files.

That’s all, you have successfully moved WordPress from local server to your live site.

Method 2. Manually Transfer WordPress from Local Server to Live Site

In this method, we will show you how to manually move WordPress from local server to your live site. It will come in handy if the first method doesn’t work or you prefer to do it manually.

Step 1: Export Local WordPress Database

The first thing you need to do is export your local WordPress database. We’ll be using phpMyAdmin to do that. If you are unfamiliar with it, then you might want to take a look at our guide to WordPress database management using phpMyAdmin.

Simply go to http://localhost/phpmyadmin/ and click on your WordPress database. Next, click on the Export button from the top menu bar.

Export from localhost

In the Export Method option, you can choose “Quick” or “Custom”. Custom will provide you with more options to export your database.

We recommend choosing Quick, and then click the Go button to download your database.

Export WordPress database using phpMyAdmin

Step 2: Upload WordPress Files to Live Site

Now we’ll need to move all your website files to the live site.

To get started, go ahead and open your FTP client and connect to your web hosting account.

Once you’re connected to your live site, make sure you upload the files in the right directory. For example, if you want the site to be hosted on yoursite.com, then you would want to upload all the files in your public_html directory.

Now select your local WordPress files and upload them to your live server.

Uploading WordPress from localhost to live site

Step 3: Create MySQL Database on Live Site

While your FTP client is uploading your WordPress files, you can start importing your database to the live server. Most WordPress hosting providers offer cPanel to manage your hosting account, so we’ll show you how to create a database using cPanel.

First, you need to log in to your cPanel dashboard and click on the MySQL Databases icon which can be found in the databases section.

Database section in cpanel

On the next screen, create a database by entering a name for your database and clicking the Create Database button.

New database

After creating your database, scroll down to the MySQL Users section and create or add an existing user to the database.

After adding the user, cPanel will take you to set MySQL privileges for that user. Simply grant all privileges to the user by making sure every box is checked, and then click the Make Changes button.

grant all privileges to database user

Step 4: Import WordPress Database on Live Site

The next step in the process is to import your WordPress database.

Go to your cPanel dashboard, scroll down to the databases section and click on phpMyAdmin.

This will take you to phpMyAdmin where you want to click on the database you created in Step 3. PhpMyAdmin will show your new database with no tables.

Click on the Import tab in the top menu. On the import page, click on Choose File button and then select the database file you saved in Step 1.

Lastly, press the Go button at the bottom of the page. PhpMyadmin will now import your WordPress database.

Import database via phpMyAdmin

Step 5: Change the Site URL

Now you need to change the site URL in your database, so that it will connect with your live WordPress site.

In phpMyAdmin, look for the wp_options table in your database that we just imported in step 4. If you changed your database prefix, then instead of wp_options it might be prefix_options.

Click on the Browse button next to wp_options or the link that you see in the sidebar to open the page with a list of fields within the wp_options table. See screenshot below:

Browse the wp options table

Under the field options_name, you need to look for siteurl. Click the Edit Field icon which can be found at the far left at the beginning of the row.

Edit siteurl in phpMyAdmin

When you click the edit field, an edit field window will appear. In the input box for option_value, you will see the URL of your local install probably something like: http://localhost/test. Carefully insert your new site url in this field, for example: https://www.wpbeginner.com

Save the field by clicking the Go button.

edit the siteurl field

Next, you need to replicate this step for the option name: home. The wp_options page can be a few pages long, so simply find the home tab.

Usually it is on the second page which you can navigate to by clicking on the pagination arrows in phpMyAdmin.

Update the home url to be the same as your siteurl.

Step 6: Setup Your Live Site

Now that we have imported the database and all of our content should be uploaded, it’s time to configure WordPress.

At this time, your site should be showing an Error Establishing Database Connection error.

To fix this, connect to your website using an FTP client and edit wp-config.php file.

You will need to provide the database name, user and password you created earlier in Step 3.

Next, save the wp-config.php file and upload it back to your server.

You can now visit your website, and it should be live now.

Next, you need to login to your WordPress admin panel and go to Settings » General. Without changing anything, scroll to the bottom and click the Save Changes button.

This will ensure that the site URL is corrected anywhere else that it needs to be.

After that go to Settings » Permalink and click Save Changes to ensure that all post links are working fine.

Step 7: Fix Images and Broken Links by Updating Paths

Whenever you are moving a WordPress site from one domain to another, or from local server to a live site, you’ll face broken links and missing images.

You can either use the SQL query or use the Velvet Blues WordPress plugin.

For those who want to do it via SQL, here is a simple SQL query that should solve this problem:


UPDATE wp_posts SET post_content = REPLACE(post_content, 'localhost/test/', 'www.yourlivesite.com/');

Simply go to phpMyAdmin, click on your database and then click on SQL from top menu. Write this query, but don’t forget to change it with your own local site and live site URLs.

Fixing WordPress images and broken URLs after moving to live site

That’s all, you have successfully migrated WordPress from localserver to a live site!

Hopefully now your live website is up and running smoothly. Be sure to check out your website to make sure that everything is working as expected. If you notice any errors, you can check out our guide to common WordPress errors for help troubleshooting.

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.



Source link
By News , , , , , , Comments OffRead more...
10 Jan

How to Test Your Site for Updating to Gutenberg (WordPress 5.0)


Are you excited to use the new WordPress Gutenberg editor? Officially launched with WordPress 5.0, Gutenberg is the new default content editor for WordPress that allows you create visually stunning content using blocks.

The challenge is that some themes and plugins may not properly support Gutenberg, so updating your website can cause unexpected issues.

In this article, we’ll show you how to test your WordPress site for updating to Gutenberg and WordPress 5.0.

Testing your site for update to Gutenberg and WordPress 5.0

Why Test Your WordPress Site Before Updating to Gutenberg?

WordPress 5.0 brings a totally new way of creating content with a brand new editor called The Block Editor or Gutenberg. It uses blocks which are content elements that you can move around the editor.

New WordPress Block Editor also known as Gutenberg

WordPress 5.0 with Gutenberg editor is indeed a revolutionary improvement to the WordPress platform.

However due to this massive change, some users are reluctant to update their sites right away, fearing that something would not work, or it may break their website.

Gutenberg was developed over a long period with enough time for theme and plugin developers to make their products Gutenberg compatible. All top WordPress plugins are already fully compatible with Gutenberg and most themes would work without a hiccup.

However, to avoid any conflicts you may want to test your site with Gutenberg and WordPress 5.0. This would allow you to find if any of your plugins or theme are incompatible. You can also catch unexpected errors and fix them before updating your live site.

That being said, now let’s go ahead and check how to test your website for updating to Gutenberg or WordPress 5.0 step-by-step.

Step 1: Create a Complete Backup of Your Website

You must always create a complete back of your WordPress website before any major update. Backups protect you against any unfortunate damage that can happen during the update process.

Keeping regular website backups is important even if you aren’t updating your site because they can save you in catastrophic situations like malware attack, hacking, etc.

There are plenty of WordPress backup plugins that you can choose from. We recommend using UpdraftPlus because it allows you to setup automatic backups and store them on a remote location.

Step 2: Test Your Site on Local Server or Staging Site

After you’ve created a complete backup of your website, you are now ready to test your website with WordPress 5.0 and the new Gutenberg editor.

There are two common methods to test new updates without actually affecting your live site.

  1. Test your website on a local server installed on your computer
  2. Test your website on a staging server

Both options allow you to test WordPress 5.0 with the new Gutenberg editor with your existing content, plugin, and themes.

1. Test Your Website on Local Server

Using a local server simply means installing your WordPress site on your personal computer with a software like WAMP or MAMP (for Mac).

In this method, you’ll first move a copy of your live WordPress site to local server using a migration plugin like Duplicator.

Duplicator WordPress plugin

Then on the local site, you can update to WordPress 5.0 and test out all your plugins / themes for compatibility with the new editor.

You can also make changes on the local site and upload it to your live site when you are done.

If you didn’t need to make any changes to the local site, and everything seemed ok, then you can go ahead and update your live site to WordPress 5.0.

2. Test Your Website on Staging Environment

A staging site is a separate development version of your website where you can try out new features.

It’s usually a sub-domain of your site that’s restricted from public access. It’s where you can test new updates, themes, plugins, or use it for all your development. Once you’ve tested everything necessary, you can then upload it to your live site.

Most top WordPress hosting companies offer 1-click staging site installation from your hosting account.

If your site is hosted with Bluehost, then you’ll find an option to create a staging site under the Bluehost menu in your WordPress admin dashboard.

Creating a staging site in Bluehost

You can also create 1-click staging sites on WPEngine and SiteGround. If you are not using any of these hosting companies, then you should ask your host because they may offer this feature.

If your hosting service doesn’t have staging site installation feature, then you can still do it manually on your own. Here’s our step by step tutorial on how to create a staging environment in WordPress.

Step 3: Install the Classic Editor Plugin

The most significant change in WordPress 5.0 is the new Gutenberg editor.

This means that if you were to run into any issues, then it’ll likely be caused by a plugin or theme’s incompatibility with the new editor.

It is also possible that you may not like the new editor.

Luckily, you can update to WordPress 5.0 and still keep the classic WordPress editor.

You can simply disable Gutenberg by installing the Classic Editor plugin on your WordPress site. Doing this will allow you to safely update to WordPress 5.0, while still keeping the classic editor that you’re familiar with.

Switching to the classic editor

Classic Editor is an official WordPress plugin from WordPress core contributors to allow you to switch back to the classic editor. With this plugin, you can hide the Gutenberg editor and create content the same way as before.

If you had to install Classic Editor because a theme or plugin wasn’t working after updating to WordPress 5.0, then you still have work to do.

You need to reach out to the theme or plugin developer and request them to make it compatible with the latest WordPress release.

If you don’t get a positive response, then you need to find an alternative theme or plugin to replace incompatible ones.

Step 4. Things to Do After Updating to Gutenberg in WordPress 5.0+

If you are just starting your first WordPress blog, then you are in luck. You’ll quickly get used to the awesome new block editor which is faster, modern, and incredibly powerful.

On the other hand, if you have been using WordPress for a while, then the new editor is an exciting new experience for you.

Most of us are used to working with the old editor and have setup our workflows around it.

Good news is that you can still do all the things you did in the old editor with Gutenberg, and then some more.

To help you learn new features, we have created a complete Gutenberg tutorial it shows how to use new block editor and create visually stunning content for your site.

We hope this article helped you to learn how to test your WordPress site for updating to Gutenberg or WordPress 5.0. For troubleshooting common errors you may encounter, check out our guide on most common WordPress errors and how to fix them.

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 Test Your Site for Updating to Gutenberg (WordPress 5.0) appeared first on WPBeginner.



Source link
By News , , , , Comments OffRead more...
03 Jan

How to Add Web Push Notification to Your WordPress Site


Do you want to add push notifications to your WordPress site? Push notifications allow you to send notifications to users even when they are not visiting your website.

In this article, we will show you how to easily add web push notifications to your WordPress site. We will also talk about the best WordPress push notification plugins and how to send desktop & mobile push notifications from your WordPress site.

Adding web push notifications to a WordPress site

What is Push Notification?

Push notifications are clickable messages displayed on top of user’s desktop or notification area on their mobile device. They can be shown even when the user’s browser is not open.

web push notifications shown on a desktop

Aside from desktop, web push notifications also work on mobile devices. This allows you to reach your users across devices with latest updates and offers. Web push notifications have proven to be a very effective way to convert website visitors into customers and loyal followers.

Why Add Web Push Notifications to Your WordPress Site?

We have already discussed that 70% of people who leave your website will never come back. This is why you need to convert those website users into subscribers or customers.

You can do this by utilizing multiple channels at once. This includes email marketing, social media, mobile or SMS marketing, and web push notifications.

While email lists are still the most dominant and effective marketing tool at your disposal, push notifications for us are proving to be quite effective.

Here is why:

  • Users need to give their explicit permission to receive push notifications. This means they are already interested in what you have to offer and are more likely to engage with notifications.
  • Push notifications are shorter and demand less attention than email or social media updates.
  • There is no algorithm, so nearly 100% of messages are delivered.
  • Users can control how their devices display notifications, they can snooze them, or turn them off entirely.
  • Not as many companies are using it.

Popular sites including Facebook, Pinterest, LinkedIn, and many others understand the importance and are already using web push notifications.

These notifications are more engaging than SMS, email marketing, and social media platforms. According to a survey, push notifications have a 50% higher open rate than email and twice as much click-rate.

Having said that, let’s take a look at how to add web push notifications to a WordPress site.

Setting up Web Push Notifications in WordPress with OneSignal

OneSignal is a free push notification service for WordPress websites. It allows you to easily add push notifications to any website.

First thing you need to do is install and activate the OneSignal plugin. Need help installing the plugin? See our step by step guide on how to install a WordPress plugin.

Upon activation, the plugin will add a new menu item labeled OneSignal to your WordPress admin bar. Clicking on it will take you to the plugin’s settings page.

OneSignal settings page

The settings page is divided into Setup and Configuration tabs. The setup tab is actually detailed documentation on how to setup OneSignal push notifications in WordPress. It has the same steps that we will show you in this tutorial.

To setup OneSignal, you will need to add API Key and APP ID into the plugin settings.

Let’s get started.

Step 1: Setting up OneSignal Push Notifcations

First, you need to visit the OneSignal website and click on the get started button next to the Web Push option.

OneSignal get started

You’ll be asked to provide your email and password to create a free account. After your account is created, you’ll reach the OneSignal dashboard.

Add OneSignal app

On the dashboard, click on the ‘Add App’ button to create your first app.

You’ll be asked to provide a name for your app. You can use anything here that helps you identify it.

Enter a name for your app

Next, you’ll need to select a platform. You can select multiple platforms for an app. For now, we recommend selecting ‘Web Push’ and click on the next button to continue.

Choose app platform

In the next step, you’ll be asked to select an integration method. Go ahead and click on ‘WordPress Plugin or Website Builder’ box and then select WordPress.

Select integration method

When you scroll down a bit, you will see a ‘WordPress Site Setup’ section.

You need to enter your website name, URL, and upload a logo. This logo would appear in your notifications, so we recommend using your site icon (favicon) or website logo.

WordPress site setup

Below that, you will see a toggle that you can turn on if your WordPress site is not using SSL/HTTPS. You can only send web push notifications from a secure HTTPS URL. If your WordPress site is not using HTTPS, then you need to turn this setting on and enter a label.

A label is basically a subdomain hosted on OneSignal servers using a secure HTTPS URL. This subdomain will be used to send your push notifications.

If you want to setup HTTPS on your own WordPress site, then see our step by step tutorial on how to move WordPress from HTTP to HTTPS. We highly recommend using your own domain with SSL than a subdomain on OneSignal, so you’re not forever locked in to their platform.

Once you are done, click on the save button to store your OneSignal settings. You’ll now see the API keys that you need to copy.

Copy the API keys

Now, you can switch back to OneSignal plugin settings on your WordPress site and switch to the ‘Configuration’ tab. You need to paste the APP and API keys you copied earlier.

Paste API Keys

These API keys will only allow you to send push notifications via Chrome and Firefox web browsers.

You will also need Safari Web ID in order to send Push notifications via Safari web browser.

To get the Safari API key, you need to switch back to OneSignal website and go to the settings page for your app. Once there, you need to click on the edit icon next to Apple Safari.

Push notification setup for Safari

Next, you’ll be asked to enter your website title, URL, and optionally upload a site icon.

Safari settings for push notification

Click on the Save button to store your settings. After that, you’ll see your Safari Web ID on the screen which you need to copy.

Safari Web ID

Once again, switch back to the plugin’s settings page on your WordPress site and paste the Safari Web ID under the configuration tab.

Save OneSignal plugin settings

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

You can now visit your website in a new incognito browser tab. You will see a push notification popup on the top and a bell notification icon at the bottom right corner of the screen.

Push notification optin

The push notification popup will also appear on mobile browsers.

Push notification optin on mobile browser

Note: The appearance of push notification popup prompt may differ based on http/https settings of your site.

Now, you may be wondering why this push notification prompt looks different than what you see on some other websites?

Normally users see the browser default notification prompt, which looks something like this:

Default browser prompt for push notification

Now the problem is that, if a user clicked on ‘Block’ button, then they will never see a prompt for subscribing to notifications. To fix this, OneSignal comes with two different prompt types.

The first one is the push notification popup and the other one is the subscription bell icon. Both of them are fully customizable, and you can change them to meet your needs.

Step 2. Customizing The Push Notification Popup Prompt

The basic push notification popup is quite simple. It uses generic language and displays your site’s logo. You may want to customize that to make it more personal.

Simply switch to the configuration tab under OneSignal plugin’s settings page on your WordPress site and scroll down to the ‘HTTP Pop-Up Settings’ section.

Customize push notification popup

You need to click on the toggle next to ‘Customize the HTTP Pop-Up Prompt text’, and then start adding your own text.

Don’t forget to click on the Save button to store your settings before testing the prompt.

Step 3. Customize the Bell Notification Icon

Normally, the browser prompt for notification and the popup disappear when a user dismisses them.

What if users later change their mind and want to receive push notifications?

The subscription bell in OneSignal allows you to keep showing users a prompt to subscribe push notifications on your site.

The bell icon is also fully customizable from the plugin’s settings page. Simply scroll down to ‘Prompt Settings & Subscription Bell’ section and turn on the customization options that you want to change.

Subscription bell settings

You can then scroll down and change settings for each option you want to customize. Ideally, you would want to change bell icon colors to match your own theme colors.

Bell icon customization

Note: We don’t use the bell icon because we feel it’s a bit too intrusive.

Step 4. Sending Push Notifications from Your WordPress Site

By default, the OneSignal plugin automatically sends push notifications for all new posts published on your website. If you want, then you can turn this feature off from plugin’s settings page under ‘Automatic Notification Settings’ section.

Automatic notification settings

You can also manually send a notification when you publish or update a post. Simply edit a WordPress post or page, and you will see the OneSignal meta box under document settings column on the right.

OneSignal notification box in Gutenberg

If you are using the old classic editor, then you will see the meta box like this:

Send push notification box in classic editor

Check the box next to ‘Send notification on post update / publish’ and then click on update or publish button.

OneSignal will now send your article as a push notification to all your subscribers.

Send a welcome push notification to new subscribers

You can also send a welcome push notification to your new subscribers. Visit OneSignal’s settings page in your WordPress admin area and scroll down to the ‘Welcome Notification Settings’ section.

Welcome notification

Now when a new subscribes for push notifications, they will receive a welcome notification on their device. Depending on their browser and device the notification may look different.

Welcome notification displayed on Mac via Firefox

That’s all, you have successfully added web push notifications to your WordPress site.

You can also send custom notifications from the OneSignal app dashboard. The process is quite intuitive and you can follow onscreen instructions once you login to OneSignal.

Other Good WordPress Push Notification Plugins

It is important to choose the right web push notification service from the start. Since most providers try to lock you in their platform, changing your push notification service can result in losing your old subscribers. Meaning if you switch, then you will be starting from scratch.

This is why we recommend asking the provider you choose for all settings you need to configure to make your subscriber list portable.

At WPBeginner, we use OneSignal because it has the features that we need at a reasonable price.

  • OneSignal offers a free WordPress push notification plugin with unlimited mobile push and web push notifications for upto 30K subscribers.
  • Even their free plan includes features like segmentation, localization, tracking with Google analytics, and a robust API.
  • You can use it with all top email marketing services to send your newsletter emails via web push notifications

WordPress is all about choices. Here are some other WordPress push notification plugins that you can also try.

  • PushEngage Web Push Notifications – This is the connector plugin for PushEngage, a push notifications service provider. They have a free plan limited to 2500 subscribers, 120 notifications, and 5000 clicks.
  • PushAlert – Web Push Notifications – Helps you connect to PushAlert web push notification service. They also offer a free plan limited to 3000 subscribers.
  • PushCrew – Connects your website to PushCrew’s push notification service. They offer a free plan limited to 2000 subscribers.
  • PushAssist – Connector plugin for PushAssist web push notification service. Their free plan is limited to 2000 subscribers.

We hope this article helped you learn how to add web push notifications to your WordPress site. You may also want to see our guide on how to get a free business email address for your website.

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 Web Push Notification to Your WordPress Site appeared first on WPBeginner.



Source link
By News , , , , , Comments OffRead more...
22 Dec

7 Ways to Spread the Holiday Spirits with Your WordPress Site


Are you looking for ways to promote the true spirit of holidays on your WordPress website? It is the best time to share the joys of the season with your users while promoting your business. Since many of our readers asked for recommendations on the top WordPress holiday plugins and themes, we have highlighted the best ways to spread the holiday spirits with your WordPress site.

Spread the holiday spirit with your WordPress site

How to Spread the Holiday Spirits with WordPress?

The best way to celebrate the holiday season is to include your users into your happiness. You can offer them discounts on your products and services. You can also add holiday decorations like snowfall effects, Christmas bells, lights, and more on your WordPress website.

There are many third-party WordPress plugins and themes for holiday season. You can use them on your website to make it look more festive.

Another way to spread the holiday spirits is by sending gifts to your users through a lucky draw. You should check out our guide on amazing holiday gift ideas and share the happiness with your customers.

That being said, let’s take a look at the best ways to spread the holiday spirits with your WordPress site.

1. OptinMonster

OptinMonster

OptinMonster is the best lead generation and optin form plugin for WordPress sites. It has a powerful exit-intent ® technology that helps in converting your abandoning visitors into subscribers and customers.

OptinMonster comes with a holiday campaign theme that you can use with their lightbox popup, sidebar, floating bar, fullscreen optin, and other campaign types. You can also create a countdown popup to boost your holiday sales.

Optin holiday template

The countdown timer creates a sense of urgency that helps you get more sales during the holiday season.

You can use OptinMonster to also show a seasonal greeting and any other promotion that you may want.

2. Snow Storm

Snow Storm

Snow Storm is a popular WordPress plugin for holiday celebrations. It allows you to show falling snowflakes on your website. The plugin allows you to change the color of the snow, manage the amount of snow, animation interval, melt effects, and more. The plugin will add a beautiful snowy effect to your WordPress site.

3. Christmas Ball on Branch

Christmas ball on branch

Christmas Ball on Branch is a simple and free plugin that lets you add a Christmas ball on a branch to your site. There are no settings for the plugin. You can simply install and activate it. It’ll display the branch and the ball on the top right corner of your site. It’s particularly useful if you don’t want your on-site holiday decorations to take over the content.

4. Christmas Countdown Widget

Christmas countdown widget

Christmas Countdown Widget is a free WordPress plugin that adds a countdown timer to your sidebar and other widget-ready areas. It comes with a stunning Santa Claus that shows countdown timer until Christmas. On the day of Christmas, Santa will greet your users with “Merry Christmas”.

It has a transparent background which means you can use it on any WordPress themes. You can also use the shortcode to display Santa Claus with countdown timer on your posts and pages.

5. Xmas Lights

Xmas Lights

Xmas Lights is another free WordPress plugin for holidays. It displays Christmas lights on the top of your homepage. You can install the plugin and it will automatically show the christmas lights on your WordPress site without any configuration.

6. Christmas Music

Christmas music

Christmas Music is a WordPress plugin for holiday music. You can use this plugin to add Christmas music (Jingle Bells) on your entire website or specific posts and pages. It shows a play/pause button on the bottom right corner for users to enable or disable the music.

7. WordPress Themes for Holidays

We don’t usually recommend our users to change their WordPress theme for a specific event or holiday season. However, if you have a personal website and really want to change your theme to a holiday theme, then you should check out our handpicked list of the best WordPress themes for holidays.

Christmas Bell

Christmas bell

Christmas Bell is a free and multipurpose WordPress theme. It can be used to add the looks and feels of a festival, holiday, or specifically Christmas decorations on your website. It features a custom logo, featured content slider, header media options, and more. The theme beautifully adds a festive feel to your WordPress website.

Snowflakes

Snowflakes

Snowflakes is a free WordPress holidays theme with photos. It comes with bright colors and a cheerful festive look. Snowflakes has multiple color options, navigation menus, image galleries, and more. You can use this theme to transform your site for the holidays.

We hope this article helped you find the best ways to spread the holiday spirits with your WordPress site. You may also want to see our expert tips on growing your business online on a small budget.

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 7 Ways to Spread the Holiday Spirits with Your WordPress Site appeared first on WPBeginner.



Source link
By News , , , , , Comments OffRead more...