Trending February 2024 # How To Create Comparison Table In WordPress? – Webnots # Suggested March 2024 # Top 3 Popular

You are reading the article How To Create Comparison Table In WordPress? – Webnots updated in February 2024 on the website We hope that the information we have shared is helpful to you. If you find the content interesting and meaningful, please share it with your friends and continue to follow and support us for the latest updates. Suggested March 2024 How To Create Comparison Table In WordPress? – Webnots

People say WordPress powers more than 30% of websites on the internet. However, it is not an easy job to create a website with all the features you need. Creating tables in WordPress is one simple example for that. WordPress introduced a table block with the Gutenberg and updates that continuously. However, it is not responsive and will not work properly in mobile devices when you have three or more columns. Though plugins like TablePress resolve this issue with the free plugin, it is still not convenient to create comparison table that needs review stars. In this article, we will explain how to create comparison table in WordPress. 

What is a Comparison Table?

Many WordPress bloggers write reviews and recommend products that they use to their readers. This helps in both the ways that readers get reliable information while bloggers get affiliate commission when a reader buys that product. In many cases, the comparison table is most helpful to showcase the information.

Showcasing a list of top 10 products in a table – for example top 10 hosting companies.

Compare specifications of two products – for example iPhone and Samsung Galaxy.

How to Create Comparison Table in WordPress?

After searching a lot, we have found a decent plugin that helps to create comparison table in WordPress.

WP Table Builder

Creating Tables with Drag and Drop Table Builder

After activating the plugin, it will create a menu “Table Builder” on the sidebar navigation. Go to the plugin’s drag and drop table builder interface within you WordPress dashboard.

WP Table Builder Drag and Drop Editor

Enter the name table

Customize Table Settings

On the next screen, you can view the live preview of the table. Scroll down on the left sidebar to find the “Table Settings”. You can setup the following options for your table:

Table Settings

Enable the option saying “Make Table Responsive” to make your tables responsive on mobile devices.

Add top row as header and setup a color for your header row.

Change the outer and inner border sizes and colors.

Add colors for odd and even rows on your table.

Setup cell padding and table width.

If you are not familiar with tables, learn here on how to create HTML tables.

Adding Content to Table

After setting up the base for you table, you can drag and drop elements inside the cells and start building your table online. The plugin allows you to add text, image, list, star rating, custom HTML, shortcode and button in the cells. You can customize each element after dragging into the cell.

For example, you can add image element and add links, align, add alt text and adjust the size. Below is how the comparison table will look in the table builder.

Comparison Table in Table Builder

After finishing the table content, you can preview and save the table.

Getting Shortcode for Comparison Table

When you are in the table.

Get Embed Shortcode

You can also view all shortcodes for each table.

Inserting Tables in Posts and Pages

Now that you have the shortcode for your comparison table, you can insert anywhere on the site.

Simply paste the shortcode inside the “Paragraph” or “Shortcode” block of Gutenberg editor.

You can also insert the table on your footer or sidebar using text widget. Drag and drop the “Text” widget on your sidebar or footer area and paste the table shortcode. Save your changes and the table will start showing on the corresponding widget area on the published site.

The published table on the desktop site will look something like below:

Sample Comparison Table

And the responsive mobile view will look like below:

Comparison Table on Mobile

Pros and Cons of WP Table Builder Plugin

The plugin has advantages as well as few limitations.


The plugin is a beautiful tool for creating upselling on the admin section.

Simple, drag and drop interface with customizable options.

Shortcodes to insert the table anywhere on your site.


After choosing columns and rows there is no way to change that. If you want to delete a column or row then you need to create from the scratch.

No possibility to rearrange the rows and columns.

We hope the future updates can include these options.

You're reading How To Create Comparison Table In WordPress? – Webnots

How To Use Content Locking In WordPress? – Webnots

Content locking is a way for site owners to limit the amount of content users may see or access. When content is locked, users won’t be able to access it until they do a specified activity. This activity could range from subscribing to an email newsletter to purchasing premium material. Not every website owner wants to give away all of their stuff for free. Locking material away is one of the many methods to make money from a  website, and that is why some site owners require users to take a specific action to access certain pages, articles, or portions of the website. This post will specifically look at how to use content locking in WordPress using free plugins.

Purpose of Content Locking

You may increase social shares and email signups by adding a content locker to your website.

Content locking can also significantly enhance social engagement, which will help your site attract more visitors and rank higher in search results.

By restricting who has access to your content, only those genuinely interested in your products and services will go the extra mile of trying to unlock your content. That enables you to select what offers to send customers based on the content they choose to unlock and because you’ll be sending out more appropriate marketing messages.

Note: Even though you have complete control over the content you hide, keep in mind that it should have a high value so that visitors are eager to unlock it. Consider incorporating your most recent postings, especially your most instructive or amusing pieces, as well as outstanding photographs or high-definition videos.

Examples of Content Locking

Before we explain how to use content locking in WordPress, let us showcase some live examples that you can see on the web. Though these websites may not use WordPress, these examples can give you an idea of how to use content locking in your site.

Quora is one of the most popular Q&A sites on the web that allows you to read the first view for free. For further exploring the site, and you need to register for an account.

Content Locking in Quora

Second example is from The New York Times newspaper site. similar to Quora, you can read one article free and need a registration or subscription for further access.

NY Times Content Locking

Last example is from Business Insider that locks the content when detecting an ad blocker in browser. You need to disable the ad blocker or subscribe to read the content.

Content Locker WordPress Plugins

WordPress content locker plugins can boost your social sharing, traffic, and conversion, all of which can help your mission to have a successful online presence. Content locker plugins enable you to lock blog posts, articles, reports, webinars, downloadable tools, and other types of material. We will look at two different WordPress content locker plugins, their capabilities, and whether or not they’re suitable for your website. These plugins include:

1. Locking Content with Subscribe to Unlock Opt-In Content Locker Lite Plugin

Form Settings

Scroll down and set how the subscriber’s username and email will appear in the form settings for them to fill out.

Select the “Terms and Agreements” tab, check the box, and type the text that will appear on the form.

Create the button text you like. Similarly, go to the footer area, check it, and type the footer text you want.

Email Settings

Now that you have finished the setup, return to the “General Settings” and copy the shortcode. Insert the copied shortcode in the post where you want to lock the content. You have to paste the shortcode just above the part of the content you want to hide. Publish the post and check how the content locking looks on the browser.

Note that in the premium version of the plugin, you can lock the content directly from posts or pages. In this case, a lock icon on top of your pages/posts will enable you to do that.

2. Locking Content Using WP Private Content Plus Plugin

WP Private Content Plus is a WordPress plugin that makes it easy to keep your crucial WordPress site content safe from visitors, members, specified user roles, or a group of users. This plugin supports content limitations on posts, pages, custom post types, navigation menus, widgets, and post attachments. Similar to the previous plugin we have explained, you can use shortcode and conceal certain content of posts and pages. It also gives each site user their own private portal page and enables the administrator to add user-specific material to this client section. The material in this private portal will only be visible to the owner.

WP Private Content Plus also lets you show various menu items to different users depending on their login status and roles. Since many features are limited to premium version, we will explain here about few content locking features that free users can use. To use this plugin to lock your content.

Enabling Content Locking Locking Content Globally for User Roles

Apply Global Restrictions

Select the user role from the “Visibility” dropdown to allow that user role to view the content. All other user roles will be restricted from viewing your posts. For example, you can select the “Visibility” for “Selected User Roles” and choose “Editor” option.

Apply Global Restrictions for User Roles

Only editors in your site can view all the post content and all other users will see a small message saying, “You don’t have permission to view the content”.

Posts Restricted

Similarly, you can enable global restrictions for pages under “Page Settings” tab.

Locking Specific Post Content for User Roles

If you want to lock only specific post or page content, first disable any global restrictions that you have applied. Edit the post or page and scroll down to see the meta box that says, “WP Private Content Plus – Restriction Settings”. You can set the visibility and allowed user roles here which will be applied to that specific post.

Individual Post Restriction Settings

The plugin will show a similar message like above when someone try to view the restricted post. In addition, you can setup a setup redirection so that restricted users will be redirected to another page. It is also possible to upload files that can be accessed only by the restricted user roles.

Note that the restricted posts will show the same “You don’t have permission to view the content” message in all archive pages like category, tags and author archives.

Creating Private Pages for Users

The next notable feature of the plugin is that it allows you to create a custom page for each user and personalized content. Note that you can only create a single custom page for user with the free version and need to buy the premium version to assign multiple posts to users. As a first step, you need to create a new page like any other pages on your site.

Select User

The plugin will load an editor for you to add the user’s designated private content material.

When done typing the private content for the user selected, scroll down and save.

Setup Custom Content

You will receive a notification stating that your private content has been successfully updated.

When the person you’ve chosen signs in, they’ll have access to the content you’ve designated for them. In our case, When John Doe logs in, he will see the content that has been locked for him. The image below illustrates that.

Content Locking Result

If the user “precious” visits this site’s page, there will be not content visible because we have assigned the content only for “John Doe”. Good part of this approach is that you can use single “Private User Page” section to create a page for multiple users without navigating to different places. However, you need pro version for assigning additional posts or pages to users.


To sum up, we can say that content lockers can come quite in handy in assisting your site in achieving its conversion goals. Choose a plugin that offers a solution and meets your site’s requirements. Make sure to lock content that your visitors will respond to and want to open. Most importantly, keep an eye on your analytics to evaluate how effective your content locker works for you.

How To Fix Demo Import Problems In WordPress? – Webnots

Almost every commercial theme out there offers predefined templates. Many users purchase a theme mainly looking at the beautiful demo templates. However, you may face different types of problems when importing demo on your live WordPress installation. In this article, we will explain various demo import problems in WordPress along with possible fixes.

Astra Demo Templates

Types of Demo Imports in WordPress

Unfortunately, commercial WordPress themes offer varieties of ways to upload demo content. Here are some of the options that popular themes offer:

Demo import along with bundled plugins. You can install the plugins and import demo content from admin panel. Popular themes like Newspaper follows this approach that needs you to install required plugins before start using the theme.

Install Required Plugins

Importing from Site Library or Starter Templates along with demo content. Though this looks similar to the above method, here the required plugins will change based on the demo site you want to import. GeneratePress, Astra and many other popular themes use this method. You will see the list of plugins required for importing the demo and the plugins will be installed automatically along with the demo. You will also have an option to ignore the plugins and only use demo site’s settings.

Import Demo Site in GeneratePress Theme

XML file for importing demo content and text file for importing settings. For example, Highend the most popular theme in MOJO marketplace offers demo data with theme purchase as XML and text files.

Note that as far as we have checked, Envato marketplace (parent company of themeforest) has a policy of not supplying images shown in the demo content. Therefore, authors generally use placeholder images in the downloaded files. Alternatively, you may need to download content directly from developer’s site as with Newspaper theme.

Demo Import Problems in WordPress

The problem you face with demo import in WordPress highly depends on the way you upload demo content. If one option is not working for you, it is possible to try with other option to import the content.

1. Check Required Plugins for Demo Content

First thing you need to check before purchasing a commercial theme is the number bundled plugins needed for using the theme. In some cases, like Newspaper theme, the demo sites will show only after you install the required plugins. However, many themes will not show any warnings and allow you to import demo content. Your import will fail saying due to missing plugins. This is the case for the themes built based on page builder plugins.

Therefore, make sure to install and activate the required plugins before you try to import demo content.

2. Try XML Import

If normal importing of demo content fails due to hosting restriction, you can try alternate option to upload XML files. However, you need to ask your developer to provide the XML import files.

Download Demo with Attachments

It may take some time depending upon the demo content size. After finishing the import, you should see a success message “All done have Fun!”.

3. Import Only Demo Settings without Content

Whether you import content from developer’s site or use XML file, importing all attachments and media files needs lot of time. This could easily lead to time out error and your import will fail.

When importing the content, check whether you have an option to only import theme options or settings. Some commercial themes also supply theme options as a text file that you can import from the theme’s settings panel.

Import Only Theme Options

If you are using XML file import, try unchecking “Download and import file attachments” option to only download the content without attachments.

Since, demo import will create menu and import settings, try deleting all your existing menus and retry the demo import to check if that works.

4. Change Hosting Parameters

PHP errors are one of the major demo import problems in WordPress many users encounter. Many themes need long PHP run time to import demo content. However, hosting companies may terminate the PHP scripts when running beyond the acceptable time thus terminating your demo import in-between. Similarly, you may see other problems when running out of memory or exceeding upload file size. In these cases, you should see a relevant PHP warning or error message. This type of problem happens especially when you are using cheap shared hosting companies for your website.

When you see PHP errors, we recommend you to first check with the theme developer on the requirements for importing demo content. Below is an example of requirements for Newspaper theme.

Theme Requirements

After getting these details, confirm with your hosting company whether they support these requirements. In fact, you should do this at first before purchasing a theme. If your hosting company allows to change the parameters, you can add the following parameters in your chúng tôi file:

max_execution_time = 300 max_input_vars = 3000 memory_limit = 256M post_max_size = 32M upload_max_filesize = 32M

Most of the shared hosting company may not allow you to access chúng tôi file. In such a case, you can use .htaccess directives to change the parameters.

php_value max_execution_time 300 php_value max_input_vars 3000 php_value memory_limit 256M php_value post_max_size 32M php_value upload_max_filesize 32M

If you see a memory exhausted problem, you can increase the memory size in chúng tôi file by adding the below line:

define('WP_MEMORY_LIMIT', '256M');

These are some of the common parameters that affects the demo content import. Make sure to understand the error and only add the required parameters. Also, adjust the values as per your need and within the allowed limit for your hosting plan. Similarly, most WordPress themes will work only with the latest PHP version. You may need to switch the PHP version in order to use the theme. Here, you have to test the site thoroughly to make sure all plugins work without problem.

5. Get Support from Hosting and Theme Developer

If none of the above fixes resolve your problem, the only option left is to contact your theme developer. Get the complete requirement details for installing demo content and updating theme panel settings. In most cases, you may need to get help from your hosting company to adjust the parameters if you are not allowed to do as explained above.

In addition, when downloading demo content from developer’s site, you need to have “allow_url_fopen” enabled on your server. This will allow your server to get the demo files from third-party sites like your developer’s site. You can enable this parameter using chúng tôi file or using PHP manager app from hosting panel. However, you to confirm whether your hosting company will support especially on shared server.

Final Words

We strongly recommend you checking the installation and demo import requirements from the theme developer before you purchase. It helps you to understand whether your hosting company supports the theme and get help on PHP related issues. Other demo import problems in WordPress are easy to fix with XML import or by only importing settings. It is also a good idea to only use the settings instead of importing everything, as you have to anyway delete the dummy content later.

How To Improve Internal Linking In WordPress Site? – Webnots

Publishing unique and useful content is one of the most important factors in running a website. However, search engine optimization is equally important to get visitors from organic search. Otherwise, your beautiful content is of no use without any readers. Earlier days, SEO was all about getting backlinks from high quality websites. Things are changed now and you need to make your site’s internal linking structure in order to improve the visibility. In this article, we will explain how to improve your internal linking using different methods in WordPress site. Check out the complete WordPress SEO guide for beginners to optimize your site.

Where Can I See Internal Linking Details?

Before reading further, it is important to understand the current internal linking details of your site. For this you have to add and verify your site in Google Search Console. The new interface still contains the legacy sections that shows internal linking details of the verified site. this will help you to understand the most linked pages on your site. You can take this as a reference and optimize the site structure.

Internal Link Details in Google Search Console

1. Header and Footer Menu

Header or primary navigation menu helps you to link high level and important pages on your site. Traditionally header menu includes pages like home, blog, about us and contact us. Since these pages are most frequently accessed pages, it makes sense to link them on the header section visible throughout the site. For example, users need to look for the contact page on your site whenever they wanted to contact you.

Supported Menu Locations in Theme

2. Sidebar and Footer Widget

Similar to header and footer, sidebar widgets play important role in building internal linking structure for your site. Generally, you can link recent, popular, category and collection articles in the sidebar. This will help you to promote and drive traffic to those pages. WordPress be default offers a “Navigation Menu” widget that you can insert on sidebar and footer.

Give a title for your widget and select the menu name you have created.

Save the widget to show navigation menu items on your site.

Navigation Menu in Sidebar

SEO Offer: Optimize your site with Semrush Pro special 14 days free trial.

3. Use Categories and Tags

Breadcrumb in Google Search Results

Similar to categories, you can assign tags to structure your site. Though tags do not appear in breadcrumb, both tags and categories will create archive pages. These archive pages can also drive traffic from Google and other feed readers.

4. Find Articles with No Internal Links

When creating new site, you may not have sufficient articles to link each other. Over the period most of your old articles will left over without linking to any other articles on your site. Find all old articles that contain no links and try to update with relevant links. This will boost the internal linking structure and help to regain the ranking of those old pages.

5. Find Articles Not Linked to Other Pages

You have to combine this step with the previous step. Some articles on your site may have links to other pages but not having any inbound links from other pages. These pages without any inbound internal links are dead pages though you have sitewide header, footer and sidebar links. You can find pages with no inbound internal links and link them on pages that contain no links (identified in step 2).

6. Table of Content

Internal linking is not always between two different articles. You also can link between sections of the same article. You can easily do this by adding custom CSS ids to headings and show all headings as a table of content. Google will show the sectional links in search results so that users can directly jump into that section instead of reading the entire article.

Remember, Google also uses passage indexing to show a section of the page in the search results. Having table of content with sectional links will help to improve your search engine visibility with passage indexing.   

7. Related Articles 8. Internal Linking for Pages

Unlike blog posts, WordPress allows pages to have parent and child relationship. This will be very useful for niche websites to show links in a structured manner. For example, you may have a parent page for “dogs” and child pages for “dog training”, “dog care” and “dog food”. You can make use of this parent-child setup in two ways:

Link all sub-pages on the parent page so that users can easily navigate to the required section easily.

Link all sub-pages in each of the sub-page. For example, “dog training” page should contain links to “dog care” and “dog food” pages.

Tools and Plugins for Internal Linking

Creating header, footer and navigation menu is an easy task and you do not need any additional plugins for this purpose. However, finding pages that contain no links or have no inbound links is a difficult task. Similarly, it is not a practical task to create table of content or related post for each article on your site manually. Here comes the use of handy plugins that you can use to understand internal linking structure and automate some of the tasks.

Yoast SEO Free and Premium

Number of Internal Links with Yoast

In addition, you can also insert breadcrumb using Yoast SEO free version. The best part is that you can choose the primary category to show in breadcrumb when you assign multiple categories to a post. The premium version of Yoast SEO offers additional features to further optimize internal linking structure of your site.

Find orphaned articles that have zero inbound internal links. As mentioned, you can link these orphaned articles inside the article with no internal links.

Insert table of content block – though this is manual it helps.

Internal linking suggestion – shows five relevant links so that you can insert them manually or insert it as a related article widget.

Sub-pages and sibling block to insert page structure.

Gutenberg or Table of Content

You can use the hyperlink tool in WordPress to manually search and link pages from your site. This will be helpful when you know all post articles with relevant keywords and title. Though manual, this is the widely used method to insert internal links in WordPress. If you have noticed, Gutenberg editor also allows you to insert HTML anchor to heading. You can use these anchors and create sectional links to have a structure within an article.

Using HTML Anchor in Gutenberg

However, using Gutenberg will be a tedious task to insert all sectional links in a beautiful layout. The easy option is to insert table of content  is using a dedicated plugin. You can learn more about inserting table of content in our earlier article to automate this task.

Related Posts Plugins

Google AdSense Matched Content Ads

There is also an inline related posts plugin available for WordPress that automatically inserts links inside the article.

Automatic Internal Linking

There are plugins like Internal Links Manager to automatically create internal links. You can create keyword and assign links so that the plugin will automatically insert the links. This may work well for smaller sites with limited number of posts or pages. However, for larger sites, this is a dumb idea unless you use those keywords properly on your site. Practically, it is a difficult task to use specific keywords uniformly on entire site.

For example, we have 400 articles on WordPress tutorials and use some phrase in different or similar context. For example, we use the key phrase “Optimize WordPress” for different types of optimization. Automatically inserting a link for all appearances of this key phrase will not help at all. Therefore, make sure to understand before you try to use this type of plugins. Alternate and working option is to use premium plugins like Yoast SEO which offer internal related links block.

WordPress and Internal Links Problems

You also need to careful when using certain internal links in WordPress. We recommend setting noindex or use canonical URL so that it will not affect your ranking.

Internal search pages – WordPress offers a search box using which users can search content on your site. However, you can find these search pages in Google Search Console when Google tries to index them. Make sure to noindex these pages which do not add any value to users.

Feeds and tags – WordPress creates automatic feed for each tag and category. If not required, you can disable these feeds to avoid them indexed by Google. Though tags can help in driving traffic, you can noindex tag archives to avoid users landing on archive pages from search results.

Author and date archives – if you are running a single author blog, author archive and date archive pages will be same as your blog index page. In this case, you can completely disable them of noindex them to avoid duplicate content.

You can check these options are available in your SEO plugin and enable to make use of the features.

Final Words

As you can see building healthy internal linking structure has multiple steps. You have to include this as one of your routine maintenance tasks to update the content with relevant links. This will allow search engines to crawl all linked pages and index them properly. As a result, you can get good results in search result pages and get traffic to your website.  

How To Add Or Remove Background In WordPress Gutenberg Blocks? – Webnots

Unlike the old Classic Editor, Gutenberg block editor offers various features to customize your content. One of the cool things is that you can easily add background to any block in Gutenberg editor. You can do this without any additional plugin and showcase important portion standing our from other area on the page.

Adding Background to Blocks

There are two possibilities of adding a background to a block:

Adding a solid color background

Using gradient colors as background

Using a background image

We will explain both options in this article.

1. Adding Background Color to Blocks

Let us say, you want to add background color to a paragraph in Gutenberg.

First insert your text using a paragraph block.

Show More Block Setting in Gutenberg Editor

Add Default Background Color to Blocks

Choose Custom Background Color for Block

Change Color Format

You can also copy flat UI or other color codes from other site and simply paste the code in the text box to apply the background.

Applying Gradient Colors as Background

Add Additional Gradient Color

Changing Text Color

When you select background color, it is also necessary to change the text color appropriately for clear visibility. If background and text colors are not matching, then WordPress will show you a warning on the sidebar mentioning the color combination may be hard for the people to read.

Set Proper Text Color Matching Background Color

Grouping Blocks and Add Background to Non-Supported Blocks

If you notice, Gutenberg will support adding background to few blocks like paragraph, list and columns. What about if you want to add a background color to an image? You can add background to any block by using “Group Blocks” option. You can use this for single block (like image) or combine multiple blocks (like image + paragraph). Let us combine a paragraph and an image and add background colors to them.

First insert the blocks one below other.

Press shift key and select both the blocks that you want to group.

Group Blocks in Gutenberg

Now, you will see the selected blocks are grouped together and the sidebar shows “Color” section. Now, you can change the text and background colors as explained above.

Add Background to Grouped Blocks

Remember, you can simply ungroup the blocks to remove the text/background colors and reset the block to their initial state.

Ungroup to Remove Background

Removing Background from Blocks

Select “Text” to remove the text color.

Remove Text or Background Color in Gutenberg

After removing the text or background color, the option will show with a tick mark instead of minus sign. You can use the undo icon showing on top toolbar to revert the changes back.

Background and Text Color Removed

Using Image Background for Gutenberg Blocks

You can set background image for certain blocks like Cover block in Gutenberg. However, there are no options available to setup image background for most other blocks like paragraph. You need to follow a lengthy process for this.

Select the block and expand the “Advanced” section on the sidebar.

Add a custom CSS class in the text box below “Additional CSS Class(es)” heading. Let us add a CSS class with a name as bgimg.

Add Custom CSS Class for Block

Copy Image URL to Clipboard

Paste the image URL in Notepad or TextEdit.

Copy the below CSS and replace the “image_url_ with your image URL.

.bgimg{ background-image: url("image_url"); padding: 25px; }

Paste Background Image CSS

The paragraph block should have a background image added to it.

Background Applied to Block

You may need to adjust the text color in Gutenberg editor or add “color:color_code” property to your CSS code to adjust the text visibility on the background image. Similarly, you can adjust the padding and margin to align the paragraph content properly on the image background. You can check the image background tutorial on W3 Schools to learn more on that.

Final Words

You can add background colors or image to blocks to create attractive call to actions and notifications inside the content without any additional plugins. You can also make the block as a reusable block and insert anywhere you want on the site.

How To Move Live WordPress Site To Localhost? – Webnots

There are applications like MAMP and WAMP used to create a local server environment. This helps to install packages like WordPress so that developers and site owners can build their site in local PC or Mac. Once the local site is ready, it can be easily moved to the live server. But over the period of time your live site may have lot of deviations compared to the localhost site.

At this point you may want to sync the live site’s content to local site so that you can test plugins / themes/ WordPress version updates on a local site before updating on a live site. Though there are plugins which can speedup the backup process, in this article we explain how to manually move live WordPress site to localhost environment. If you are looking for setting up local WordPress site then read our separate article on how to install WordPress on your Mac using MAMP.

Summary: Move Live WordPress Site to Localhost

Before we go to the detailed process here is a summary of the entire process for moving your live site to localhost environment:

Use FTP client and download all your live WordPress site files, generally available under “/public_html” folder.

Login to your hosting account and export live site’s database from phpMyAdmin section.

Login to phpMyAdmin of your localhost using the application you used to install WordPress locally and create a new database.

Import live database file downloaded in step 2 to localhost server.

Run query to replace all occurrences of live site’s URL with the localhost URL.

Replace localhost site’s files with the live site’s files from step 1.

Edit “wp-config.php” file and change the database name to new database name as created in step 3.

View localhost site and login to localhost WordPress admin dashboard to see all live site’s content is available.

Learn WordPress: Check out 500+ free WordPress tutorials.

Step 1 – Download Live WordPress Site Files

Launch FTP client like FileZilla, connect to your hosting server and download all WordPress files of a live site to local computer. Generally files will be available under “/public_html” folder unless you changed it to another directory during WordPress installation. The entire download may take a while based on the size of your site. Hence we recommend to do this step first so that you can do further steps in parallel.

Download WordPress Site Files Using FTP

If you are looking for FileZilla tutorials, read our article on how to configure FileZilla, setting up FTP account in Bluehost and connect FileZilla to Bluehost FTP server account.

Step 2 – Exporting Live WordPress Site’s Database

Exporting MySQL Database in WordPress

Choose “Custom – display all possible options” as “Export Method”.

Select all database tables (you can ignore the tables which you don’t want to export by deselecting them).

Select output compression as “zipped” or “gzipped”.

Choose format as “SQL”.

Note: We recommend export the database by ignoring security and caching plugin tables. These plugins may cause problems while uploading it in the local environment. In most cases, these types of plugins are not required in local environment or you can export the plugin settings from live site and import it on your local site after reinstalling the plugins.

Step 3 – Creating a New Local Database

Create Database for Local WordPress Site

Step 4 – Importing Live Database to Local Site

Import Live Database in Local Server

The import will work when you have smaller database size. If your live database is bigger than 32MB in size (or as limited by maximum file upload size on your site) then importing zip file from phpMyAdmin will fail. In such case, you may need to upload the database from command line. You can follow the instructions in this article on how to import large SQL database for MAMP in Mac.

Step 5 – Replace Live Site URL with Local Site URL in Tables

Now that you have uploaded live site’s database to local server but the tables will still have live site’s URL references instead of localhost which you need to change it. Copy the below query and replace the site name with your own URL.

Ensure to use HTTPS, if your live site URL is SSL protected.

Localhost URL should always be with HTTP.

WordPress tables generally starts with “wp_” prefix. But if you have changed with other prefixes, then replace the table names in the query as per your prefix.

You will see the result indicating how many lines are changed in the tables after the successful execution of the query.

View Result of the Query

Step 6 – Replace Local Site Files with Live Site Files

Next step is to replace local site’s files with the live site’s files downloaded in step 1. The simple way to avoid mistakes here is to change the existing local folder name with the suffix “_old” and then create a new folder with the same name. Paste all live site’s files inside the new folder.

Replacing Localhost Files with Live Site Files

SEO Offer: Optimize your site with Semrush Pro special 14 days free trial.

Step 7 – Configuring Database Name in chúng tôi File

If you open your localhost site now it will probably show the message “Error establishing database connection”. Locate and open “wp-config.php” file in local server and replace the database name with the correct name as you created in step 3. Generally the username and password are same as “root” (unless you changed it) and change it accordingly.

Modify wp-config php File

Step 8 – Check Your Localhost Site

Login to localhost WordPress admin dashboard and check the settings.

The sidebar widgets will not be imported from the live site. So you should manually add the sidebar widgets in localhost site.

Plugins having single domain license key may not work on the local site as it is validated with the live site.

Some of the plugins like caching and security plugins may not work in local environment. Either they will be automatically deactivated or you should manually deactivate for the localhost site to work properly.

If you have the absolute URLs used on footer and menu items then you may need to manually change them to local site URLs.


We hope the article helped you to move your live WordPress site to localhost. As mentioned, we recommend to ignore the caching and security plugins and related tables when exporting the live content. In addition, the page builder and licensed plugins may also stop working on the local environment. You can also try other options like using staging site if you are using siteGround or Local By Flywheel.

Update the detailed information about How To Create Comparison Table In WordPress? – Webnots on the website. We hope the article's content will meet your needs, and we will regularly update the information to provide you with the fastest and most accurate information. Have a great day!