EDITS.WS

Author: Editorial Staff

  • How Does WordPress Search Work (+ Tips to Make It Better)

    Do you want to learn how WordPress search works, and how you can make it better?

    By understanding and improving the built-in WordPress search, you can help visitors find what they’re looking for. This can get you more conversions while keeping people on your site for longer.

    In this article, we’ll look at how the default WordPress search works, and share tips on how to make it better.

    How does WordPress search work + tips to make It better

    How Does WordPress Search Work?

    WordPress comes with a search system that will look for content within your website.

    How the search bar looks and where it appears will vary depending on your WordPress theme, but most themes show the search bar in the top right corner.

    The built-in WordPress search bar

    Note: If your theme doesn’t show the WordPress search bar by default, then skip ahead to our FAQs, where we’ll show you how to add it.

    Visitors can type a search query into this field, and WordPress will search:

    • Page titles
    • Page content
    • Single-image titles and captions
    • Image alt text
    • File names

    As you can see, it doesn’t search widgets, user comments, categories, tags, WooCommerce products, or PDF documents. It also doesn’t search image gallery titles, captions, or alt text, although you can search this content using a search engine plugin like SearchWP.

    WordPress performs this search using the WP_Query class. It will start by displaying any posts that have the search term in the post title, arranged in reverse-chronological order, meaning that the newest entries will be displayed at the top of the results.

    After that, it’ll show any posts that have the matching term in the post content.

    For example, imagine you’ve just published a post about cats titled ‘My Favorite Pet’, and you also have an older post titled ‘Best Cat Photos.’ In this case, searching for ‘Cat’ will display the older ‘Best Cat Photos’ post first, since it has the search term in the title.

    This may not a problem for WordPress blogs or websites that only have small amounts of content. However, this ordering logic will often show inaccurate or confusing results for bigger blogs, online stores, or business websites.

    The built-in system is also missing some of the features that people expect from modern search engines. This includes autocomplete, live Ajax search, filtering, and spellcheck.

    Why Improve the Default WordPress Search?

    An advanced, fast, and accurate on-site search can help visitors find interesting and relevant content, which will keep them on your website for longer. This can increase pageviews and reduce bounce rate in WordPress.

    Since visitors are spending more time on your site, this will send positive signals to the search engines. This can improve your WordPress SEO, which means search engines like Google will show your content to more people and drive more visitors to your website.

    For more information, please see our guide on how to increase your blog traffic.

    People who are using your site’s internal search are already highly engaged. They’re actively looking for specific content, which may mean they’re ready to take actions such as buying a product, signing up to your WordPress membership site, or booking an appointment.

    If these people can’t find what they’re looking for, they may give up and go to a different website. This means you’re losing out on visitors who were ready to convert.

    A search results page is also an example of personalized content since you’re showing the visitor results that match their unique search query. By providing personalized content that’s accurate and helpful, you can improve the visitor experience. Once again, this can encourage them to convert.

    Performance is another reason why it’s a good idea to replace the default WordPress search with a better alternative.

    The larger your WordPress website gets, the longer it’ll take WP_Query to scan your database and get the results. This means your site’s search will get slower, as your website gets bigger.

    How to Make the WordPress Native Search Better

    On-site search helps visitors find what they’re looking for, including products to buy and interesting blogs to read. Since it’s such an important part of your site, it’s a bad idea to rely on the limited built-in WordPress search.

    With that being said, let’s see how you can improve the native WordPress search.

    Show Instant Results With Live Ajax Search

    Live Ajax search adds a dropdown and autocomplete feature that’s common in search engines like Google.

    As the user types, live search guesses what they want to search for and then shows them results without even reloading the page.

    How to improve WordPress search with live ajax results

    This can help visitors find the right content, without having to manually press the ‘Search’ button or wait for the page to reload.

    The easiest way to add Ajax live search to WordPress is using the free SearchWP Live Ajax Lite Search plugin. It enables instant search automatically and there are no settings for you to configure, so it’s very easy to set up.

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

    Upon activation, the default WordPress search form will automatically use the Ajax live search feature. If you visit your site and start typing into the search bar, then you’ll see the instant search in action.

    Change the Default Search URL Slug

    By default, WordPress search URLs typically look something like this:

    http://example.com/?s=search-term
    

    The extra ?s= characters make this URL more difficult to read and understand, which can confuse visitors who are trying to find their way around your site.

    Even worse, these URLs aren’t optimized for search engines which can stop them from correctly indexing your site’s contents.

    The easiest way to change these URLs is by adding custom code to WordPress using a plugin such as WPCode.

    You can go ahead and use the following custom code to replace the ‘/?s=search-term’ characters with ‘search.’ Your slug will look something like this when finished: http://example.com/search/wordpress

    To use something other than ‘search’ in your URL, simply customize the code snippet below.

    function wpb_change_search_url() {
        if ( is_search() && ! empty( $_GET['s'] ) ) {
            wp_redirect( home_url( "/search/" ) . urlencode( get_query_var( 's' ) ) );
            exit();
        }
    }
    add_action( 'template_redirect', 'wpb_change_search_url' );
    

    For detailed instructions on how to insert this code to your WordPress website, please see our guide on how to change the default search URL slug in WordPress.

    Make PDF Files Searchable in WordPress

    By uploading PDFs to your WordPress website, you can share information about your services and products in a format that works on all devices. They’re also perfect for offering your visitors ebooks, user manuals, menus, and more.

    However, WordPress only searches the contents of its database by default, so it will only look at the title and description of your PDF files, and not their contents. As a result, your visitors may struggle to find the best PDF for their search query.

    The good news is that you can use a custom search plugin to improve the default WordPress search experience. If your PDFs are unencrypted, then the right search plugin will index the contents and metadata of your PDFs and add them to the search results.

    For step-by-step instructions, please see our guide on how to add PDF indexing and searching in WordPress.

    Add a Search By Category Feature to WordPress

    If you have multiple categories of content on your website, then you might want to let users restrict their search to a specific category. This can help visitors find the right content, faster.

    An example of search by category on a WordPress website

    For example, if you have an online store then it often makes sense to let customers search within a particular product category.

    If you run a membership site, then you might use search by category to help visitors find other members, groups, forums, online courses, and other specific kinds of content. For more information, please see our guide on how to add search by category in WordPress.

    Make a Smart WooCommerce Product Search

    WooCommerce has its own built-in search, but it doesn’t look for matches in product attributes, reviews, or product descriptions. This omission can stop shoppers from finding products they want to buy on your online store, so you get fewer sales.

    The built-in WooCommerce search feature

    Luckily, there are some excellent WooCommerce plugins that can show more helpful search results, and fetch them faster. To learn more, please see our guide on how to make a smart WooCommerce product search.

    To get even more sales, you may want to fine-tune the kind of products WooCommerce includes in its search results. For example, you might only show products that are on sale or come with free shipping.

    To learn more, please see our guide on how to customize WooCommerce product search results page.

    Create a Search Form for Custom Post Types

    Custom post types allow you to go beyond posts and pages and create different content types for your website. Custom post types can have different custom fields and their own custom category structure.

    For example, if you run a movie review website, then you would probably want to create a ‘movie reviews’ post type that has fields for the director, release date, and more.

    At WPBeginner, we use custom post types for our Glossary section to keep it separate from our blog posts.

    How to improve your WordPress search with searchable categories

    If you use custom post types, then you may want to create a form that allows visitors to search only that content.

    For example, we also have a form that only searches WPBeginner’s coupon codes.

    Searching coupons and deals on the WPBeginner website

    This can help visitors find the right content faster, even when you have lots of different content types. For step-by-step instructions, check out our guide on how to create advanced search forms in WordPress for custom post types.

    You can also make custom fields searchable in WordPress, which is ideal if you’ve added extra metadata to your pages and posts.

    Exclude Content From WordPress search

    By default, the built-in WordPress search will include all posts and pages in its search results.

    However, you may want to exclude certain pages and posts from the search results. For example, if you’re running a WordPress membership website or selling online courses, then you’ll typically want to exclude your premium content from public search results.

    If you’re running an online store, then you may want to hide content like your account page, checkout page, and thank you page. To help you out, we’ve created a guide on how to exclude pages from the WordPress search results.

    Do you want to exclude posts, authors, custom post types, categories, tags, or even custom taxonomies? Then you can take a look at our guide on how to exclude specific pages, authors, and more from WordPress search.

    WordPress Search FAQs

    In this guide, we’ve explored how the default WordPress search works and shared lots of tips on how to improve it.

    However, you may still have some questions about this important feature. That said, here are some of the most frequently asked questions about WordPress search.

    How Do I Improve WordPress Search?

    The best way to improve the built-in WordPress search is by using SearchWP.

    SearchWP is the best custom search plugin for WordPress and allows visitors to search any content on your site including documents, WooCommerce products, custom fields, tags, comments, and more.

    It also lets you customize the WordPress search algorithm, so you can control exactly where the content appears in the search results.

    For more information, please see our guide on how to improve WordPress search.

    Does WordPress Search Include Tags?

    By default, WordPress search doesn’t include tags. The easiest way to make tags searchable is by using a custom search plugin like SearchWP.

    SearchWP also has a relevancy slider, so you can control exactly how much tags influence where an item appears in the search results.

    How Do I Add Search to My WordPress Theme?

    If your theme doesn’t have a built-in search form, then we recommend adding a search bar to the WordPress navigation menu.

    Since the main navigation menu typically appears across your entire site, visitors will be able to search for pages, posts, products, and more, from any page of your website.

    An example of a search bar, in a navigation menu

    If you’re using a block-based theme such as ThemeIsle’s Hestia Pro or Twenty Twenty-Three, then you can add a search bar to your theme using the full-site editor (FSE).

    To do this, go to Appearance » Editor in the WordPress dashboard.

    Opening the WordPress full site editor (FSE)

    By default, the editor will show your theme’s home template. If you want to add the search bar to a different template, then click on the small arrow icon in the toolbar.

    Then, select ‘Browse all templates.’

    How to browse all FSE templates in WordPress

    You’ll now see all the templates that make up your WordPress theme. Simply find the template where you want to add the search bar, and then click on its title.

    For example, if you wanted to add a search form in your WordPress posts then you’d select the ‘Single’ template.

    How to add the search bar to a single template in WordPress

    You will now see this template in the full-site editor.

    To go ahead and add a search bar, click on the blue ‘+’ icon.

    Adding widgets to a single template in WordPress

    In the popup that appears, type in ‘Search’ to find the right block.

    You can then drag the block to the location where you want to show the search bar.

    Adding a search block to a block-enabled theme template

    To customize the block title or placeholder text, simply type it into the search block where it says ‘search’ or ‘optional placeholder.’

    When you’re happy with how the block looks, click on ‘Save’ to make the search bar live.

    Publishing a block-enabled template with a search bar

    How Do I Add Search to a WordPress Page or Post?

    You can add a search bar to a specific page or post using the built-in Search block.

    This is a good choice if you want to control exactly where the search bar appears on every page and post, or you only need to offer search on specific areas of your website.

    How to improve the default WordPress search

    To get started, simply open the page where you want to add a search form and then click on the + icon.

    In the popup that appears, type ‘Search’ to find the right block. Once you click on the Search block, it will add the block to your page.

    Adding the Search block to a WordPress page or post

    By default, the block uses ‘Search’ for both its label and the button text.

    This will be visible to visitors, so you may want to replace it with something more descriptive by typing into the text fields.

    Customizing the WordPress search block

    You can also add some placeholder text to the search bar. This text will disappear automatically when the visitor starts typing.

    To add a placeholder, simply click on ‘Optional placeholder…’ and then start typing.

    How to improve the WordPress search

    When you’re happy with how the Search block looks, you can go ahead and either publish or update the post.

    We hope this tutorial helped you learn how WordPress search works, and how to make it better. You may also want to learn how to make money online blogging with WordPress, or check out our list of the best email marketing services for small businesses.

    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 Does WordPress Search Work (+ Tips to Make It Better) first appeared on WPBeginner.

  • How to Add No Right Click on WordPress Images

    Do you want to add no right-click to your WordPress images?

    If you’re a photographer, artist, or content creator, then you’re probably worried about people stealing your images. While it’s difficult to completely stop image theft, you can make it more difficult for people to steal pictures from your website.

    In this article, we’ll show you how to add no right-click on WordPress images and galleries.

    How to add no right click on WordPress images

    Why Add No Right-Click on WordPress Images?

    The Internet has made it easier to share your work with the world, but it’s also made it easier for people to steal your images.

    These people might use your content to promote scams or fraudulent products. They might even sell your digital art and graphics online, making money from your hard work while you make none.

    If you’re an online influencer or have a big social media following, then people might even steal your photos and impersonate you online. For example, they might pretend you’re an affiliate marketing partner.

    Even if you simply write a WordPress blog, people might still use your personal photos as part of online scams like fake ads or reviews.

    Scammers could even scrape your WordPress blog content and images, and then republish it on other websites. This duplicate content can damage your WordPress SEO.

    While there’s no single solution that can completely prevent image theft, you can make your site a less attractive target.

    With that being said, let’s see how you can add no right-click on WordPress images and galleries. Simply use the quick links below to jump straight to the method you want to use.

    Method 1. How to Add No Right Click to All Your WordPress Images

    The easiest way to protect your images is by using No Right Click Images. This free plugin allows you to disable right-clicking for images only, so users can still right-click on your other content including links.

    You can also enable and disable right-click based on whether the visitor is logged into their account. This is perfect if you run a subscribers-only stock photo website or some other form of membership site.

    First, you’ll need to install and activate the plugin. If you need help, then please see our guide on how to install a WordPress plugin.

    Upon activation, go to Settings » No Right Click Images to configure the plugin settings.

    How to add no right-click on WordPress images

    The default options should work for most users, but it’s still worth checking whether you need to make any changes. In particular, these settings can help you close any loopholes that people might use to get around the no right-click protection.

    Out of the box, the plugin disables dragging images so users can’t copy an image by dragging it onto their desktop or another tab. With that in mind, we always recommend leaving ‘Disable Dragging of images’ checked.

    No Right Click Images also disables touch and gesture events, which can stop people from stealing images on devices that make use of those sorts of actions. However, this can cause problems if you use images as links or buttons, or if your visitors interact with your pictures using gestures, such as before-and-after images.

    If you do encounter problems, then you can re-enable support for touch events and gestures by unchecking the following boxes: ‘Disable Touch events’ and ‘Disable Gesture events.’

    How to disable touch events and gestures on your WordPress website

    By default, visitors can still open a context menu and save your images on Apple devices.

    That said, you may want to check the box next to ‘Disable context menu on Apple devices.’ This adds a style to images on iPhones and iPads, which stops users from opening the Apple context menu and stealing your images.

    How to disable the Apple context menu on your WordPress blog or website

    When you’re happy with how the plugin is set up, don’t forget to click on ‘Save Changes’ to store your settings.

    You can now log out of your WordPress admin account and visit your website. Then, simply right-click on any image to check the plugin is working.

    Method 2. How to Add No Right Click to Image Galleries

    If you want to protect individual images across your website, then the first method is a good choice. However, sometimes you may want to create an image gallery in WordPress, and then disable right-clicking for the entire gallery. For example, you might build a photography portfolio or display your most popular products in a nice gallery layout.

    This is where Envira Gallery comes in.

    It is one of the best WordPress gallery plugins on the market and comes with a protection addon that disables the ability to right-click on any galleries you create using the plugin.

    How to disable right-click for a WordPress gallery

    The first thing you need to do is install and activate the Envira Gallery plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.

    Upon activation, go to Envira Gallery » Settings and enter your license key.

    Activating the Envira Gallery WordPress plugin

    You can find this information under your account on the Envira Gallery website.

    With that done, click on ‘Verify Key.’

    Next, head over to the Envira Gallery » Addons page. Here, find the Protection addon and click on its ‘Install’ button.

    Activating the Protection addon for Envira Gallery

    When you see the ‘Inactive’ slider, give it a click so it shows ‘Active’ instead.

    After that, you’re ready to start creating protected image galleries.

    How to protect your galleries using the Protection addon

    To get started, go to the Envira Gallery » Add New page and type in a name for your gallery.

    This is just for your reference so you can use anything that helps you identify the gallery in your WordPress dashboard.

    Creating a new gallery using a WordPress plugin

    You’re now ready to add images to the gallery. You can click on ‘Select Files from Your Computer,’ or ‘Select Files from Other Sources’ and then choose images from the WordPress media library.

    After that, scroll to the ‘Currently in your Gallery’ section and click on the ‘Misc’ tab.

    How to disable no right-click for your image gallery

    Under ‘Image Protection Settings,’ check the box next to ‘Enable Image Protection.’

    This disables the right-click action for all your Envira galleries.

    Enabling image protection for your image galleries

    If a visitor tries to right-click a gallery, you may want to show a popup on your WordPress website. For example, you might let this person know your images are copyrighted, and can’t be downloaded without your permission.

    If you’re selling your digital artwork or photos, then you can even use the popup to get more sales on your online store.

    Showing a popup on right-click

    To create a popup, check the box next to ‘Enable Popup Alert.’

    You can then type in a title and message.

    Show a popup when a visitor right-clicks an image

    By default, visitors will click an ‘OK’ button to close the popup.

    You can replace ‘OK’ with your own custom messaging by typing into the ‘Button Text’ field.

    Adding a custom message to an image protection popup

    When you’re happy with how the gallery is set up, click on ‘Publish’ to save your settings.

    To add the gallery to your website, simply edit the post or page where you want to show the images and then click on the ‘+’ icon.

    In the popup, type in ‘Envira Gallery’ and then click on the right block when it appears.

    Add the Envira Gallery block to WordPress

    This adds the Envira Gallery block to the page.

    You can now open the dropdown menu and select the gallery you just created.

    Publishing an image gallery to your website or blog

    When you’re happy with how the page looks, either click on ‘Publish’ or ‘Update’ to make the protected gallery live.

    Pros and Cons of Disabling Right-Click on WordPress Images

    Disabling the right-click action makes it more difficult for people to steal your images. It also reminds users that they can’t simply download files without the owner’s permission.

    Sometimes, this will be enough to stop people from stealing your photos. This is particularly true for scammers, who tend to look for easy ways to download as many images as possible. It can also discourage genuine visitors, who may assume they can download and use any online content.

    However, there are still ways to get around a website’s no right-click protection. For example, users can still download an entire page.

    How to download images using the browser tools

    This will copy the page’s content into a file, including all the images.

    People can even use their browser’s view source or inspect tool to directly access an image file without right-clicking.

    Inspecting an image using the built-in browser tool

    With that in mind, you shouldn’t assume that disabling right-click is enough to keep your images safe.

    On the other hand, some visitors may have a genuine reason why they need to download your images. For example, they may want to share your work with a potential future customer or post it on social media.

    You might even allow people to reuse your images in specific ways, such as using your digital artwork on a non-profit website. In this case, disabling right-click can stop genuine users from accessing your images, which is a poor visitor experience.

    If you do add no right-click to your website, then we recommend giving people an easy way to request access to your images. You can do this by adding a contact form to WordPress using a plugin such as WPForms.

    How to create a contact form using WPForms

    If there’s a chance your visitors may need immediate access, then you can also add live chat to your site. This allows people to send their requests and get a response in real time, which is a great user experience.

    Alternative Ways to Discourage Image Theft on Your Website

    When it comes to protecting your images, disabling right-click is a good first step. However, if you really want to stop thieves then we recommend taking some extra measures.

    With that in mind, here are some additional ways to stop people from downloading, reusing, and selling images without your consent.

    1. Add a Copyright Notice Below Your Images

    If you haven’t already, then you should add a copyright notice to your website. We recommend adding a dynamic copyright date to the WordPress footer so it appears on every page and always shows the current date.

    An example of a copyright notice, in a website footer

    This is a great start, but it’s also a good idea to add a copyright notice below each image in plain text. This discourages people from stealing your photos, without affecting how that image looks on your website.

    Some visitors simply assume they can download and re-use any images they see online. By adding a copyright notice, you can clear up any confusion and stop people from making this innocent mistake.

    How to protect your photos with a copyright disclaimer

    2. Add Watermarks to Your Images

    Another option is adding a watermark to your images. This works great for stock photography websites where visitors expect to see a watermark, but your images might not look their best.

    An example of a stock photography website with watermarks

    This can be a problem for some websites, particularly if you’re a photographer or digital artist who’s promoting their work.

    For that reason, we recommend positioning your watermarks carefully so they discourage people from stealing the image, without ruining how that image looks on your website.

    To learn more, please see our guide on how to automatically add watermarks to images.

    3. Set Up Automatic Content Theft Notifications

    Sometimes, websites will mention your business or brand name next to the stolen images, particularly if they’ve scraped an entire page from your site.

    With that in mind, it’s a good idea to set up brand name notifications using a service such as Google Alerts. Simply head over to the Google Alerts page and type in the name of your site, brand, products, or any other important text.

    If there’s a specific phrase or call to action that you add to every post, then you may also want to type this into Google Alerts.

    Set up content theft notifications using Google Alerts

    After that, use the dropdown menus to configure the alert and type in the email address where you want to get the notifications.

    When you’re happy with how the alert is set up, go ahead and click on ‘Create Alert.’

    Now, when someone publishes scraped content of yours, you will get an email letting you know about it.

    4. Reverse Image Search with Google

    You can use Google image search to find all the places where a particular image is used online. Simply head over to the Google Images page and click on the small camera icon.

    Protect your site against content theft

    This will add a section where you can paste a direct link to the image or upload a copy from your computer.

    After that, click on ‘Search.’

    How to do a Google Reverse Image Search

    Google will now show all the images that are similar to your picture. If you find the exact image on another website, then you can click through to see how that picture is being used.

    If you have lots of photos, then checking each one manually can take a lot of time and effort. However, Google reverse image is a great way to uncover sites that re-using your images, so it’s smart to do a search from time to time.

    Alternatively, you can use an advanced reverse image service such as Pixsy.

    5. Contact the Website’s Host or Registrar

    If someone has stolen and re-published your images, then we recommend contacting that person. There’s a chance they may be unaware they’re using copyrighted images illegally.

    However, if it’s a spam website then you may struggle to find contact information. Instead, you can use the IsItWP lookup tool to find out where the domain and website are hosted.

    The IsItWP lookup tool

    The tool will pull up any available information, including the web hosting company.

    Stealing content is an illegal activity and most web hosting companies don’t want to host sites that are breaking the law. With that in mind, you can contact the host and registrar directly to try and get the site taken down.

    Most reputable web hosting companies take DMCA (Digital Millennium Copyright Act) complaints seriously, so this method usually gets good results.

    We hope this article helped you add no right-click on WordPress images. You may also want to see our ultimate WordPress security guide or check out our expert pick of the best Instagram WordPress plugins.

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

    The post How to Add No Right Click on WordPress Images first appeared on WPBeginner.

  • Ultimate WordPress Migration Guide for Beginners (Step by Step)

    Are you looking to move your website to WordPress, or thinking about migrating an existing WordPress site to a new domain or host?

    WordPress is the most popular website builder powering over 43% of all websites on the internet. That’s because it’s easy to use and gives you control over every aspect of your website.

    In this article, we’ll show you how to migrate your blog or website to WordPress with little downtime and without losing SEO. We’ll also show you how to move your WordPress site to a new server or domain.

    Ultimate WordPress Migration Guide for Beginners (Step by Step)

    Why Migrate Your Website to WordPress?

    Small businesses and individuals are starting websites all the time. They realize that having an online blog or website have significant benefits that help them grow their brand and keep in touch with clients.

    However, many beginners choose a blogging platform other than WordPress. These platforms help them get started quickly, but as their websites grow, they begin to run into limitations.

    For example, they may not be able to install plugins that add the features they need, there may be limited options in customizing the appearance of their site, or the platform may become too expensive as their requirements grow.

    We believe that self-hosted WordPress outperforms all other blogging and website platforms. It is powerful, easy to use, affordable, and the most flexible of all available blogging platforms. Here are all the reasons why you should use WordPress.

    Note: When we speak of self-hosted WordPress, we mean WordPress.org. This is different from WordPress.com, which is a hosting service. We show you how to migrate from WordPress.com to self-hosted WordPress at the end of this article.

    The good news is, that you can migrate your blog to WordPress and begin to take advantage of its power and flexibility.

    How to Migrate Your Blog to WordPress Yourself

    Migrating a blog isn’t as simple as just moving information from one platform to another. However, that’s definitely something you need to get right, otherwise, you may lose content.

    It’s also essential to choose a reputable WordPress hosting company that’s fast and reliable. Luckily, most hosting services will install WordPress for you automatically and free of charge.

    You also need to make sure you don’t lose SEO so that your posts rank lower on Google. You should also set up an SEO-friendly URL structure for your future posts.

    Now you don’t want your visitors or search engines to lose track of your posts because the old URLs stop working. You need to take care of this by creating redirects.

    Besides these, there may be some additional steps you need to take to migrate everything over and improve your blog.

    That’s a lot to keep track of, so we created specific step-by-step guides on how to migrate from your specific blogging platform to WordPress:

    1. Migrating Self-Hosted WordPress to a New Server or Domain

    You may already be using a self-hosted WordPress website and decide to migrate it to a new hosting service or domain. For example, you may decide to upgrade to a more reliable web hosting company.

    You will need to move your WordPress files and databases from the old provider to the new one. If you’re not careful, then you may lose data, or take your website down and lose sales.

    That’s why we created a step-by-step tutorial that shows you how to safely migrate WordPress to a new host or server without any downtime.

    However, if you are moving your website to a new domain name, then you have a little more work to do. This would be if you are changing the URL of your website from, say, johnsmith.com to smithconsultingservices.com.

    In that case, you simply need to follow our detailed guide on how to easily move WordPress to a new domain.

    Tip: Some hosting providers, such as SiteGroundHostingerWP Engine, and GreenGeeks offer a free migration service for WPBeginner users. It might not be listed on their website, so all you have to do is ask.

    2. Migrating From Blogger to WordPress

    Blogger is a free blogging service by Google. It offers a quick and easy way to create a blog for non-tech-savvy users. All you need is a Google account to start a free blog on Blogger.

    However, as your website grows, you will be limited to basic blogging tools and won’t be able to add new features. There are also not many ways to customize the appearance of your blog.

    WordPress, on the other hand, gives you complete ownership of your website and allows you to add the necessary features to grow and monetize your blog. We have created a detailed side-by-side comparison of WordPress vs Blogger.

    The good news is that WordPress is set up to natively import your Blogger posts. However, you will need to follow our instructions carefully, or your new blog’s URLs might not match.

    If you have a free Blogger account, then you will have a website address that looks like myblog.blogspot.com. In that case, you should follow our guide on how to switch from Blogger to WordPress without losing Google rankings.

    However, Blogger also allows users to connect custom domain names to their blogs such as myblog.com. If you have a custom domain Blogger blog, then you will need to follow our guide on how to move a custom domain Blogger blog to WordPress.

    3. Migrating From Ghost to WordPress

    Ghost is a minimalist blogging platform with features entirely focused on writing blog posts. It is available as a hosted platform, and also as software that you can install, though many users find installing it difficult.

    While a simplified user interface can be a good thing, it also means your options for customizing Ghost’s features and appearance are very limited. This can become frustrating.

    On the other hand, WordPress allows you to customize your site by installing plugins and themes. It is also much easier to install yourself. You can learn more about the differences between these platforms in our side-by-side comparison of Ghost vs. WordPress.

    Unfortunately, migrating from Ghost is difficult because the default Ghost export file does not use a format supported by WordPress. So we decided to fix this issue and created the Ghost to WordPress Importer tool.

    We show you how to use this free tool to migrate your blog in our guide on how to properly move from Ghost to WordPress.

    4. Migrating From GoDaddy Website Builder to WordPress

    GoDaddy is one of the biggest hosting and domain name companies in the world. To help their many users get started with building their website, they offer a basic website builder tool called GoDaddy Website Builder.

    Many users choose this tool because it’s a convenient way to get started. However, it is missing many of the key features of more powerful blogging platforms, as you can see in our detailed comparison between GoDaddy Website Builder vs WordPress.

    This means that users will quickly realize its many limitations and want to move their website to a more flexible and powerful platform like WordPress.

    Unfortunately, there is no export tool to move your site from GoDaddy Website Builder to WordPress. That means that the process will be time-consuming and have a lot of manual steps, making it easy to make a mistake.

    You’ll find every step clearly explained in our guide on how to move a GoDaddy Website Builder site to WordPress.

    5. Migrating From Gumroad to WordPress

    Gumroad

    Gumroad is a popular eCommerce platform that allows users to sell digital goods online, such as games, music, courses, and videos. However, many users are looking to switch away from the platform because they have raised their fees to 10% for each transaction.

    This fee does not include credit card processing or PayPal fees. Plus, an additional 10% fee is charged if a product is sold through the ‘Gumroad Discover’ feature or their ‘Global Affiliates’ program. That’s a lot of fees.

    On the other hand, WordPress is free and doesn’t charge you any fee for the items you sell. Unlike Gumroad, it also lets you sell physical goods and you can use any payment gateway you want and promote your website freely.

    You can easily install a plugin like Easy Digital Downloads to make WordPress the perfect platform for selling digital goods. We have even partnered with SiteGround, and they are offering special EDD hosting for our readers.

    You can learn how to do this in around 30 minutes by following our guide on how to switch from Gumroad to WordPress.

    6. Migrating From Joomla to WordPress

    Joomla

    Joomla is a good content management system that has a lot in common with WordPress. For example, they are both open-source software written in the PHP programming language and use a MySQL database.

    They also have similar requirements, which means you won’t need to change hosting companies.

    However, Joomla is more complicated to use. It is also not as powerful or flexible as WordPress because there are fewer extensions and designs available for you.

    On the other hand, WordPress is easier to use and offers tons of extensions and design choices. See our comparison of Joomla vs WordPress for more details.

    Luckily, there is a plugin you can use to easily import your Joomla content into WordPress. We carefully take you through every step you need in our guide on how to easily move your site from Joomla to WordPress.

    7. Migrating From Medium to WordPress

    Medium is a good blogging platform for new writers. It allows you to publish your posts with very little setup. But because you don’t own the platform, content from other authors often gets displayed below your own story.

    The platform is quite limited compared to WordPress. When you switch from Medium to WordPress, you will own your own blog and can add all the features you need using plugins.

    Simply follow our complete step-by-step guide to help you properly move all your content from Medium to WordPress.

    You can retain the look of your old blog by installing a Medium-style theme or go for a new blog design using one of the best and most popular WordPress themes.

    Tip: If you’re not ready to completely migrate away from Medium, then you can learn how to embed Medium blog posts in WordPress.

    8. Migrating From Shopify to WordPress

    Shopify is an all-in-one eCommerce solution that makes it easy for you to create an online store, accept payments, and manage your inventory, all from a single platform.

    You don’t need to worry about the technical aspects of managing an eCommerce site, but it comes with slightly higher costs and limited control of your website.

    On the other hand, you can turn WordPress into a full-featured online store by installing the WooCommerce plugin and customize every aspect of your store. You can compare the differences between the platforms in our comparison of Shopify vs WooCommerce.

    Unfortunately, migrating away from Shopify is difficult because it doesn’t provide an easy way to export data to a WordPress-supported format. So we built an easy importer tool to help you do the Shopify to WooCommerce migration for free.

    We take you through the entire migration process step-by-step in our guide on how to properly move from Shopify to WooCommerce.

    Note: If you’re not ready to completely migrate away from Shopify, then you can learn how to easily integrate Shopify with WordPress.

    9. Migrating From Squarespace to WordPress

    Squarespace is a website-building service that focuses on small business owners. It allows you to create beautiful websites using easy drag-and-drop tools.

    However, compared to WordPress, it costs more and offers less scope for design and flexibility. And while it does offer a limited set of extensions and integrations, they don’t compare with the power and breadth of the WordPress plugin ecosystem.

    Unfortunately, it is difficult to migrate away from Squarespace because it offers limited export functionality. Depending on what content you have on your site, you may need to manually copy and paste some content from your Squarespace website.

    In our guide on how to properly move from Squarespace to WordPress, we clearly list the content that can be automatically exported, and the content you will have to move manually to successfully migrate your site.

    10. Migrating From Tumblr to WordPress

    Tumblr is a little different than other blogging platforms. It is a microblogging platform with social networking features like following other blogs, reblogging, and built-in sharing tools.

    The platform is easy to use and comes with its own audience. As a microblogging tool, Tumblr makes it easy to quickly blog videos, GIFs, images, and audio formats.

    However, unlike WordPress, Tumblr’s features are limited and cannot be extended. To learn more about WordPress and what you can do with it, please see our complete WordPress review with pros and cons.

    If you’re thinking about migrating from Tumblr to WordPress, then you will be glad to know that WordPress can natively import your Tumblr posts.

    However, there is a lot involved in a website migration, and you’ll find all the steps in our comprehensive guide on how to properly move your blog from Tumblr to WordPress.

    11. Migrating From Weebly to WordPress

    Weebly is a well-known website builder platform owned by Square’s payment platform. It offers easy-to-use website-building tools for business websites and eCommerce stores along with free blog templates that you can add to your website.

    However, that free plan has limited features and bandwidth, and upgrading to a paid subscription is expensive compared to top blogging websites. Besides that, Weebly’s blogging and SEO features are just not as powerful as other blogging platforms.

    By contrast, WordPress can be hosted on any server and has all the features you can dream of like online stores, contact forms, galleries, portfolios, SEO, and more. When you compare Weebly vs WordPress you might start to think about switching.

    The migration will take about an hour, and it’s worth it. Don’t worry, we’ve helped hundreds of people switch with the step-by-step directions in our guide on how to properly move from Weebly to WordPress.

    12. Migrating From Wix to WordPress

    Wix is a popular hosted platform that lets you quickly create simple websites using a drag-and-drop website builder. You can add a blog using the Wix Blog app.

    However, when you compare Wix vs WordPress you see that Wix has incredibly limited options and adding extra features can become quite expensive.

    For all but the simplest websites, WordPress is by far the better choice because it has a much larger range of themes and layouts, as well as a huge selection of plugins that add new features to your website.

    Unfortunately, Wix makes it quite difficult to move your content away, but after reviewing various different ways to move from Wix to WordPress, we believe the easiest method is by importing your blog posts via RSS.

    We show you how to do this step-by-step in our guide on how to properly switch from Wix to WordPress. On an average Wix blog, the migration takes around an hour.

    13. Migrating From WordPress.com to Self-Hosted WordPress

    WordPress.com is a blog hosting service offered by Automattic, a company created by WordPress.org co-founder Matt Mullenweg. Basic blog hosting is free and you can purchase additional options like a custom domain name, additional storage, and premium services.

    This appeals to new users because no setup is required. However, compared with a self-hosted WordPress website, there are limited options to extend your blog. For example, you can’t use custom themes and plugins for customizing your blog.

    You can learn more by viewing our comparison chart on WordPress.com vs WordPress.org.

    If you’re ready to move from WordPress.com to a self-hosted WordPress blog, then see our guide on how to properly move your blog from WordPress.com to WordPress.org. Make sure you follow our steps carefully so you don’t lose data, visitors, or SEO.

    After you migrate to a self-hosted WordPress blog, you may find you are missing some features you enjoyed on WordPress.com. Don’t worry, you can easily add those features by following our guide on how to get WordPress.com features on self-hosted WordPress blogs.

    Special Offer: Our Team of Experts Can Move Your Blog for Free

    Here’s a special offer. If you wish to migrate from Blogger, Medium, Weebly, or WordPress.com to a self-hosted WordPress website, then we can do it for you for free.

    One of our expert team members will do the entire migration for you (100% free). Yes, you can literally switch from any of those specific platforms to WordPress without any risk.

    There are just two conditions:

    • First, you need to sign up for your new web hosting service using our link. This will make sure you get the best price on hosting.
    • Second, your blog can’t have more than 1,000 posts. We can offer a migration service for larger blogs, but that will be a paid service.

    Sound good? You can learn more on our Free WordPress Blog Setup page. We’ve already helped over 100,000 people, so get started now.

    Free Blog Setup

    We hope this tutorial helped you learn how to migrate your website to self-hosted WordPress. You may also want to see our guide on how to create an email newsletter the right way, or our expert pick on must have WordPress plugins to grow your site.

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

    The post Ultimate WordPress Migration Guide for Beginners (Step by Step) first appeared on WPBeginner.

  • What’s New in WordPress 6.2 (Features and Screenshots)

    WordPress 6.2 has just been released, and it is the first major WordPress release of 2023.

    This new version is packed with significant improvements and new features. Many of them focused on the block editor and site editing in WordPress.

    In this article, we’ll show you what’s new in WordPress 6.2 and which features you should try after the update.

    An overview WordPerss 6.2 release with features and screenshots

    Note: WordPress 6.2 is a major release, and unless you are on a managed WordPress hosting service, you’ll have to initiate the update manually. Here’s how to safely update WordPress.

    Important: Don’t forget to create a complete WordPress backup before updating.

    That being said, here’s all that’s new in WordPress 6.2.

    WordPress Site Editor Comes out of Beta

    The site editor comes out of the beta.

    It has been around for the past few WordPress releases, the removal of the beta label is merely an invitation for more users to try it.

    Site editor comes out of beta

    This also indicates the completion of phase 2 of the WordPress development roadmap which started out with the release of the new block editor back in WordPress 5.0 (late 2018).

    WordPress 6.2 includes several new features added to the site editor, including some brand-new tools which we’ll talk about later in this article.

    Note: Full site editor is available with block themes that support this feature. You can try it out even if you are using the older classic editor with a block-enabled theme.

    Improved Navigation Menu Block

    Navigation menus help you define your website layout to your users. However, creating them in the full site editor had been a bit difficult for beginners.

    WordPress 6.2 now comes with an improved ‘Navigation’ block.

    You can now create and manage the Navigation block by editing items in the sidebar.

    Managing menu items in block panel

    To add a new menu item, simply click on the ‘add (+)’ button. You can also drag and drop menu items to rearrange them.

    Want to use a different menu? You can now easily switch between menus you have created earlier by clicking on the Three-dot menu in the sidebar.

    Manage menus

    Overall, this is a significant improvement to the older Navigation block where you had to edit items inline which was not a good experience for beginners.

    Improved Template Browsing Experience

    WordPress 6.2 comes with a new template browsing experience.

    This allows users to browse different templates to find out which one they need to edit if they want to make changes to a certain area of their website.

    Template browser in WordPress 6.2

    To edit a template or template part, simply click to load it inside the preview window. After that, just click on the preview window to start editing.

    Want to exit the site editor?

    Simply click on the WordPress or your site logo at the top left corner of the screen to enter the template browser. Then click again to exit and return to the WordPress dashboard.

    Exit site editor

    The template browser screen will now also show you that you have unsaved changes.

    It also offers an improved saving experience showing what changes you are saving.

    Unsaved changes in site editor

    Template Parts Highlighted with Colors

    A template in the site editor may include several template parts, like the header and footer.

    These are global elements that can be used in multiple places on your WordPress website. If you edit a template part on one page, those changes will be reflected all over your site.

    Previously when editing a template part, the only indication was the label at the top changed to show the template part name.

    Template part editing before WordPress 6.2

    Editing template parts affects all templates that include those elements. This makes it important to indicate that users are editing a global template part and not simply the page they are looking at.

    WordPress 6.2 now makes this more noticeable by adding colors and an icon to indicate that you are editing a template part.

    Template part edited in WordPress 6.2

    Modify Your Theme With The Style Book

    WordPress 6.2 comes with a style book feature in the site editor.

    This is basically one convenient place to browse how your theme displays all the blocks. To access it you need to switch to the Styles panel and then click on the Style Book icon. It is the one that looks like an eye.

    Style book shows all block styles at one place

    This will show you all the blocks, and how they are styled in your theme. They are organized into different categories so that you can easily locate the block you want to edit.

    Click to start editing a block and you will see all the tools that you can use in the sidebar panel. Changes you make here will apply globally to your theme.

    Edit block directly from style book

    Basically, you can change the appearance of your entire theme by editing individual blocks here and creating a completely new style of your own.

    Want to edit block styles individually? Don’t worry there are even more design tools at your disposal to edit blocks.

    Ability to Add Custom CSS to Your Theme or Blocks

    By default, the site editor hides the legacy Theme Customizer interface. Many users added their custom CSS in the ‘Additional CSS’ panel available with the legacy customizer.

    Until 6.2, it was a problem to add custom CSS using the default tools available.

    WordPress 6.2, however, now allows you to add custom CSS that applies to your entire site. Simply click on the Styles panel and choose Custom CSS under the three-dot menu.

    Custom CSS in site editor

    You can also add custom CSS to individual blocks as well.

    Switch to the Style panel and then click on Blocks.

    Block styles

    Now, you need to select the block that you want to modify.

    After that, click on the ‘Additional Block CSS’ tab to enter your custom CSS code.

    Block styles custom CSS

    WordPress 6.2 makes it easier to add custom CSS if you need to. However, it comes with a ton of built-in design tools which are much easier to use than adding custom CSS.

    Copy and Paste Block Styles

    Another styling feature that reduces the need to add custom CSS is the ability to simply copy and paste block styles.

    Let’s say that you just made some changes to a block and want to make the same changes on another block as well.

    With WordPress 6.2 you can simply click on ‘Copy styles’ under the block options.

    Copy styles

    After that, click on the block options for the block where you want to paste the style and select ‘Paste styles.’

    Note: Your browser will ask for permission to allow your website to view the contents of the clipboard. You need to click ‘Allow’ to continue.

    Paste styles

    Improved Pattern Insertion

    WordPress block patterns are a collection of pre-made design elements that you can use for creating custom content layouts faster.

    By default, WordPress comes with several built-in patterns. Your WordPress theme may also include its own pattern. Plus, you can find more patterns in WordPress Patterns Directory.

    WordPress 6.2 comes with an improved pattern insertion interface.

    Easier pattern insertion

    Openverse Free Media Library Integration

    WordPress 6.2 now adds a ‘Media’ tab in the inserter as well.

    Here, you can choose media from your own WordPress media library or browse royalty-free images from Openverse.

    Openverse Integration in WordPress 6.2

    Openverse is a sister project of WordPress.org. It allows openly licensed and public domain works to be discovered and used by everyone.

    Once you select an image it will be inserted into the editor and downloaded to your WordPress media library as well.

    WordPress will also save the image caption which may include a link back to the original source. You can delete this caption if the image is in the public domain.

    New Sub Panels for Block Settings & Styles

    WordPress 6.2 now uses sub-panels to separate block settings and styles.

    This helps users understand where they need to look if they want to change the appearance of a block.

    Sub panels for block settings and styles

    New Distraction-Free Mode

    Historically, WordPress has always provided options to hide the formatting buttons and toolbars on the post editor screen.

    Here is how it looked in WordPress 4.1 with the older classic editor.

    Distraction free mode in older classic editor

    However, the block editor had the option to be used in full-screen mode. WordPress 5.4 started using the full-screen mode as the default.

    This allowed users to have a much cleaner writing interface, but there was no distraction-free mode.

    Full-screen mode

    WordPress 6.2 now comes with a completely clean and calm distraction-free mode.

    Users will be able to choose it from the editor settings, and it removes all toolbars and editing panels from the screen.

    Distraction free mode in WordPress 6.2

    Import Classic Widgets as Template Parts in Block Themes

    WordPress 6.2 provides a nice fallback for importing classic legacy widgets in block themes when switching themes.

    Users with classic widget themes lost their legacy widgets when they switched to a block theme. Now, you can import them as template parts.

    Simply create a new template part by clicking on the ‘Add New Block’ button (+).

    Import classic widgets into template part

    From the template part settings panel, click on the Advanced tab to expand it, and you’ll find the option to import a widget area from your previous theme.

    Miscellaneous Enhancements

    WordPress 6.2 contains a ton of enhancements. It merges 10 Gutenberg releases (‘Gutenberg’ is the codename for the original block editor project) into WordPress core so there are many refinements and new features to explore.

    Here are some of the most useful enhancements.

    1. Captions Button in Image Block Toolbar

    Previously WordPress automatically added the caption area below the image and moved the cursor automatically to the caption.

    This led many users to continue writing their text not realizing that they are writing it in the caption area.

    WordPress 6.2 fixes this by adding a caption button to the toolbar. Users can now use it to add a caption if needed.

    Add caption button

    2. Improved Calendar Block

    The calendar block now comes with more color options.

    Improved color block

    3. The List, Outline, and Info Panels are Merged

    The list view, outline, and info panel are now merged into one convenient location.

    List block now shows outline and information panel

    4. Group Block Layout

    The ‘Group’ block now lets you choose a layout.

    Group block layout

    5. The Download Link for Media Files

    The media screen will now show a ‘Download File’ link in the list view.

    Download link for media files

    6. New Icon for Settings Panel

    The icon to display the settings panel previously used a gear icon. It is now presented with a panels icon.

    Settings icon

    Under The Hood Changes

    WordPress 6.2 also includes a ton of changes intended for developers. Following are some of these changes:

    • A new HTML API called WP_HTML_Tag_Processor is introduced. (Details)
    • A new client-side filter called blockEditor.useSetting.before is introduced. It allows developers to change block settings before the editor is rendered. (Details)
    • Patterns API extended to include template_types property. (Details)
    • Faster updates by moving directories instead of copying them. (Details)
    • A new switch_to_user_locale() function is introduced. (Details)
    • Create autosave revisions only when content is changed. (Details)
    • Add a style variation tag to themes that use style variations. (Details)

    We hope this article helped you uncover what’s new in WordPress 6.2 and which new features to try out. We are particularly excited about all the changes to the site editor and performance improvements for block themes.

    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 What’s New in WordPress 6.2 (Features and Screenshots) first appeared on WPBeginner.

  • How to Add Fuzzy Search in WordPress to Improve Results

    Do you want to add fuzzy search to your WordPress website?

    Adding fuzzy search helps users easily find the information they are looking for, even if they misspell or otherwise incorrectly enter their query. This improves the overall search experience and user engagement on your website.

    In this article, we’ll show you how to easily add fuzzy search to your WordPress website.

    How to add fuzzy search to your WordPress website

    What is Fuzzy Search And Why Should You Add it to Your Website?

    Fuzzy search looks for partial matches for a search term, even if no exact matches are available, and shows users the most appropriate results.

    This way, users can find the right content on your website even if they make typos in the search query.

    By default, all WordPress websites come with a basic search feature that only shows results for exact matches.

    For instance, if a user misspells a term, no results will be shown not even partial matches. This creates a bad search experience for users and often causes them to leave your site. You can see this in the image below.

    No search results found

    This is where SearchWP comes in. It is the best WordPress search plugin on the market that automatically replaces the default search with a much better search feature.

    Unlike the default WordPress search, SearchWP can use fuzzy search as well as look for matches in titles, excerpts, post or page content, products, custom fields, categories, tags, PDF files, and more.

    For instance, if a user searches for ‘vintage furniture’ on your WordPress blog but misspells a word, they’ll still be able to find your posts on this topic.

    The image below shows the same misspelled search using the SearchWP plugin.

    That being said, let’s see how you can easily add fuzzy search to your WordPress website.

    How to Add Fuzzy Search to Your WordPress Website

    First, you need to install and activate the SearchWP plugin. For more details, please see our guide on how to install a WordPress plugin.

    Upon activation, you need to visit the SearchWP » Settings page from the admin sidebar and switch to the ‘License’ tab.

    Next, you need to copy and paste your license key and click on the ‘Activate’ button. You can find the license key under your account on the SearchWP website.

    SearcWP license

    Fuzzy search is not enabled by default in SearchWP, but you can easily turn it on. First, you need to switch to the ‘Advanced’ tab in the plugin’s settings page.

    Next, you need to simply check the ‘Partial matches (fuzzy when necessary)’ option under the ‘Actions & Settings’ section.

    Check the Partial matches option in the Action & Settings section

    Doing so will enable the fuzzy search feature for your site.

    Once that is done, you should review the other SearchWP settings for your site. The plugin comes with a bunch of powerful options that allow you to customize the search feature on your website.

    You can see them by simply switching to the ‘Engines’ tab under plugin settings.

    SearchWP settings

    From here, you can assign weight to different search results.

    You can also click on the Sources & Settings button to select additional search areas. For instance, you can enable search for comments, products, and more instead of simply posts and pages.

    Enable search for posts, comments, and pages

    To learn more, see our complete guide on how to improve WordPress search with SearchWP.

    Adding a Search Form to Your Website

    SearchWP automatically replaces the default WordPress search.

    This means that if you have already added the WordPress Search block or widget to your website, then it will start using SearchWP custom algorithm for results.

    However, if you have not added the search form to your website, then you can do so by simply adding the Search block or widget to any post, page, or sidebar area.

    Simply head over to the Appearance » Widgets page. Find the ‘Search’ block and simply add it to your sidebar.

    Don’t forget to click on the ‘Update’ button to store your settings.

    Search widget

    However, if you are using a block theme, then your theme may not have a widget-ready area. In that case, you won’t see the Widgets screen under the Appearance menu.

    Instead, you can use the site editor to add the search block to your website. Simply go to the Appearance » Editor page to launch the editor.

    After that, add the search block to your website where you want to display the search form.

    Adding search block in site editor

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

    You can now visit your website and try out the new more powerful search feature.

    You can see in the image below how fuzzy search returns multiple relevant results with a misspelled query.

    Search results with fuzzy search

    We hope this article helped you learn how to easily add fuzzy search to your WordPress website. You may also want to see our tutorial on how to add multilingual search in WordPress and our list of the 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 Add Fuzzy Search in WordPress to Improve Results first appeared on WPBeginner.

  • How to Password Protect Your WordPress Admin (wp-admin) Directory

    Do you want to learn how to password-protect your WordPress admin directory?

    Adding another layer of password protection to your WordPress admin directory can be a great way to improve your WordPress security.

    In this article, you’ll learn how you can password-protect your wp-admin directory easily.

    How to Password Protect Your WordPress Admin (wp-admin) Directory

    Why Password Protect Your WordPress Admin Directory?

    By password-protecting your WordPress admin directory, you improve the security of the most important entry point to your WordPress website.

    Your WordPress admin dashboard is the central hub of your site. It’s where you’ll publish posts and pages, customize your theme, install WordPress plugins, and more.

    Often, when hackers try to get into your website, they’ll do it through the wp-admin screen. You can help to protect your website against potential attacks by using a secure password and limiting login attempts.

    To be even more secure, you can also password-protect the wp-admin directory. Then when someone attempts to access your admin area, they’ll need to enter a username and password before they ever make it to the WordPress login screen.

    With that said, let’s take a look at how you can password-protect your WordPress admin directory step by step.

    The first method is recommended for most users, and you can use the quick links below to jump straight to the method you want to use.

    Method 1: Password-Protect wp-admin Using Directory Privacy (Recommended)

    The easiest way to password-protect your WordPress admin directory is by using your WordPress hosting provider’s Directory Privacy app.

    First, you need to log in to your hosting account dashboard and click on the ‘Directory Privacy’ option in the Files section of your website’s advanced settings.

    Click Directory Privacy

    Note: Most web hosts using cPanel, like Bluehost, will have similar steps. However, your dashboard might be slightly different from our screenshots depending on your hosting provider.

    This brings you to a screen that lists all of the different directories on your server. You need to find the folder that contains your website files.

    For most website owners, this can be found by clicking on the ‘public_html’ folder.

    Click public_html

    This brings up all of the website files you’ve installed on your server.

    Next, you’ll need to click on the folder with your website’s domain name.

    Click domain name folder

    In that folder, you’ll see a ‘wp-admin’ folder.

    Instead of clicking the folder name, you’ll need to click the ‘Edit’ button next to that folder.

    Click edit wp-admin folder

    This brings you to a screen where you can turn on password protection.

    Simply check the box that says ‘Password protect this directory’. If you like, you can also give your directory a name like ‘Admin Area’ to help you remember.

    Check password protect directory box

    Once you’ve done that, you’ll need to click the ‘Save’ button.

    This will take you to a page where the confirmation message will appear.

    Confirmation message click back button

    Now you’ll need to click the ‘Go Back’ button and you’ll be taken to a screen where you can create a user that will be able to access this directory.

    You will be asked to enter a username and password, and then confirm the password. Make sure to note your username and password in a safe place, such as a password manager app.

    Create a User

    Make sure you click the ‘Save’ button when you’ve done that.

    Now, when someone tries to access your wp-admin directory, they will be prompted to enter the username and password you created above.

    Password protect WordPress admin example

    Method 2: Password-Protect wp-admin Using Code

    You can also password-protect your WordPress admin directory manually. To do this you’ll need to create two files called .htpasswd and .htaccess.

    Note: Adding any code to your website can be dangerous. Even a small mistake can cause major errors on your site. We only recommend this method for advanced users.

    Creating the .htaccess File

    First, open up your preferred text editor and name the new file .htaccess.

    After that, you need to copy the following code snippet and add it to the file.

    AuthName "Admins Only"
    AuthUserFile /home/user/public_html/example.com/wp-admin/.htpasswd
    AuthGroupFile /dev/null
    AuthType basic
    require user yourusername
    

    Make sure you change the ‘AuthUserFile’ path to the location where you’ll upload the .htpasswd file and change ‘yourusername’ to the username you want to use to log in.

    Don’t forget to save the file when you’re finished.

    Creating the .htpasswd File

    Once you’ve done that, you need to create a .htpasswd file.

    To do this, open up a text editor and create a file called .htpasswd. This file will list your username along with your password in an encrypted format.

    The easiest way to generate the encrypted password is with a htpasswd generator.

    Simply enter your username and password, select the encryption format, and click the ‘Create .htpasswd file’ button.

    Create htpasswd file

    The htpasswd generator will display a line of text that you need to paste into your .htpasswd file. Make sure you save the file once you’ve done that.

    Uploading .htaccess and .htpasswd to the wp-admin Directory

    The last step is to upload both of the files you created to your website’s wp-admin folder.

    You will need to connect to your WordPress hosting account using an FTP client or the online file manager tool provided by your hosting provider. For more details, see our beginner’s guide on how to use FTP to upload files to WordPress.

    For this tutorial, we’ll use FileZilla because it’s free and works on both Mac and Windows.

    Once you have connected to your website, you will see the files on your computer in the left window, and the files on your website in the right. On the left, you need to navigate to the location where you saved the .htaccess and .htpasswd files.

    Then on the right, you need to go to the wp-admin directory for the website you wish to protect. Most users will need to double-click the ‘public_html’ folder, then the folder with their domain name, then the ‘wp-admin’ folder.

    Now you can select the two files on the left and click ‘Upload’ from the right-click menu or simply drag the files onto the left window.

    Uploading the Files to Your Website's wp-admin Directory

    Now your ‘wp-admin’ directory will be password protected.

    Troubleshooting wp-admin Password Protection

    Depending on how your server and website are set up, there’s a chance you might run into errors. These errors can be fixed by carefully adding code to your .htaccess file.

    Note: This is the .htaccess file located in your main website folder, not the one you uploaded to the ‘wp-admin’ folder. If you’re having trouble finding it, then see our guide on why you can’t find .htaccess and how to locate it.

    Fixing the Ajax Not Working Error

    One of the most common errors is that Ajax functionality may stop working on the front end of your site. If you have WordPress plugins that require Ajax, such as live Ajax search or Ajax contact forms, then you will notice that these plugins won’t work anymore.

    To fix this, simply add the following code to the .htaccess file that’s located in your ‘wp-admin’ folder.

    <Files admin-ajax.php>
        Order allow,deny
        Allow from all
        Satisfy any 
    </Files>
    

    Fixing the 404 Error and Too Many Redirects Error

    Two other errors you might run into are the 404 error and the too many redirects error.

    The simplest way to fix them is to open up your main .htaccess file located in your website directory and add the following line of code before the WordPress rules.

    ErrorDocument 401 default
    

    We hope this article helped you learn how to password-protect your WordPress admin (wp-admin) directory. You may also want to see our expert picks of the best email marketing services for small businesses and our guide on how to get a free email domain.

    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 Password Protect Your WordPress Admin (wp-admin) Directory first appeared on WPBeginner.

  • How to Fade Images on Mouseover in WordPress (Simple & Easy)

    Do you want to fade images on mouseover in WordPress?

    A simple fade-in or fade-out animation when a user moves their mouse over an image can make your site more engaging. It also encourages visitors to interact with your content, which can keep them on your site for longer.

    In this article, we’ll show you how to add a fade image effect on mouseover in WordPress.

    How to fade images on mouseover in WordPress

    Why Fade Images on Mouseover in WordPress?

    Animations are an easy way to make your website more interesting, and can even draw the visitor’s attention toward your page’s most important content, such as your website logo or a call to action.

    There are lots of different ways to use CSS animations in WordPress, but adding a hover effect to images is particularly effective. The fade animation means your images will slowly appear or disappear when visitors hover over them.

    Adding a fade animation to WordPress

    This encourages people to interact with your images, and can even add a storytelling element to the page. For example, different images might fade in and out as the visitor moves around the page.

    Unlike some other animations, the fade image on mouseover effect is subtle so it won’t negatively impact the visitor’s reading experience or any image optimization you’ve done.

    With that said, let’s show you how to add a fade to your images on mouseover in WordPress.

    Adding Image Fade on Mouseover to all WordPress Images

    The easiest way to add a fade effect to all your images is by using WPCode. This free plugin allows you to easily add custom code in WordPress without having to edit your theme files.

    With WPCode, even beginners can edit their website’s code without risking mistakes and typos that can cause many common WordPress errors.

    The first thing you need to do is install and activate the free WPCode plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.

    Upon activation, head over to Code Snippets » Add Snippet.

    Adding custom code to your WordPress website with WPCode

    Here, simply hover your mouse over ‘Add Your Custom Code.’

    When it appears, click on ‘Use snippet.’

    Creating a custom CSS snippet on your WordPress website

    To start, type in a title for the custom code snippet. This can be anything that helps you identify the snippet in the WordPress dashboard.

    We need to add custom CSS to WordPress, so open the ‘Code Type’ dropdown and select ‘CSS Snippet.’

    Add a fade on mouseover animation to images using WPCode

    In the code editor, add the following code snippet:

    .post img:hover{
    opacity:0.6;
    filter:alpha(opacity=60); /* For IE8 and earlier */
    -webkit-transition: all 2s ease;
    -moz-transition: all 2s ease;
    -ms-transition: all 2s ease;
    -o-transition: all 2s ease;
    transition: all 2s ease;
    }
    

    This code snippet will fade each image for 2 seconds when the user hovers their mouse over it. To make the image fade slower, simply replace ‘2s ease’ with a higher number. If you want to make the picture fade faster, then use ‘1s ease’ or smaller.

    You can also make the ‘opacity’ higher or lower by changing the opacity:0.6 line.

    If you change any of these numbers then make sure you change them across all the properties (webkit, moz, ms, and o), so the fade effect looks the same on every browser.

    When you’re happy with the snippet, scroll to the ‘Insertion’ section. WPCode can add your code to different locations, such as after every post, frontend only, or admin only.

    To add a fade effect to all your images, click on ‘Auto Insert.’ Then, open the ‘Location’ dropdown menu and choose ‘Site Wide Header.’

    Inserting custom CSS across your WordPress website

    After that, you’re ready to scroll to the top of the screen and click on the ‘Inactive’ toggle, so it changes to ‘Active.’

    Finally, click on ‘Save Snippet’ to make the CSS snippet live.

    Adding a fade effect to images using CSS

    Now, if you hover the mouse over any image on your WordPress website, you’ll see the fade effect in action.

    Adding Image Fade Animations to Individual Pages

    Using a fade effect for every single image can become distracting, especially if you’re running a photography website, a stock photo store, or any other site that has lots of images.

    With that in mind, you may want to use fade effects on a specific page or post only.

    The good news is that WPCode allows you to create custom shortcodes. You can place this shortcode on any page, and WordPress will show fade effects on that page only.

    To do this, simply create a custom code snippet and add the fade animation code following the same process described above. Then, click on the ‘Save snippet’ button.

    Fade images on mouseover in WordPress using custom code

    After that, scroll to the ‘Insertion’ section, but this time select ‘Shortcode.’

    This creates a shortcode that you can add to any page, post, or widget-ready area.

    Creating a shortcode in WPCode

    After that, go ahead and make the snippet live following the same process described above.

    You can now go to any page, post, or widget-ready area and create a new ‘Shortcode’ block. Then, simply paste the WPCode shortcode into that block.

    How to create fade animations for images using shortcode

    For more information on how to place the shortcode, please see our guide on how to add a shortcode in WordPress.

    With that done, either click on the ‘Update’ or ‘Publish’ button to make the shortcode live. You can then visit that page, page, or widget-ready area to see the fade on mouseover effect.

    Adding Image Fade Animations to Featured Images

    Another option is to add fade animations to your featured images or post thumbnails. These are the post’s primary image and they often appear next to the heading on your home page, archive pages, and other important areas of your website.

    By fading featured images on mouseover, you can make your site more eye-catching and engaging, without animating every single image across your WordPress blog or website.

    To add a fade animation to your post thumbnails, simply create a new custom code snippet following the same process described above.

    Adding a fade on mouseover effect to individual images

    However, this time add the following code to the editor:

    img.wp-post-image:hover{
    opacity:0.6;
    filter:alpha(opacity=60); /* For IE8 and earlier */
    -webkit-transition: all 2s ease;
    -moz-transition: all 2s ease;
    -ms-transition: all 2s ease;
    -o-transition: all 2s ease;
    transition: all 2s ease;
    }
    

    After that, scroll to the ‘Insertion’ box and select ‘Auto Insert.’ Then, open the ‘Location’ dropdown menu and choose ‘Site Wide Header.’

    Adding an animation to images on mouseover

    After that, you can go ahead and make the code snippet live using the same process described above.

    Now, you can hover the mouse over any featured image to see the fade animation in action.

    If you want to add even more image mouseover effects, then see our guide on how to add image hover effects in WordPress.

    Bonus: Animate Any Image, Text, Button, and More

    Fade effects are a fun way to make images more interesting, but there are lots more ways to use animations in WordPress. For example, you might use flipbox animations to reveal text when a visitor hovers over an image, or use zoom effects so users can explore a picture in more detail.

    If you want to try different effects, then SeedProd has over 40 animations that you can add to images, text, buttons, videos, and more. You can even animate entire sections and columns with just a few clicks.

    Inside the SeedProd editor, simply click on the content you want to animate, and then select the ‘Advanced’ tab in the left-hand menu.

    Adding fade animations using SeedProd

    You can then go ahead and click to expand the ‘Animation Effects’ section.

    After that, simply choose an animation from the ‘Entrance Animation’ dropdown, including a wide range of different fade effects.

    Adding animations to WordPress using SeedProd

    For more information, please see our guide on how to create a landing page with WordPress.

    We hope this article helped you learn how to fade images on mouseover in WordPress. You may also want to see our guide on how to choose the best web design software, and our expert picks of the best WordPress popup plugins.

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

    The post How to Fade Images on Mouseover in WordPress (Simple & Easy) first appeared on WPBeginner.

  • How to Add WhatsApp Chatbox and Share Buttons in WordPress

    Do you want to add WhatsApp chatbox and share buttons in WordPress?

    WhatsApp is one of the most popular messaging platforms and has about 2.2 billion users worldwide. Adding a Whatsapp share button will allow you to connect with the customers and build user engagement, and adding a chatbox button will let users message you directly through your website.

    In this article, we’ll show you how to easily add a WhatsApp share button in WordPress.

    How to add WhatsApp share button in WordPress

    Why Add a WhatsApp Button in WordPress?

    WhatsApp is an instant messaging app that allows people worldwide to easily contact each other.

    Adding a WhatsApp share button to your WordPress website will allow visitors to easily share your content with their contacts.

    Moreover, you can also add a WhatsApp chatbox enabling users to have a direct conversation with you.

    For instance, if you have an online store, then a WhatsApp chat button can be used by customers to make product queries without having to fill out any forms or go through customer support.

    It can result in increased user engagement and lower cart abandonment rates.

    Having said that, let’s see how you can easily add a WhatsApp share button in WordPress.

    Method 1: Add a WhatsApp Share button in WordPress

    If you want to add a WhatsApp share button to your website, then this method is for you.

    First, you need to install and activate the Sassy Social Share plugin. For more instructions, please see our beginner’s guide on how to install a WordPress plugin.

    Upon activation, you need to visit the Sassy Social Share menu from the admin sidebar.

    From here, you need to switch to the ‘Standard Interface’ tab at the top.

    Then, you need to scroll down to the ‘Select Sharing Services’ section and simply check the box next to the WhatsApp option.

    Check WhatsApp share option

    You can also add the Share button for other social media platforms including Facebook, Instagram, Pinterest, Twitter, and more.

    Once, you’re done, don’t forget to click on the ‘Save Changes’ button to store your settings, and then you can head to the ‘Theme Selection’ tab.

    From here, you can customize the share buttons by changing their size, shape, logo or background color, and more. It’s a good idea to go with the WhatsApp brand colors for the share button so that users will recognize it more easily.

    Customize the WhatsApp share button

    Once you are finished, don’t forget to click on the ‘Save Changes’ button to store your settings.

    You can now visit your website to see your WhatsApp share button in action.

    Here is how it looked on our demo website.

    WhatsApp Share button

    Don’t want to add WhatsApp button to every page? Don’t worry, the plugin also allows you to easily add it to single posts and pages as well.

    Adding WhatsApp Share Button in Block Editor

    If you only want to show the WhatsApp share button on specific posts and pages, then first you need to turn off the global display of sharing buttons.

    To do that, simply go to the Sassy Social Share page in the WordPress admin sidebar and switch to the ‘Standard Interface’ tab.

    Next, you need to uncheck the box for the ‘Enable Standard sharing interface’ option.

    Disable standard buttons

    Next, switch to the ‘Floating Interface’ tab.

    From here, uncheck the box next to the ‘Enable Floating sharing interface’ option.

    Disable floating buttons

    Now that you have disabled the standard and floating social sharing buttons, you go ahead and WhatsApp share button to any page or post on your website using a shortcode.

    Simply open the post or page where you want to display the WhatsApp share button in the content editor, or you can just create a new one.

    From here, simply click on the Add Block (+) button at the top left corner and search for the ‘Shortcode’ block. After that, simply add the block to the page.

    Add shortcode in the block editor

    Next, you need to copy the following shortcode and paste it into the ‘Shortcode’ block.

    [Sassy_Social_Share]
    

    Once you’re done, simply click on the ‘Publish’ or ‘Update’ button to store your changes. Your WhatsApp Share button will look like this.

    WhatsApp share button on a page

    Adding WhatsApp Share Button as a Widget

    To add the WhatsApp share button to the sidebar of your website, you need to visit the Appearance » Widgets page from the admin sidebar.

    From here, simply click on the Add Block (+) button at the top left corner and locate the ‘Shortcode’ block.

    Next, you need to add the ‘Shortcode’ block to the sidebar.

    WhatsApp share button as a widget

    After that, simply copy and paste the following shortcode into the block.

    [Sassy_Social_Share]
    

    Next, click on the ‘Update’ button to store your settings.

    This is how your WhatsApp share button will look once it’s added to the website sidebar.

    WhatsApp share button in the sidebar

    Adding the WhatsApp Share Button in the Full Site Editor

    If you’re using a block theme, then you’ll be using the full site editor and won’t have access to the ‘Widgets’ page.

    First, you need to visit the Appearance » Editor option from the admin sidebar to launch the full site editor.

    Next, you need to click on the ‘Add Block’ (+) button at the top of the screen and add the ‘Shortcode’ block to any suitable place on your website.

    After that, add the following shortcode to the block.

    [Sassy_Social_Share]
    
    Add WhatsApp share button in Full site editor

    Once, you’re done, click on the ‘Save’ button at the top.

    This is how the WhatsApp share button looked on our demo website.

    WhatsApp share button preview in FSE

    Method 2: Add a WhatsApp Chatbox Button in WordPress

    This method allows you to add a WhatsApp chatbox button in WordPress.

    This means that when a user clicks on the WhatsApp chat button, they’ll be able to send you a direct message on your WhatsApp phone number.

    Note: You won’t be getting any messages directly inside your WordPress dashboard, but you will be able to chat like normal in the WhatsApp mobile app, web interface, and desktop software.

    First, you need to install and activate the Click to Chat plugin. For more instructions, see our step-by-step guide on how to install a WordPress plugin.

    Upon activation, you need to head over to the Click to Chat menu item that has been added to your WordPress admin dashboard’s sidebar.

    From here, you need to start by typing your business phone number in the ‘WhatsApp Number’ field.

    This will be the phone number where you’ll receive messages from users.

    After that, you need to type a simple message in the ‘Pre-Filled Message’ field. This will be the default message that will be displayed in your WhatsApp chat window.

    Provide your WhatsApp phone number

    Next, you need to scroll down to the ‘Style, Position’ section.

    You can start by choosing a style for your WhatsApp chatbox from the dropdown menu. By default, this plugin offers about 8 different styles. Simply choose the one that you prefer.

    Select a style for the WhatsApp chat box

    After that, you need to scroll down to the ‘Position to Place’ section.

    From here, you can choose the position and size of your chatbox from the dropdown menus.

    Select the position of your chatbox

    Next, you need to go to the ‘Display Settings’ section.

    Here, you just need to check the ‘Global’ box next to the options where you want to display your WhatsApp chatbox.

    For instance, if you want to display the chatbox on your posts, pages, and categories pages, you need to check the ‘Global’ option.

    You can also choose the ‘Hide’ option if you don’t want to display the WhatsApp chatbox on a certain page.

    Check the Global box

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

    Now, you need to head over to the Click to Chat » Greetings page to select a Greeting dialog from a dropdown menu.

    This greeting dialog will be shown along with the WhatsApp button on your page.

    Choose a Greeting dialog from the dropdown menu

    Once you’ve made your choice, you will need to type the content for the header, main content, and call to action of your greeting dialog.

    After that, scroll down to the ‘Customizable Design’ section.

    Type content for the greeting dialog

    Once here, you can choose the background colors of your main content, header, and message box.

    After that, simply click the ‘Save Changes’ button to store your settings

    Choose background color for the greeting dialog

    Next, you need to visit your website.

    By default, this is how your WhatsApp chatbox will look like.

    WhatsApp chatbox on a website

    Now, we will show you how you can easily add the WhatsApp chat button in the block editor, as a widget, and in the full site editor.

    Add the WhatsApp Chat Button in the Block Editor

    You can easily add the WhatsApp button to a specific page or post on your WordPress website using the block editor.

    For this tutorial, we will be adding the WhatsApp button to a page.

    First, you need to go to the Pages » Add New page from the admin sidebar.

    This will launch the block editor.

    Now, you need to click the ‘Add Block’ (+) button at the top left corner of the screen and click on the ‘Shortcode’ block.

    Add shortcode in the block editor

    Once the ‘Shortcode’ block is added, you need to copy and paste the following shortcode into the block.

    [ht-ctc-chat]
    

    After that, simply click the ‘Publish’ button at the top.

    This is how the WhatsApp button looked on our demo website.

    WhatsApp button on a page

    Adding the WhatsApp Chat Button as a Widget

    In this method, we will show you how to easily add the WhatsApp button as a widget in the sidebar of your website.

    First, you need to head over to the Appearance » Widgets page from the WordPress sidebar.

    Once there, simply click on the ‘Sidebar’ tab to expand it and then click the ‘Add Block’ (+) button at the top.

    Next, simply locate and add the ‘Shortcode’ block to the sidebar.

    Add the shortcode block in the sidebar

    Now, simply copy and paste the following shortcode into the block.

    [ht-ctc-chat]
    

    Finally, don’t forget to click the ‘Update’ button to store your settings.

    This is how the WhatsApp button looked after being added to the sidebar on our demo website.

    WhatsApp button in sidebar

    Adding the WhatsApp Chat Button in Full Site Editor

    If you’re using a block-based theme with a full site editor, then this method is for you.

    First, head over to the Appearance » Editor page to launch the full site editor.

    Once there, simply click the ‘Add Block’ (+) button at the top left corner of the screen.

    Now, simply locate and add the ‘Shortcode’ block to your preferred place on the site.

    Add the shortcode block in the FSE

    Once the block is added, simply copy and paste the following shortcode into the block.

    [ht-ctc-chat]
    

    In the end, don’t forget to click the ‘Update’ button at the top to save your changes.

    This is how the WhatsApp button looked on our site.

    WhatsApp button in FSE

    We hope this article helped you learn how to add a WhatsApp share button in WordPress. You may also want to see our top picks of the best social media monitoring tools for WordPress users, and our beginner’s guide on how to build an email list.

    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 WhatsApp Chatbox and Share Buttons in WordPress first appeared on WPBeginner.

  • How to Easily Import Google Docs to WordPress (4 Ways)

    Are you looking for a way to easily import Google Docs to WordPress?

    You may prefer to write your posts in Google Drive, but importing that content into WordPress isn’t straightforward. If you try to copy and paste a Google Doc into WordPress, then you might get lots of unwanted HTML tags, and sometimes you may even lose all the original formatting.

    In this article, we will show you how you can easily add Google Drive documents to your WordPress website.

    How to easily import Google Docs to WordPress

    Why Import Google Docs to WordPress?

    You may prefer to write blogs in Google Docs, rather than in the WordPress post editor.

    If you accept guest posts in WordPress, then you might even ask authors to send their work as a Google Doc, rather than giving them access to the dashboard by allowing user registration in WordPress.

    However, when it’s time to import the document from Google Drive to WordPress, you may run into some problems. If you copy/paste the Google Doc’s text directly into the WordPress editor, then it can add extra tags, particularly <span> and <font tags> tags.

    You may also get unwanted line breaks and lose some of the original Google Doc formatting. This means you’ll need to manually go through each post and fix these problems, which can take a lot of time and effort.

    Unwanted HTML tags and WordPress in the code editor

    With that being said, let’s see how you can easily import Google Docs to WordPress without any formatting problems or extra code.

    Simply follow the quick links below to jump straight to the method you want to use.

    Method 1. Using the Copy/Paste Method (Quick and Easy)

    If you regularly import Google Docs to WordPress, then we recommend taking the time to set up a WordPress plugin mentioned in our other methods.

    However, if you simply want to import a single document, then you can always use another web tool to help make sure the document is clean and ready to go.

    This typically involves copying the text from your Google Doc into a third-party app or online service. Often, this removes the unwanted tags and formatting errors.

    You can then go ahead and copy the text from the middleman app or online service, and paste it into the WordPress block editor.

    This is a workaround rather than a fix, and the results can sometimes be unpredictable. There’s always a chance your chosen middleman might remove some errors, and not others. It may also add its own code, which can cause common WordPress errors.

    However, you won’t need to set up a new plugin or service. With that in mind, this is a good option if you simply want to import a small number of Google Docs into WordPress.

    There are lots of different services you can use, but we recommend using Grammarly.

    Grammarly does a great job of preserving the formatting from Google Docs, while removing unwanted HTML tags. It’s also an online service, so you can access it from any place that has an internet connection.

    As an added bonus, Grammarly will highlight any spelling mistakes, typos, and punctuation errors. It can also suggest ways to improve your writing by changing the tone, clarifying confusing text, and much more.

    In this way, you can improve the quality of your writing before importing it into your WordPress website. Just be aware that Grammarly doesn’t support images, so you’ll need to upload any image files separately using the WordPress media library.

    If you don’t already have a Grammarly account, then you can head over to the website and click on the ‘Get Grammarly It’s Free’ button.

    Registering for a Grammarly account

    You can then sign up for Grammarly using an existing Google, Facebook, or Apple account. Another option is to type in your email address, and then create a password and username.

    After creating an account, you’ll be taken to the the Grammarly dashboard. To import a Google Doc, go ahead and click on ‘New.’

    Creating a new document in Grammarly

    This opens the Grammarly editor.

    In a new tab, open the Google Doc that you want to import into WordPress and copy all of its text. You can then paste this content into the Grammarly editor.

    Pasting a Google Doc into the Grammarly writing assistant

    Grammarly will highlight any problems with your text and show its recommendations in the right-hand menu. It’s a good idea to read through this feedback and optimize your post before moving onto the next step.

    When you’re ready to import the Google Doc into WordPress, go ahead and copy the text in the Grammarly editor.

    How to copy Google Drive content into an online middleman

    Now, switch over to the WordPress dashboard and open the post or page in where you want to import the Google Doc.

    After that, simply go ahead and paste the content into the content editor.

    Importing a Google Doc into WordPress using copy and paste

    Grammarly does a good job of removing unwanted HTML tags while preserving the Google Drive formatting. However, we still recommend looking through the page’s code, to make sure there aren’t any problems.

    This is very easy to do using the WordPress code editor, that’s built right into Gutenberg.

    To access it, just click on the three-dotted icon in the upper-right corner of the screen, and then select ‘Code editor.’

    Opening the WordPress code editor

    You can now delete any unwanted HTML tags or errors from the post.

    When you’re happy with how the page looks, go ahead and click on the ‘Update’ or ‘Publish’ button to make the content live.

    Removing HTML tags from an imported Google Doc

    There are other tools that you can use for this such as StripHTML, but this tool and many others you can find on line will remove all code and return plain text.

    That’s why we recommend using Grammarly for the best results at preserving rich formatting.

    Method 2. Download the Google Doc as a Web Page (Imports Text and Images)

    Copying and pasting Google Drive documents into a middleman service like Grammarly is quick, but it can give unpredictable results. Another option is to download the Google Doc as a web page, and then import the file into WordPress.

    This tends to be more predictable, and once again you don’t have to configure a separate plugin or service.

    This method also pastes any images from the original Google Doc into the page or post, along with the text.

    However, we recommend ignoring this feature and instead adding any image files separately using the WordPress media library. This allows you to set the image caption and image alt text for each file, which makes it easier to re-use the images across your website.

    To download a Google Doc as a web page, open the document in your Google Drive account. Then, click on ‘File’ in the toolbar, followed by ‘Download’ and ‘Web Page.’

    Downloading a Google Doc as a web page

    This will save the Google Doc as a zip archive. The document itself will be an HTML file, and each image will be included as its own file.

    If you’re a Mac user, then simply find the file on your computer, and then either right-click or Control-click it. In the menu that appears, select ‘Open With’ and then ‘Google Chrome.’

    An example of a Google Drive document, downloaded as a zip file

    If you don’t see ‘Google Chrome’ as an option, then click on ‘Other…’ and then choose Google Chrome in the popup that appears.

    If you’re on a Windows computer, then right-click on the folder and select ‘Extract All.’ You can then right-click on the .html file and select ‘Open,’ followed by ‘Google Chrome.’

    This will open a HTML version of your Google Doc in a new tab, with all the correct formatting and images. You can now go ahead and copy this content.

    Importing a Google Drive document into a WordPress website

    With that done, go to the WordPress dashboard and open the page or post where you want to add the content.

    You’re now ready to paste the Google Doc into WordPress.

    Pasting a Google Doc into a WordPress blog or website

    Most of the time, this should keep all the formatting in place, but it’s still a good idea to look through the post’s code for any errors. You can open the WordPress code editor by following the same process described above.

    If you want to use any images in the page or post, then you can now add them manually using the WordPress media library. For step-by-step instructions, please see our guide on how to add images in the WordPress block editor.

    When you’re ready to make the document live on your WordPress blog, simply click on the ‘Update’ or ‘Publish’ button.

    Method 3. Using the Mammoth .docx Converter Plugin (Recommended)

    If you need to import lots of Google Docs into WordPress, then it’s well worth installing a separate plugin.

    We recommend Mammoth .docx converter as it takes all the formatting and images from a Google Doc and converts it into error-free HTML code.

    If the Google Doc has any images, then Mammoth will import them into WordPress automatically, so this is also a great choice if you want to transfer images.

    Just be aware that Mammoth uses the image’s original filename, so you may want to rename the images before adding them to the Google Doc and starting the import.

    With that done, you’ll need to install and activate the Mammoth plugin. If you need help, then please see our guide on how to install a WordPress plugin.

    To import a document using Mammoth, start by opening it in your Google Drive. In the toolbar, select ‘File.’

    In the dropdown menu that appears, click on ‘Download’ and then ‘Microsoft Word (.docx).’ You won’t need to open this document, so you don’t need Microsoft Word.

    Downloading a Google Doc

    Google will now download the file to your computer as a .docx file.

    In the WordPress dashboard, open the page or post where you want to import the Google Doc. Directly beneath the editor, you’ll see a new Mammoth .docx converter section.

    You can now go ahead and click on the ‘Choose file’ button.

    Importing a Google Doc into WordPress

    In the popup, select your .docx file and then click on ‘Open.’

    Mammoth will now import all the content from the Google Doc. By default, Mammoth will display this content in its ‘Visual’ view, which is similar to how it will look on your website.

    Importing the content from a Google Doc into WordPress without errors

    If you want to check the code for errors, then simply click on the ‘Raw HTML’ button.

    You can now make any changes to the post’s HTML.

    Importing a Google Drive document using HTML code

    When you’re happy with how the content looks, you can add it to the page or post by clicking on the ‘Insert into editor’ button.

    Mammoth will now go ahead and add the content to the main post editor. If you’re happy with how it looks, then click on ‘Publish’ or ‘Update’ to make the content live on your website.

    Method 4. Using Wordable (Import Google Docs With a Single Click)

    Do you want to import lots of Google Docs into WordPress?

    You might have a team of writers who all use Google Drive, or accept posts from guest bloggers. You might even have an entire catalog of Google Docs that you want to import into a new WordPress website.

    If you need to transfer dozens or even hundreds of documents, then you can use Wordable. This service lets you fine-tune how Wordable imports the Google Doc’s text, images, videos, and more.

    After creating the first import, you can save your settings as a template. This allows you to transfer any future Google Docs with a single click, which will save you a ton of time.

    You can import 5 documents per month using the free Wordable plan, so you can try the service before you buy. If you need to move more documents, then you can upgrade to any of the premimum Wordable plans.

    Connect Wordable to Your WordPress Website

    The easiest way to connect Wordable to your WordPress website is by installing and activating the Wordable plugin. If you need help, then please see our guide on how to install a WordPress plugin.

    Upon activation, go to Settings » Wordable in the WordPress dashboard.

    Connecting Wordable to your WordPress website

    If you already have a Wordable account, then you can go ahead and select ‘Click here to connect to your Wordable account.’ This opens a popup where you can type in your Wordable email address and password.

    If you don’t have a Wordable account, then click on the ‘Sign up now’ link instead. This opens a new browser tab where you can select ‘Signup with Google Drive.’

    Creating a Wordable account

    Wordable needs permission to see, edit, create, delete, and download your Google Drive files. To grant these permissions, simply check all the boxes on the ‘Wordable wants access to your Google Account’ page.

    After that, click on the ‘Continue’ button.

    Giving Wordable access to your Google Drive

    After creating an account, Wordable will send an email to your Google address.

    Open the email, and then click on the following link: ‘Please confirm your account email now to get started.’

    Confirming your Wordable Google Doc account

    After that, go to Settings » Wordable in the WordPress dashboard and select ‘Click here to connect to your Wordable account.’

    Then, simply refresh your WordPress dashboard. You should now see an ‘Export Your First Document’ button, which means WordPress is connected to your Wordable account.

    Connecting a Wordable account to a WordPress website

    Select a Google Drive Document or Folder

    To import a document, go ahead and click on the ‘Export Your First Document’ button. This opens your Wordable account in a new browser tab.

    Your next task is finding the document or folder that you want to import.

    If you select a folder, then you can still choose exactly which Google Docs to transfer, and which to ignore, so you won’t be forced to import the entire folder.

    If you want to search for a folder, then simply open the dropdown menu next to your email address and select ‘Folders.’

    Searching for a Google Doc using Wordable

    After that, type the name of the file or folder into the ‘Search’ field. Another option is to paste the item’s link directly into the ‘Search’ field.

    To add a document to the import queue, go ahead and click on its ‘Import’ button.

    Importing a Google document into WordPress using Wordable

    After a few moments, the file will appear in the ‘Documents’ section. To add more documents to the queue, just repeat the same process described above.

    If you want to add a folder to the import queue, then click on its ‘+ Source’ button.

    Choosing a source folder in your Google Drive account

    You’ll now see all the Google Docs that are inside that folder.

    After that, it’s time to choose exactly which files you want to export from your Google Drive account. For each file, simply click on its ‘Export’ button, which adds the document to the export queue.

    How to import Google Docs into WordPress

    Configure the Google Doc Export

    When you’re happy with the export queue, it’s time to configure your export. For example, Wordable can turn YouTube links into embedded videos, optimize images, add nofollow attributes to the Google Doc’s links, and more.

    To get started, click on the ‘Export Options’ button.

    Importing Google Docs into WordPress with a single click

    Wordable does a good job of importing Google Docs into WordPress, but it’s still smart to manually check the imported content before publishing it.

    With that being said, we recommend setting the ‘Publish Status’ to ‘Save as Draft.’

    Importing a Google Doc into WordPress as a draft

    The plugin uses the Classic WordPress editor by default.

    However, we recommend using the modern block-based editor instead, so open the ‘Editor’ dropdown and choose ‘Gutenberg.’

    Importing Google Docs into the WordPress block-based editor

    Note: If you leave this set to ‘Classic’ then Wordable will import the document into a new Classic block within the block editor, unless you completely disable it. For more information on this topic, please see our guide on how to keep the classic editor.

    By default, Wordable does some basic cleanup, which typically removes most of the HTML tags and errors. However, there are lots more options you can customize.

    In this guide, we’ll cover some of the major settings, but you can learn more about any setting by hovering your mouse over it, and then reading the tooltip that appears.

    If you write longer documents with lots of headings, then you may want to start by enabling the ‘Table of Contents’ slider. This creates a table of contents using the headings in the Google Doc.

    After enabling this slider, you can choose which headings Wordable will add to its table of contents, using the ‘Depth’ dropdown menu. You can also choose between the numbered and bullet list styles using the ‘List Style’ dropdown.

    Turning a Google Drive document into a table of contents automatically

    If you’re running an affiliate marketing website or regularly link to external websites, then it’s usually a good idea to mark these links as no-follow. A nofollow link tells search engines not to pass any link authority to the website you’re linking to.

    To mark all the Google Doc links as nofollow, enable the following slider: ‘Apply nofollow Attribute to All Links.’ You may also want to enable the ‘Open Links in New Tab’ slider, as this will help keep visitors on your website.

    Automatically marking links as nofollow

    If your document has links to Instagram or YouTube content, then Wordable can try to convert this content into embedded media.

    To use this feature, enable the ‘Replace Embeddable Links’ slider.

    If your Google Doc contains any images, then we recommend scrolling to the ‘Images’ section. Here, you can change how Wordable shows those images.

    For example, you can open the ‘Default Image Alignment’ dropdown and change how Wordable aligns images in the WordPress block editor.

    Setting image attributes automatically

    Wordable can also use the post’s first image as the featured image, which is the post’s primary graphic. Featured images often appear next to the heading on your home page, and may also appear on social media.

    Most popular WordPress themes come with built-in support for featured images, so it’s a good idea to enable the ‘Use Featured Image’ and ‘Default to the First Image’ slider.

    Automatically setting the featured image for an imported Google Doc

    If you prefer to set the featured image manually, then you can disable the ‘Use Featured Image’ slider instead.

    Large images can slow your website, which will have a negative effect on the visitor experience and can even damage your search engine rankings. With that in mind, it’s a bad idea to import images from Google Drive without optimizing them.

    For the best results, we recommend optimizing your images before adding them to your Google Docs. This gives you complete control over the process, so you can reduce the size of your images without losing quality.

    For more information, please see our guide on how to optimize images for web performance.

    If you prefer, then Wordable can optimize your images during the import process. If you want to try this automatic optimization, then click to enable the ‘Compress Images’ slider.

    You can then choose whether Wordable should perform lossless or lossy compression. Lossless is a better choice if you want to preserve image quality, while lossy will save you more space but may lose some quality.

    Optimizing images automatically using Wordable

    There are more settings you can look at, but this should be enough to configure the import.

    When you’re happy with the changes you’ve made, go ahead and click on ‘Export Now.’

    Exporting text and images from your Google account

    At this point, you can save the settings as a template that you can apply to future imports.

    In the following image, we simply need to click ‘One Click Export’ to apply the template and import the document.

    Importing Google documents into WordPress using a single click

    This can save you a ton of time, especially if you use the same settings over and over.

    To create a template, type a title into the ‘Template name’ field and then click on the ‘Enable One-Click Exports’ button.

    Creating a template for your imported WordPress pages and posts

    If you don’t want to use templates, then click on the following link instead: ‘I prefer seeing this screen every time.’

    No matter what you click, Wordable will start exporting the Google Document.

    After a few moments, go to Posts » All Posts in the WordPress dashboard and you’ll see the Google Doc as a new draft.

    An example of an imported Google Drive document in WordPress

    To import more Google Drive documents into WordPress, simply follow the same process described above.

    We hope this article helped you learn how to easily import Google Docs to WordPress. You may also want to check out how to create a file upload form in WordPress and our list of 24 expert tips to speed up WordPress performance.

    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 Import Google Docs to WordPress (4 Ways) first appeared on WPBeginner.