Tag: Product Guides

How to Upscale Images in WordPress
When building websites in WordPress, high-quality images are crucial to the design. With high-resolution displays being the new norm, your images must have the right size and resolution for all devices. But what happens when you are stuck using an image that’s not big enough or looks blurry? You can try to find a new image or simply use an image upscaler. With the power of AI, a good image upscaler can magically transform your small, pixelated images into high-resolution masterpieces in a few clicks. In this guide, we’ll learn more about image upscaling, upscale some images on WordPress, and explore a variety of image upscalers you can use in future projects.

What is Image Upscaling?

Image upscaling is the process of increasing a digital image’s size, resolution, or dimensions without losing image quality. This can be done using AI technology that uses deep learning, neural networks, and AI algorithms to enhance the image with the additional pixels it needs. It is a powerful solution for web designers looking to enlarge and enhance images while maintaining a quality that will not degrade the initial provided image.

Popular image upscalers like Topaz Photo AI can do this outside of WordPress. In the above image, we can see that the quality of the initial image is subpar. There’s some pixelation; the image appears blurry and can’t be used at a higher resolution. However, the second image is much clearer: we can see the details within the features, the image colors are brighter, and the final product can be used in a larger and smaller form. This is an excellent example of the benefits of upscaling images.

Why You Need to Upscale Images in WordPress

In WordPress, once your image is uploaded, the original (or intrinsic) size and dimensions of the image are set. Sure, you can make the image smaller if you want. In fact, WordPress will create smaller versions for you to help render the right size on your website. But making them larger is a different story. If you want to make it larger, you can’t just increase an image’s dimensions in the Media Library or manually give it a larger width and height on your page. This will stretch the images and their pixels beyond their intrinsic value and render them with less quality and blur.

To make an image larger in WordPress, you need an image upscaler. Upscaling uses AI to ensure that the enlarged image maintains quality while increasing its size and dimensions. While the image’s dimensions are increased, the quality of the image is maintained and often enhanced with a result that often looks even better than the original. When working in WordPress, having this handy tool available saves you from having to search for better high-quality images or use other third-party tools for upscaling.

Benefits of Upscaling Images for WordPress

Many benefits come with upscaling images for your WordPress website:
1. Improve Your Website’s Visuals: Upscaling your images in or for WordPress provides a better web experience for your viewers. Good visuals make a great website. Using crystal clear images on your website is an easy process when using an image upscaler to adjust photos on your website.
2. Zooming and Panning in eCommerce: eCommerce plugins like WooCommerce have many features, including zooming and panning product photos. However, if you have poor-quality photos, this doesn’t look good for your brand. Being able to upscale images in WordPress affords you the ability to bring this feature to your WordPress site with high-quality images.
3. Convenience When Searching and Using Images: With upscaling, you can save time when trying to find high-resolution versions of images in your arsenal. Using image upscalers, you can upscale the image you have on hand instead of searching far and wide for the high DPI version of an image.
4. SEO and User Engagement: Most of the time, large images are a big problem for website performance and page load speed, which isn’t good for SEO. But, as long as your images are optimized, high-quality photos can lead to higher rankings on search engines. Therefore, consider using an AI image upscaler to process images for your WordPress website. Plus, there are more ways AI can help WordPress SEO.
5. Future-Proofing Your Website: Screen sizes and resolutions have increased over the years. From retina to high DPI screens, ensuring your website will look as good today and in future years is imperative. You can remedy this by using image upscaler tools to keep your images looking fresh, regardless of the year people access your website.
Now that we understand how upscaling our images can benefit our WordPress website, let’s explore how we can implement this practically with Divi and Divi AI.

How to Upscale Images in WordPress with Divi AI

Divi, our powerful AI WordPress theme and page builder, ships with a powerful AI assistant for your website called Divi AI. It incorporates various AI features into your WordPress website, including image upscaling. Let’s explore how we can utilize these WordPress tools to enhance the dimensions of our images without compromising their quality.

1. Download and Install Divi and Divi AI

If you’re new to Divi, your journey starts by getting a membership and downloading Divi from your member profile. Then, you can follow this excellent guide showing you how to install Divi. It covers many topics that will help you install Divi on your WordPress website, including downloading the theme’s ZIP file, installing it in WordPress, and authenticating your website with Elegant Themes.

Divi AI is a powerful AI tool that works hand in hand with Divi and the Divi Builder plugin. You’ll have access to Divi AI out of the box with a free trial, and you can upgrade to an unlimited version at any time. This will give you full access to Divi’s AI image generator (and upscaler) as well as Divi AI’s writing assistant for generating content with AI.

Once Divi is installed and activated, and you have procured your Divi AI license, we can start upscaling some images! If you’re already a member of the Divi family, great! We’re happy to have you!

2. Open the Divi Builder and Select Your Image

Whether working on an existing page or creating a page from scratch, the upscaling process with Divi AI is the same. You will edit your image, use the Divi AI upscale command, and then Divi AI will automatically re-insert your image in the same place. Let’s go over how to do that now with a brand-new page in WordPress. From the WordPress dashboard, hover over the Pages menu link. Then, click Add New. This will create a new page for us.

Name your page, then click the purple Use Divi Builder button.

From the three options presented, choose the first choice. Click the blue button that says Start Building, and now, you have a blank slate for upscaling your images.

Divi will automatically create a new section for you in the builder. However, you’ll need to add a new row. Click the two-column row layout from the row modal box to do this.

Next, enter the word “image” into the search box for the Module modal box. Click on the Image Module to add it to the first column in your newly added row.

With our Image Module in place, let’s upload an image from our hard drive to WordPress and upscale it. Inside the Image Module, click the gear icon. This is where the Media Library will open up. You can select an existing photo from your library or upload a new one. We’re going to select an image that’s already in our Media Library.

Once you’ve selected your image, please take note of its dimensions and file size. We’ll use this information later to compare the effects of upscaling images in WordPress with Divi AI. Finally, click the Upload an Image button to add your image to your page. Now, we can run the image upscaler present in Divi AI.

3. Upscale Your Images in WordPress with Divi AI

Once our image has been selected in the Divi Image Module, we can activate Divi AI. Click on the Divi AI icon next to the image’s settings icon.

Then select the Upscale feature. Finally, choose between the 2x and 4x options for your upscaling.

The beauty of using Divi AI for your WordPress upscaling needs is that you never have to leave the WordPress dashboard. There’s no need to open a program on your desktop or visit an external website to upscale your image. You can upscale your image within the Divi Builder without requiring additional tools or downloads.

After a short wait, you’ll notice that your page looks the same. But is it? Let’s take a deeper look.

4. Comparing Our Original and Upscaled Images

Click the gear icon to access the Media Library and see what Divi AI has done under the hood.

The first thing we notice is that our original image has been duplicated. Divi AI is smart enough to back up our image before performing upscaling tasks. Next, when we click on our new upscaled image, we notice that its dimensions have changed. It’s now almost double in size, which aligns with the 2x upscaling option we selected in Divi AI. However, its file size is still manageable and light.

Furthermore, if you compare both images, you can see a noticeable difference in the quality of our upscaled image.

Our upscaled image is sharper, and the colors in our new photo are more vibrant. Not only does the Divi AI increase the dimensions while maintaining the quality of our upscaled images, but it also refines them. Let’s look at the new statistics of our images from the Media Gallery.

Our original image was 510px by 335px. It was also 178kb. While still a light image, our upscaling can help us be more optimized. Divi AI was able to not only almost double the size of our image but it was also able to compress the image without decreasing the quality of the image.

Additionally, when you look at the image in the Divi Builder, even though the size of the image has changed, its quality has increased alongside the change in dimensions:

Image 1 is our new and improved image, and image 2 is our original image. Both of these images are within a one-column row layout in Divi. We can see that image 1 is larger. However, when you look closer, you can see that the image is sharper, the colors are more precise (notice the hair and nails), and the skin on the model has improved. Even though the original image is smaller, it is still not as straightforward as our upscaled image.

This gives us better images overall for our web pages without leaving the WordPress backend or using external tools. It’s clear that when you choose to use Divi AI as your WordPress image upscaler, you will get fast, easy, and excellent results for the photos and images on your website.

Other Image Upscaling Tools for Your WordPress Website

While Divi AI is an excellent tool for upscaling images in WordPress, you may want additional upscaling capabilities that Divi AI may not have… for now. With this in mind, here are other image upscaling tools that you can use outside of WordPress for your website:
1. Gigapixel AI by Topaz Labs: A light and easy-to-use online platform, this image upscaler supports multiple image formats, enhances image quality, and can process your images in seconds.
2. Upscale.media: A light and easy-to-use online platform, this image upscaler supports multiple image formats, enhances image quality, and can process your images in seconds.
3. Icons8 Smart Upscaler: Another online platform, this upscaler has a simple interface that can upscale images up to 7680px. It also comes with an API, and its desktop application for Mac can also remove backgrounds.
4. Zyro AI Image Upscaler: If you’re a fan of the Adobe Creative Suite, Adobe Firefly is right up your alley. Seen powering industry-standard tools like Lightroom and Photoshop, refine color, show off deep details, and more with this creative, generative AI engine.
5. Adobe Firefly: If you’re a fan of the Adobe Creative Suite, Adobe Firefly is right up your alley. Seen powering industry-standard tools like Lightroom and Photoshop, refine color, show off deep details, and more with this creative, generative AI engine.
These external image upscalers require you to perform upscaling tasks outside of WordPress and then import your images into the Media Library. However, using a tool like Divi AI is more convenient and saves you valuable time. As such, its a great toool for an efficient web designer.

Conclusion

Image upscaling is a necessary part of preparing your images for the web. Instead of using tools outside your WordPress installation, you can now find image upscaling capabilities through Divi and Divi AI. Performing image upscaling directly within the Divi Builder helps you refine your process and stay on track when building your websites.

However, suppose you’re looking for a desktop application or an API to give you more image upscaling power. In that case, other AI upscale tools are available that you can use in conjunction with WordPress. Have you tried to upscale your images in WordPress? What tool did you use? Have you tested Divi AI’s upscaling feature yet? Let us know in the comments; we’d love to hear from you!

Finally, check out our top tools collection for a full deep dive into the various AI tools you can use with your WordPress site. There, you’ll find an arsenal of platforms and programs that you can use on your WordPress website. From photo enhancers to AI design tools, we’ve gathered the best in the business regarding AI and WordPress!

The post How to Upscale Images in WordPress appeared first on Elegant Themes Blog.
03.10.2023
How to Make a WordPress Ecommerce Website (2023 Easy Guide)
You already know that WordPress is a powerful platform for content, but were you aware that it’s also one of the best eCommerce solutions? This guide will walk you through each step to create a successful eCommerce website with WordPress. From domain selection to hosting, installation, and essential plugins, we’ve got you covered.

Why Use WordPress to Make an eCommerce Website?

WordPress shines as the premier content management system (CMS) used to build websites of all kinds.

The software is open-source and free to use, developed by and supported by a large community of volunteers. This makes the platform extremely flexible, giving you more control over your website functionality and allowing you to build an online store using countless eCommerce plugins and themes available. Although WordPress is free, there are common website expenses outside WordPress, including hosting, domain registration, premium plugins, and themes. But these prices are the same or better than other major eCommerce platforms, all things considered.

WooCommerce: A Powerful eCommerce Solution for WordPress

What makes WordPress equipped to handle your next eCommerce website? WooCommerce.

WooCommerce is the go-to WordPress solution for eCommerce. The WordPress editor is seamlessly integrated with WooCommerce and includes all the WooCommerce Blocks needed to build your store with a drag-and-drop interface. And it is simple enough for novice web admins to learn how to use it. It also has a plethora of add-ons available to help you achieve anything you need from it. It also gives users detailed dashboards and a convenient mobile app that allows you to keep tabs on your store’s performance from anywhere at any time.

Other benefits of using WooCommerce include:
- WordPress Hosting providers like Siteground are tailored to WooCommerce sites for easy setup and optimal performance.
- More customization and control with a variety of plugins to add the functionality you need.
- More cost-effective than other solutions that require recurring monthly payments and additional fees.
- More control over security than other solutions that have built-in security that cannot be optimized.
WooCommerce Alternatives to Compare

Selecting the ideal eCommerce platform is a pivotal decision. In fact, there are some that may benefit from using other website builder platforms (outside of WordPress) like Shopify, Squarespace, or Wix. And there are WordPress membership plugins like MemberPress that offer standalone options for eCommerce. To help you decide, we’ve created comparison guides between WooCommerce and other leading website builders for eCommerce for you to dig deeper into.
But, we’ll assume that you’ll see the exceptional value in WordPress + WooCommerce and continue to the next step of how to build an eCommerce site with WordPress.

How to Setup Shop with WordPress (5 Steps)

1. Choose a WordPress eCommerce Hosting Provider + Registrar

Selecting a hosting provider specializing in WordPress is pivotal for your eCommerce website’s performance and security. SiteGround is a top choice, finely tuned for WordPress and WooCommerce platforms.

Dive into our in-depth SiteGround analysis to explore its myriad features. SiteGround offers complimentary CDN, no-cost SSL, and email account governance in its hosting packages.

For alternative hosting solutions, consider our roundup of the fastest WordPress hosts or the best all-around hosting services. Quality hosting becomes doubly important when running a WordPress eCommerce site since it needs to be fast with around-the-clock uptime.

Install WordPress

Navigate to SiteGround’s Site Tools dashboard. For other ways to install WordPress, read our definitive WordPress installation guide.

After signing into your SiteGround account, start the installation by clicking the “Set Up Site” button on your dashboard.

Choose the domain type for your WordPress eCommerce site. Opt for “Temporary Domain” if you wish to build before buying your domain.

For those eager to secure a domain upfront, follow this guide to register a domain. Click “New Domain,” find your ideal domain name, and proceed with the WordPress setup.

Click “Continue” to advance with the domain option that you’ve chosen.

Then, select “Start New Website” to continue.

Choose “WooCommerce” to ensure WordPress comes pre-installed with WooCommerce to make setup a bit quicker.

Configure your admin login credentials. Keep this information secure by following our password management tips. Click “Continue” to move forward.

Finally, hit the “Finish” button to set up WordPress + WooCommerce for your new WordPress eCommerce website.

Access your new WordPress dashboard by clicking “Log in Admin.”

2. Configure WordPress

You’ve got your hosting and maybe even a domain. Now, let’s set up your WordPress site for eCommerce.

Adjust WordPress Settings

You’ll find the settings you need under Settings in the sidebar of your admin dashboard.

Need more help? Check out these guides for each settings page to configure your eCommerce website the way you need it:
- General WordPress settings (where you turn on HTTPS)
- Writing settings
- Reading settings (where you make a static homepage)
- Comments settings
- Media settings
- Permalink settings (SEO tip – how permalinks help SEO)
- Privacy settings
3. Pick a WordPress eCommerce Theme

Now, let’s choose a WordPress theme that’s great for eCommerce. We recommend using our Divi Theme. Divi is a top pick because it is a powerful page builder that works seamlessly with WooCommerce. It’s easy to use and makes your store look good.

Why Divi is a good choice:
- Has native WooCommerce Blocks to fully customize the design of your store.
- Divi has ready-to-use store templates
- Easy design tweaks with Divi’s visual builder
- Boost your store with Divi’s marketing tools
- Good customer support when you need help
- Divi and WooCommerce work well together
- Optimize product images and descriptions withÂ Divi AI (separate charge)
For other options, you can check out these top WooCommerce WordPress Themes.

How to Add Divi to Your WordPress Store

First, get Divi from your Elegant Themes membership account after buying a membership. Log in and go to “Themes & Plugins” to download Divi.

In your WordPress dashboard, go to Appearance > Themes. Click “Upload Theme” and pick the Divi file you downloaded. Then c”Install Now.”

Click “Activate” to make Divi your theme.

Last step: add your Elegant Themes API Key. This keeps Divi updated with new features and security fixes. Grab the Username from your account in the “API Key” section.

“Generate New API Key” for your site. Give it a label so you know which site it belongs to. Copy the Key.

To add the API Key, go to Divi > Theme Options > Updates. Put in your Elegant Themes API Key (generate a new key for each site you create) and Username, then click “Save Changes.”

If you want to learn more about adding themes, check out this theme installation guide. But we think you’ll like using Divi for your WordPress eCommerce website.

4. Make Your WordPress eCommerce Store

You’ve done the basic setup. Now, let’s dig into creating your WordPress eCommerce website. This means setting up WooCommerce, adding products, and choosing how people will pay you.

This is where the fun starts!

WooCommerce Setup Wizard

The WooCommerce setup wizard makes getting your WordPress eCommerce site ready easy. If your host didn’t install WooCommerce for you (Step 1), check out our WooCommerce setup guide to get it added to your website.

Click “Home” under WooCommerce to start the wizard.

The wizard will ask for your store info, like your address and email.

Select the industry and product types that best describe your store.

Choose what your store needs. Checking certain boxes might add extra plugins to your site.

Note: Some plugins cost money. There are also free ones available. Check out our list of the best membership, booking, and free WooCommerce plugins to see how plugins can extend your eCommerce site.

The wizard will ask a few more questions about your store.

Last step: pick any extra plugins you may want. See our Jetpack and MailPoet reviews to see if those tools are worth it for you at this point. But if you anticipate needing to collect taxes, take credit card info, and handle shipping, those free plugins are worth it.

Now, you can tweak more settings in WooCommerce.

WooCommerce Settings

Ecommerce settings can be tricky. But WooCommerce makes it easier. You can control:
- General Settings for money, products, and checkout
- Product Settings for how items look and stock levels
- Shipping Settings for delivery choices and costs
- Payment Settings for how customers pay
- Account Settings for signups and privacy
- Email Settings for messages from your store
- Advanced Settings for special tweaks
For more help, see our WooCommerce settings guide, which will walk you through each of these important pages.

Add Product Categories

Categories help people find what they want in your store. For example, if you sell clothes, you could have categories like “Men,” “Women,” and “Kids.” We suggest you make these before adding products.

To add categories, go to WooCommerce > Products in your dashboard. Then click “Categories.” These work just like categories and tags for WordPress posts.

If placeholder categories exist, you can edit or delete them. When choosing categories and tags, keep your customers in mind. Use intuitive and easy-to-understand terms.

Add Products to Your WordPress eCommerce Store

You can add products individually or all at once with a CSV file.

To add them individually, go to Products > “Add New.”

Enter the product name.

Add a product description and upload your product image.

Next, select a product type. Then, set your item’s price and set your inventory levels. You can also set individual product shipping options. On the right-hand sidebar, set product categories and tags.

When you’re happy, click “Publish.” Add as many products as you want to your store.

Track your product stock with WooCommerce inventory management, and visit our detailed guide about setting up shipping in WooCommerce.

4. Design Your WordPress eCommerce Website

Since you’ve got Divi installed, let’s dive into designing your WordPress eCommerce site. With Divi, one of the best page builders for WordPress, you can design your site without touching code. This includes your product pages, cart, checkout, homepage, and blog.Â Divi’s WooCommerce modules are your go-to tools for building your WordPress store pages.

Add Product Modules to a Page with Divi

Divi has 2000+ pre-made layouts and 300+ website layout packs you can use, making setting up your WordPress eCommerce site quicker.

Open your homepage in Divi and click “Browse Layouts” to see your options.

You’ve got thousands of layouts to pick from. To make it easy, look for ones that say “Shop Page.” Click “Use this Layout” to add it to your page.

The layout will show your products immediately (inside the Woo Products module). You can change how many show up, how they’re sorted, and much more.

What if you want to show only one product? Add a new row and pick “Woo Products” from the WooCommerce modules list.

Design WooCommerce Pages

WooCommerce sets up some basic pages for you that Divi can help you customize:
1. Shop page (where all your products show up)
2. Cart page (shows what’s in your cart)
3. Checkout page (where you pay)
4. My Account page (to manage your account)
5. And more, like pages for product categories and tags
Divi lets you edit each of these page templates on each page using the Divi Builder, or you can create a custom template for these pages using the Theme Builder.

Using the Divi Theme Builder is particularly useful for designing templates for your product pages, product category pages, and other site-wide design elements.

For example, you could download one of our free product page templates from our blog (like this Clothing Store Product Page Template) and add it to the theme builder to have a stunning global template for all your products. Or you can easily create your own product page template from scratch

For more help, check out our guides on making a cart page, setting up a checkout page, and using Divi for WooCommerce pages.

5. Boost Your WordPress eCommerce Site with Plugins and Integrations

Want to know the beauty of WordPress and WooCommerce? You can add hundreds of features with thousands of possible plugins. Free and paid plugins can make your WordPress eCommerce site even better. Let’s look at some must-know categories of WooCommerce plugins.

SEO Plugins

Getting people to your WordPress eCommerce site is obviously important. That’s where SEO plugins like Rank Math SEO come in. They help you make your site more search-engine friendly by adding schema markup, XML sitemaps, and other SEO best practices. There are even WooCommerce SEO plugins that ensure ideal compatibility and functionality.

$Analytics Rank Math Demo WordPress$

For a deep dive, check out our WooCommerce SEO guide. If you’re feeling adventurous, explore these AI-driven SEO tools.

Email Marketing Plugins

Email marketing remains an essential tool for growing an eCommerce store. External services like Mailchimp for WordPress and plugins like MailPoet help you build and manage your email lists.

Use Mailchimp’s WooCommerce Integration to Increase Sales

You can then send general emails as well as eCommerce-specific emails with coupons or abandoned cart emails.

CRO Tools

Conversion is king in eCommerce. Tools like OptinMonster and Bloom can help you get the most from your site by allowing alternate conversion for email signups.

You can also use Divi’s marketing tools to create A/B campaigns on your website and strengthen each landing page over time.

Advertising Plugins

Advertising plugins can integrate seamlessly with platforms like Google Ads and Facebook to drive more traffic. Check out Advanced Ads for more control over your advertising campaigns.

For more WooCommerce plugins, Barn2 and Yith make lots of good options. And don’t forget to check the Divi Marketplace for solutions that work well with Divi.

Conclusion

You’ve gone through the ins and outs of setting up a WordPress eCommerce website. From selecting a hosting provider to configuring WooCommerce and optimizing your site for search engines, you’ve laid the groundwork for a successful online store.

WordPress and WooCommerce together offer a powerful, flexible platform for eCommerce. They allow you to customize every aspect of your store, from product listings to payment options. And with a wide array of plugins, your store’s functionality can expand as your business grows.

As your business scales, our extensive library of guides and reviews is here to support you every step of the way. Dive into our essential guides on how to sell online and master the best website marketing strategies. For tech-savvy insights, explore our reviews of top hosting companies, prime business tools, and standout WordPress plugins.

Featured Image by Julia Tim / shutterstock.com

The post How to Make a WordPress Ecommerce Website (2023 Easy Guide) appeared first on Elegant Themes Blog.
01.10.2023
How to Code in WordPress with AI
In the past, WordPress users without coding knowledge would either spend hours on Google searching for an answer or solicit the help of a professional web developer. With the emergence of artificial intelligence (AI), that is beginning to change. There are quite a few AI code assistant tools out there, but not all of them are geared specifically for WordPress. In this post, we’ll show you how to code in WordPress with AI so you can save your time and hard-earned money for other tasks.

Let’s dive in.

What is AI-Assisted Coding for WordPress?

AI-assisted coding is the use of machine learning generative AI models that aid in creating code for WordPress. Most AI coding assistants let WordPress users describe what they want the code to do by entering a simple text prompt. From there, AI automatically generates the code for you, complete with custom variable names or CSS classes.

Why You Should Code in WordPress with AI

image created with Divi AI

There are several reasons to code in WordPress with AI. First and foremost, it allows novice coders or those with no coding knowledge to add PHP or JavaScript code snippets that change your site’s functionality. Similarly, AI can also generate CSS for you, allowing you to make advanced styling changes to your site’s design elements. Another reason you should consider using AI for coding in WordPress is to troubleshoot errors. If you’ve ever been in a situation where you are seeing the white screen of death or other common errors, AI can help you figure out where the problem is, and help fix it.

What are the Benefits of Coding in WordPress with AI?

image created with Divi AI

There are countless benefits of coding in WordPress with AI. Let’s highlight a few so you will have a better understanding of how AI can help make your life easier:
- Minimal learning curve: When using AI, spending countless hours on PHP tutorials is unnecessary. In fact, it can leave you confused and frustrated. Instead, opt for a bit of AI assistance to help. You’ll likely learn a few things, too.
- Editing theme files: When you’re mainly a web designer, you may not be comfortable editing theme files. With AI, you can put your troubles at ease because a text prompt can help you create those functions.php file hacks you were too afraid to try before.
- Save money: In the past, if you needed to do something that required coding knowledge, you’d either need to learn how to code, which is time-consuming and sometimes expensive, or pay a developer to help. Using AI, you can avoid the middleman and save money for something else, like purchasing essential plugins or a premium WordPress theme.
- Make your site stand out: WordPress users should never be complacent with a cookie-cutter website. The beauty of WordPress is that you can make your site look any way you want. That said, sometimes your site may need a little extra “oomph.” Adding code in WordPress with AI is an excellent way to add animations or other functionalities to make your website unique.
How to Code in WordPress with AI

image created with Midjourney

There are a couple of ways you can code in WordPress with AI. You can use an AI page builder like Elementor to create custom CSS or an AI tool like CodeWP for PHP. As of this writing, no plugin will allow you to code PHP inside WordPress. However, CodeWP was specifically trained using WordPress files and structure, so it knows its stuff. An added bonus is the ability to store snippets in the cloud so you can save them for reuse.

Before you start plugging custom code snippets into your site, you should do one of two things. We recommend either creating a child theme or a staging site. Doing both is a good idea, too. Regardless, your parent theme or live site will be protected from code snippets that could break your website.

Let’s go through the steps you’ll need to set things up and generate code in WordPress.

How to Code CSS in WordPress with AI

Elementor is one of the most popular page builders in the world. In recent months, they joined the AI revolution by offering text, image, and custom CSS generation. It works by activating the edit with AI button in Elementor’s front-end page builder in any module containing text or images.

Generate CSS in Elementor AI

For CSS generation, you’ll have to shell out for a pro license, but you can try Elementor AI text and image generation in the free version. With the pro version activated, hover over a section to reveal the edit section button.

Next, click the advanced icon in the sections’ settings.

Scroll to reveal the Custom CSS tab. Expand the dropdown menu to show the custom CSS box.

Click the edit with AI button above the custom CSS box.

When the dialog box appears, type in a text prompt, such as background color animation 2 colors (1). Then click the generate code button (2).

Elementor AI will get to work generating your code snippet. It could take up to a minute to render. Once complete, you’ll get a preview of your code. If satisfied with the results, click the insert button to add the code into the Custom CSS box.

Once your code is inserted, you can watch the animation live in the Elementor builder.

After your CSS code is live, you can change the colors, animation speed, and make other tweaks to suit your preferences.

If you’d like to easily generate CSS for your web projects with Elementor, you can sign up for a yearly Pro license for $59. Remember, to use Elementor AI’s CSS generator, you’ll need to sign up for a paid plan. Prices start at $2.99 per month for 18,000 credits.

How to Code PHP for WordPress with AI

CodeWP is an AI tool trained specifically using WordPress. It helps you create custom code snippets to extend its functionality or avoid using heavy plugins. When you are ready to implement generated code snippets, you’ll need to install a code snippet plugin, such as WPCode, or create a child theme and copy specific files from the includes folder to place your snippets.

If you’re a Divi user and want to create a child theme, we have a detailed tutorial on the steps you’ll need to take. That said, if you’re a novice user, we highly recommend the snippet plugin route.

Sign Up for a CodeWP Account

If you haven’t signed up for CodeWP, click the Start for Free button.

When the screen refreshes, you can create an account by linking your Facebook profile, GitHub account, or by creating a username and adding your email address.

Browsing the CodeWP Interface

The CodeWP is rather intuitive. You’ll be able to view your snippets, browse public (verified) snippets submitted by other users, get the latest news, and launch several code generators.

For this tutorial, we’ll be working with the free version of CodeWP, which comes with one interface: WordPress PHP. To unlock the others, you must sign up for a pro license.

Generate PHP in CodeWP

To generate your first snippet, click the Generate Code button at the top left of the CodeWP interface.

Next, click the new prompt button to open the text prompt dialog box.

To demonstrate how easy it is to work within CodeWP, we’ll ask it to create a new custom post type for cars and some custom fields we can fill out in the cars post type.

Start by entering the following prompt into the text field:
Create a custom post type called cars and include a taxonomy for vehicle type. Add the following meta fields to the cars custom post type.

integer number meta field called make
integer number meta field called model
integer number meta field called price
integer number meta field called exterior color
integer number meta field called interior color
integer number meta field called seating capacity
integer number meta field called drivetrain
integer number meta field called transmission
integer number meta field called cylinders
integer number meta field called MPG

Finally, click the Generate WP Code button.

After a minute or two, CodeWP will generate your custom PHP code. To use it in WordPress, we’ll need to use the WPCode (or similar) snippet plugin.

Copy the output after the opening PHP tag so we can paste it into WPCode.

Adding PHP Code to WordPress

Bounce back over to your WordPress admin dashboard. If you still need to install WPCode, do that now. If you need guidance on installing plugins, we have a handy plugin installation guide for you to follow.

Navigate to Code Snippets > + Add Snippet (1). From there, click Add Your Custom Code (New Snippet) (2).

By default, WPCode selects auto-insert and sets the location to everywhere, which is what we want it to do. To make your snippet live, select PHP from the dropdown (1) and paste the PHP snippet into the code preview (2). Next, activate the snippet (3), and save it (4).

Once saved, a new post type appears inside the WordPress admin dashboard.

To ensure things are working correctly, hover over the car in the admin panel and click Add New.

Scroll down until you locate the car meta fields. If they are there, congratulations! If not, you can use CodeWP to help adjust the code accordingly.

Final Thoughts on Coding in WordPress with AI

WordPress development is rapidly evolving with the integration of AI. Using tools like Elementor AI or CodeWP, you can forego hours of research or expensive web development services. AI tools designed specifically for WordPress can save money and time and teach even the most novice user how to code. Whether you need to add a custom PHP script or take your site’s design to the next level with CSS, AI coding assistants offer invaluable support.

If you’d like to learn more about what you can do with AI for WordPress, check out some of our other AI-related posts:
Featured Image via Leonid studio /Â shutterstock.com

The post How to Code in WordPress with AI appeared first on Elegant Themes Blog.
30.09.2023
How to Make Your Own AI: A Beginnerâ€™s Guide (2023)
There are many reasons why you may want to make your own AI assistant or Chatbot. Perhaps you wish to create a virtual “second brain” to quickly access stored information. Alternatively, you could aim to assist website visitors or customers in finding the information they seek. You might even desire a personal AI to help organize your life. Regardless of your motivation, constructing an AI is likely easier than you initially thought.

In this article, we show you how you can use readily available technology to create your own AI personal assistant or chatbot. You can even do it for free if your project is small enough.

What is a Personal AI Assistant?

Often, we think of AI in high-tech environmentsâ€”self-driving cars, medical advancements, or algorithmic trading. However, AI is not only useful to massive corporations with their high-dollar R&D budgets. It can be a deeply helpful tool serving individualized needs. And that’s where making your own personal AI assistant comes in.

A personal AI can be as complicated or straightforward to implement as you are willing to tolerate. At the least, you can dial in a solution that performs just like you want. This can mean that an AI responds to you in a certain way or has specialized knowledge that isn’t available to larger LLMs and AI chatbots.

The Basics of AI

At its core, Artificial Intelligence (AI) mimics human cognition to perform tasks ranging from basic problem-solving and planning to speech recognition and natural language processing. These aren’t just programmed actions but learned behaviors through machine learning. To simplify things, AI has two essential components:
1. Data (in the form of words, images, etc.)
2. Algorithms
AI algorithms are advanced functions designed to award specific computational tasks when completed well. This is done through machine learning, where a system can recognize outcomes and apply a pass or fail to those computations (otherwise, humans would have to monitor and respond to billions of rout tasks to train an AI).

AI requires clean data that is consistent enough to draw patterns from. The data must also be as complete, relevant, and unbiased as possible to create an advanced AI worth using.

How to Build Your Own AI in 5 Steps

AI is becoming increasingly accessible to individuals. With the right tools and some know-how, you can create a personal AI assistant specialized for your needs. Here are five steps that will help you build your own personal AI.

1. Identify a Problem Your AI Should Solve

Our first step for creating your own AI is to identify what you want your AI assistant to achieve. Problem identification will guide every subsequent step, from data collection to deployment. An excellent way to figure out what problems to solve with AI is by looking at typical use cases where different AI systems are used.

Use Cases for AI Chatbots
- Customer Service: Trained on your company’s specific knowledge base, a personalized AI chatbot can efficiently handle customer queries, troubleshoot problems, and even upsell products, making it an invaluable asset for any customer-facing business.
- Data Analysis: Whether you’re a marketer drowning in analytics or a researcher sifting through data sets, a specialized AI can digest vast amounts of information. It can then distill this into actionable insights, enabling you to make data-driven decisions.
- Personal Assistance: Managing a busy life is no small feat. An AI trained on your personal data can take over tasks like calendar management, appointment setting, and to-do list prioritization. It could even alert you to personal commitments you might overlook, effectively becoming an extension of your cognitive apparatus.
Knowing what you want your AI to solve will help you use the right AI platform. The biggest hurdle the right platform or service will overcome for you is with its APIs to gather data and perform specific actions.

In our case, we’ll make a customized AI chatbot for a website that can help customers. If you want a simple-to-use AI for data analysis, try ChatGPT’s Advanced Data Analysis (previously called Code Interepter). For something that can help you manage your time, tasks, and relations, try out an AI tool like Otter AI or Clay.

2. Choose Your AI Platform or Tech Stack

Once you have identified the main goal for building your AI, you’ll need to choose the platform or tech stack that aligns with your goal. Your choice of platform is essential because it dictates what your AI can do, how easily it can be trained, and how seamlessly it can be integrated into your existing systems.

Here are two notable options:

Chatbase

Chatbase is a trainable AI chatbot builder known for its simplicity. It allows users to easily connect data sources and create a ChatGPT-like chatbot tailored to specific needs. What sets Chatbase apart is its intuitive training process. You create a chatbot capable of answering any question based on that content by merely uploading a document or adding a website link. This user-friendly feature enriches your customer’s experience and offers a unique engagement strategy.

Pricing: Free plans are available, with paid options starting at $19/month.

Get Chatbase

DocsBotAI

DocsBotAI transforms your traditional documentation into intelligent chatbots. It excels in customer support but pushes the boundaries by creatively leveraging specialized knowledge in another way. What makes DocsBotAI unique is that it can also be used to generate AI-written content while maintaining your brand voice. Since it can be trained on your internal knowledge and external web pages, it can be trusted to do both thingsâ€”handle customer chats and write new content with its AI content writing feature.

Pricing: Free plans are available, with paid options starting at $19/month.

Get DocsBot AI

For this post, we’ll use Chatbase as our primary platform for building your own AI chatbot.

3. Gather Data that AI Will Use

The third step in your AI odyssey is data collection. The type and amount of data you collect will shape your AI’s capabilities, conversational fluency, and overall utility. Data can be in text documents, URLs, sitemaps, or Q&A formatted content. The idea is to feed your AI with specialized information that it wouldn’t have access to otherwise.

How Chatbase Handles Data

Once uploaded to Chatbase, your data undergoes vectorization or tokenization. This process converts the raw data into a format that the Large Language Model (LLM) can digest more efficiently. Once all your data is loaded into Chatbase, you have to “train” the chatbot, which does this tokenization process for your uploaded documents. Each time a new document is added (or an old one edited), the chatbot needs to be retrained. This isn’t a huge deal, but part of how the system works.

Uploading Documents and Data to Chatbase

Chatbase makes it easy to upload supported documents. Click “My Chatbots” and “New Chatbot” to start.

You’ll see the data source types that are supported in the sub-header. Click “Files.” Find your .docx, .doc, .pdf (with OCR text), and .txt files to add them to the chatbot. For example, these event files represent different information from various sources. They’ll be used to train the chatbot.

Here’s how these files look in Chatbase when they are uploaded. Depending on how big and how many files you added to your chatbot, they may take a few seconds to upload.

We can also add Q&A/FAQ-styled text data to our chatbot. This is good when you are pretty sure that specific questions will be asked of your chatbot. The Q&A features allow you to answer exactly what you want your chatbot to answer when users submit similar questions. Click the “Q&A” sub-header and then add your questions and answers.

Lastly, you can select data that is already published on your website. There are two options for this under the “Website” subheading. Choose a web crawler by giving it a starting URL or submit a whole sitemap with specified pages.

At the bottom of any data source pages, when you are ready, you can “Create Chatbot” to push all this information to a chatbot.

How to Structure Data in Files

LLMs like those used with OpenAI’s API are great at understanding text data. However, to ensure you get the most from your chatbot, you will want to ensure your text is as simple to understand as possible. Here are some tips to make that work:
1. Use clearly named files that describe the information within
2. In your files, make sure everything has appropriate context so the LLM knows not just what your data is but what it is about
3. Label text and data in your files so that it can be easily called upon via your chatbot
4. Consider turning native Word tables into plain text tables (using markdown, JSON, or XML formatted tables)
5. Limit duplicate information inside single files that show up across multiple files (in case you update files, you don’t want to have to remember to update a whole bunch)
4. Finetune AI with Prompt Engineering

Once your data is loaded into your chatbot, the final thing to get right is your chatbot’s base prompt. A base prompt is a prompt that the user never sees but is included at the beginning of every message they send to your chatbot. Chatbase connects to OpenAI’s 3.5 Turbo or GPT 4 APIs to process queries and return responses. This means the base prompt is sent along with the user query to OpenAI.

This gives you complete control over how the chatbot responds to a user. Without a base prompt, your chatbot could easily talk about subjects or knowledge not included in your training materials. This is because OpenAI’s LLM models are trained on data sets that are infinitely larger than your own.

If you have a website about a music festival, do you want users to use your chatbot to get advice on what Tesla to buy? No. You want it to stay on task and only answer questions about your training data. That’s why we have a base prompt.

In Chatbase’s Settings tab under “Model,” we can set a base prompt to steer the ship of our AI’s conversations.

Base Prompt Examples

Your base prompt serves as a limiting factor of what your own AI can talk about. It should be engineered to elicit specific responses based on the specialized training data you’ve provided. You don’t want it to get off-topic.

Chatbase’s default base prompt is:

I want you to act as a document that I am having a conversation with. Your name is “AI Assistant”. You will provide me with answers from the given info. If the answer is not included, say exactly “Hmm, I am not sure.” and stop after that. Refuse to answer any question, not about the info. Never break character.

Right off the bat, you should feel comfortable to tailor it to your topic or industry. For our music event example, we can start with this:

You are the leading authority on the Mile High Melody 2024 event. When you are asked any question about the event, you are able to answer based on the documents you have and from nowhere else. Your name is “Melodie”. If the answer to this message is not included in the documents about Mile High Melody or its pertinent details, say, “I don’t know, but can I help you with something about the Mile High Melody musical event?” and stop after that. Refuse to answer any question not about the event’s information or details. Never break character, starting now.

As you can see, we got pretty specific about what our chatbot, Melodie, could and could not talk about. Let’s see how it faired.

Melodie successfully steered the conversation back on track

And when we ask it a question that is almost related, it responds helpfully. With one more follow-up question, our personal AI chatbot responds with specific information from our source files.

And now, we have a fully functioning guide that can hold a conversation without saying something we might regret. It is both helpful and saves us from having to staff human agents to monitor a live chat. Win-win!

Testing and Refinement

There are numerous things to finetune and test, and you prompt engineer your base prompt:
- You want your chatbot to be on brand when it speaks to your visitors. To do this, often, it is easiest to assign the chatbot a personality. Things like Event manager or event host are great personalities to assign (even better if you use specific adjectives)
- The chatbot should use vocabulary suited to your audience and your industry. Include a level of writing (8th grade) with specific industry jargon that is okay.
- Tell it how to handle certain information. Add context to your base prompt if the chatbot gets something wrong with your data. If you added a calendar of events in JSON format to your source files, you could tell your chatbot to interpret that data in plain English so it is understandable to your visitors.
- Let it know what languages it can speak. Usually, it will switch to whatever the visitor is using, but in some cases, you might want to limit supported languages.
5. Deploy and Monitor Your AI

Now, all that’s left is deploying your AI to your website. Chatbase gives two options. You can embed the chatbot on a webpage with an iFrame or add the code to your site’s header body and display it as a chat bubble. Most will want to opt for the chat bubble, which is easy to use from any page of your site.

Click “Embed on Site,” and a modal will pop up with your chatbot’s code. Click “Copy Script” (the 2nd option).

For those using a page builder like Divi on a WordPress website, it is easy to install across your whole site. Click on “Theme Options,” then “Integrations,” and paste the code into the “<body>” field. Other website platforms will have different ways of doing this, but it is relatively standard.

The chat bubble will now be active on your website, and visitors will have the chance to use it.

Monitoring and Tweaks

Constant monitoring is crucial. Keep an eye on how your AI performs based on the stored conversations in Chatbase’s “Dashboard > Conversations” tab.

Adjust the base prompt and data source files as you experience issues. It is easiest to download conversations as a JSON file and review your bot’s conversations. Specifically, look for instances where your users have expressed frustration. You can modify those situations with more/better data or a better base prompt.

If you have more conversation data than you can read yourself, it is easy to copy and paste interactions into ChatGPT to have it analyze where trouble springs up. This lets you focus on improvements instead of reading hundreds of conversation threads.

Conclusion and What to Do Next

Building your own AI is an exciting project you can make as big and helpful as possible. And while you may think that making your own AI is a difficult task, there are tools like Chatbase that can make it a little easier.

A personal AI chatbot can be a lot of help and be a very efficient way of storing and retrieving information. Find out other top AI platforms for building or using AI chatbots. You can also look at the best AI sales tools and best AI SEO tools to see how AI is changing business.

Featured Image by CkyBe / shutterstock.com

The post How to Make Your Own AI: A Beginner’s Guide (2023) appeared first on Elegant Themes Blog.
25.09.2023
How to Translate WordPress Websites in 2023 (Beginnerâ€™s Guide)
A multilingual website is a great way to open your brand to different countries and people, allowing you to share your content with people from around the globe in a language they can understand. This can be done in various ways. In WordPress, you can easily translate your website into multiple languages using a top multilingual plugin like TranslatePress. In this guide, we’ll explain the options available and show beginners how to translate WordPress websites in an easy step-by-step process.

Why Translate a WordPress Website?

There are many reasons why it is a good idea to translate your WordPress website. Here are a few to ponder on:
- Better Index Your Site with Google and Search Engines: When translating your WordPress website with an automatic translator, you may lose search traffic as your pages aren’t indexed. Luckily, WordPress allows you to translate your WordPress website manually with accurate human translations. This leads to a better-indexed website easily found by those who need it most.
- Provide a Better Web Experience for Users: When users can understand your website in their home language, they interact better with your website. Using local phrases, idioms, and dialects is a great way to make users feel at home when navigating your website.
- Increase Traffic and Expand Your Brand: Having your website in multiple languages can expose your brand to new demographics. This, in turn, can lead to greater global brand awareness and increased website traffic from new countries.
- Provide Better Customer Service: A multilanguage website gives your customers the help they need in a language they understand. When coupled with modern tools like an AI chatbot that can function in multiple languages, you can give your clients exceptional service that’ll have them return to your website.
Ways to Translate WordPress Websites

WordPress has many ways in which it can have a website translated. Depending on your website goals, there might be some methods that work better for you than others:
- Automatic Translation Plugins: WordPress has many translation plugins that automatically translate your website. While this is the easiest way to build your multilingual website, there can be some pitfalls. With some plugins, like the free version of GTranslate, you depend on third-party software to translate the content for users on their browser, so you can’t edit the translation or have it indexed for search engines. Ideally, you should use a plugin that includes auto-translation features for actual content on your page.
- Human Translation: Manually inputting the translation for your website ensures that you have the highest quality when building your multilingual site. However, this method requires additional translation investment and can be more work when building your website.
- External Translation Tools: It’s also possible to use online tools not based on your WordPress website to translate your website. Websites like Google Translate and Babelfish are platforms where you can input words, phrases, documents, and websites to be translated. While this is a quick and free way to translate your website, it isn’t user-friendly for visitors who want to experience your website.
- AI Tools and Plugins: With the rise of AI writing software and other AI tools, many use AI chatbots like ChatGPT to translate their content. Some WordPress AI plugins support generating content in dozens of languages. For example, our Divi AI page builder can translate any block of text with a single click on the fly while creating your site.
How to Translate WordPress Websites with a Plugin (step by step)

Now that we know how to translate a WordPress website and why we would consider website translation in the first place, let’s look at the process of translating a WordPress website. You can choose from several fully-featured translation plugins to build your multilingual website. Our list of the best translation plugins has a variety of plugins that can help you build your first multilingual website. For this tutorial, we’ll work with TranslatePress and the WordPress theme Twenty Twenty-Three, a plugin that allows automatic and manual translation for WordPress websites.

Install TranslatePress

To begin, log in to your WordPress dashboard. Then, hover over the Plugins menu item. Next, click Add New. Search TranslatePress, and click the Install Now button on the TranslatePress card.

Once the plugin has finished installing, click the blue Activate Now button. You can choose to opt-in to the TranslatePress. However, we skipped that step.

Choose Default Site Language & Secondary Language

Upon installation, this is what the TranslatePress dashboard and settings look like:

For our tutorial, we will install French as our secondary language. Our default language will be English. To set this up, first, we select our primary language from the Default Language dropdown.

Next, from the All Languages option, select your secondary language. In our case, this will be French (Canadian). You can use the search field to look up your language name. Then, click Add.

If you’d like, you can change the slug used to represent the languages used on your site. Furthermore, using TranslatePress’s automatic translation option, you can decide the formality used during that process. Scroll down and click Save Changes.

Now that our languages are set, let’s save our changes and prepare to create our language switcher.

Create Language Switcher for Your Website

A language switcher is what your users will use to navigate between the different languages on your website’s front end. TranslatePress comes with a variety of ways to show this widget.
- Shortcode: The [language-switcher] shortcode allows you to use the shortcode
- Menu Item: Adds the language switcher to your WordPress menu
- Floating Language Widget: Adds a floating language widget to your website’s frontend
For example, we’ll use the menu item widget of TranslatePress through the Block Editor. To do this, we start by hovering over Appearance. Then, click on Editor.

Once in the Block Editor, click Patterns. This will open the various patterns used by our theme.

Then, scroll down, and under Template Parts, click Header. Finally, click on the snapshot of the Header Template Part on the right-hand side of the screen. Now, we are editing our Header pattern to add the TranslatePress blog to our menu.

Once in the Header part, we can now add the TranslatePress Block to our Header. Click the plus icon. Then, search for the Language Switcher.

Click on the Language Switcher Block. This will add it to the Header Template Part. Notice that it shows both our primary and secondary language. We can go into the TranslatePress settings and edit how it looks. After, click the blue Save button in the top right.

Now, let’s see how we can customize our Language Switcher Block.

Customizing the Language Switcher Block

With the Language Switcher Block, you can easily decide between five different ways of displaying your Block. First, click on the Language Switcher Block. Then, click on the settings icon from the top right. From there, click on the Display dropdown menu. You are presented with the display options. For our theme, we will choose the Full Language Names view. Then, click the blue Save button. Finally, click the WordPress icon on the top left to exit out of the editor and back to the WordPress dashboard.

Now that we have our Language Switcher, we can start translating our content with TranslatePress.

Start Translating Your Content

From the WordPress dashboard, hover over Pages, then click All Pages.

Hover over the page you’d like to translate. From the flyout menu that appears, click Edit.

At the top of the Block Editor, click the blue Translate button.

Now, let’s start translating our Home page. First, we shall manually translate our page.

Manually Translate WordPress with TranslatePress

Once in the TranslatePress Translation Editor, you can manually select the strings and content you want to translate. Under your primary language dropdown, click the dropdown. This lists all the places on your page that are manually translateable.

First, let’s start by translating our page’s body text. Click on the dropdown under your primary language. Then, click the first paragraph of your body text. TranslatePress gives you a preview of the first few lines of the available translation areas of our page string library.

Notice that your current page content is under your first language’s title. Next, enter your human-translated copy for this paragraph. Finally, click the blue save button.

After entering your text, you’ll notice a small identifier, letting you know that this content block has been translated by hand.

Now, let’s exit the Block Editor. Our translated text appears when we go to the front end of our website and switch the language in our language switcher. Also, notice our URL changes to show that we are on the secondary language’s page.

Let’s continue translating other strings on our page, like the page title and a menu. In the TranslatePress translation editor, we can use these small arrows to navigate between strings and blocks of text. Click on these arrows to navigate to the second paragraph of our page. Enter your copy, then click the blue Save button.

Now, our body is fully translated by hand:

But what if we didn’t have access to a translator and wanted to use automatic translation to build our multilingual site? We can do that with TranslatePress.

Translate WordPress Automatically with TranslatePress

You must create a Google Cloud Console account to automatically translate your WordPress website with TranslatePress. Google has a great tutorial on how to make your Google Cloud Console account, as well as your Google Translate API key. With these in hand, we can now go back to TranslatePress.

Hover over Settings. Then, click TranslatePress. Next, click the Automatic Translation tab, and finally, click Yes to Enable Automatic Translation.

Now, you’ll see the settings to control how your website handles automatic translation. First, set the Translation Engine to Google Translate v2. Next, enable Block Crawlers. If you’d like, you can limit the number of translated characters per day. We’ve left this setting to the default. Finally, click the save button.

Equipped with our Google Translate API, let’s test our WordPress website’s new automatic translation settings.

Test Your New Multilingual WordPress Website

Let’s navigate to the front end of our website. We manually translated part of our homepage. However, let’s test out TranslatePress’ automatic translation on our About page. Click on the About link from our menu. Then, click on our secondary language, French, from the Language Switcher widget. This is what our page looks like in our primary language of English:

After our automatic translation, our entire page, including our menu and footer, has been translated into our secondary language:

Having the option of choosing between automatic and manual translation makes TranslatePress the apparent choice for a solid translation plugin.

More WordPress Translation Options

While TranslatePress is a good plugin for translating WordPress, you may need something different for your multilingual site. Here are some options that you may want to consider alongside TranslatePress:
- WPML: The gold standard in WordPress translation, WPML works with more than 40 languages and has over 600 integrations with various themes, plugins, and tools in the WordPress ecosystem.
- Polylang: The most popular multilingual plugin on the WordPress plugin repository, Polylang handles posts, pages, media, categories, post tags, custom post types and taxonomies, and RSS feeds, all while supporting RTL scripts.
- GTranslate: The most straightforward way to bring Google Translate to your WordPress website, this plugin adds a customizable language switcher widget powered by Google Translate to add automatic translation to more than 30 languages.
- Weglot: One of the few translation plugins that provide collaboration functionality within its interface, Weglot can work with over 100 different languages and allows your team to work alongside you as you work through your new multilingual website.
- Multilanguage: With a focus on human translation, this plugin works well for those who already have the translation of their website and only need a tool to assist with bringing their translation to life in WordPress.
Conclusion

There are many benefits to having a multilingual website, and with WordPress plugins, creating one is possible. Whether you need automatic translations from an external service or have already hired a translator to create your website’s multilingual content, a tool can help you translate WordPress effectively. TranslatePress is a plugin that allows automatic and manual translation management in WordPress. Making your multilingual WordPress website with TranslatePress gives you the best of both worlds regarding translation accuracy and ease of use. Consider using this effective plugin the next time you need to add another language to your WordPress website.

The post How to Translate WordPress Websites in 2023 (Beginner’s Guide) appeared first on Elegant Themes Blog.
20.09.2023
How to Create a Landing Page with AI
The age of digital marketing has seen the need to create high-converting, professional, and creative landing pages. Whether selling an eBook, online software, or a high-ticket course, your potential customers expect to interact with a landing page at some point. In this guide, we’ll walk through the various tools and methods you can use to build your next landing page with the power of AI.

What is a Landing Page?

In the world of web design and digital marketing, a landing page usually refers to a page specifically designed for lead generation and conversion. Most landing pages are created to have users take one specific action. Whereas regular pages on a website might have a variety of endpoints or goals, a landing page’s mission is singular. Some essential aspects of a landing page include:
- Captivating Headlines: Since landing pages focus on one main call to action, the section headings used throughout it must be attention-grabbing.
- Convincing Copywriting: Copywriting is different from traditional content writing. Your landing page copy should be more sales-driven andÂ focused on getting your visitor to complete the goal set for it.
- Engaging Visuals:Â Landing pages should have engaging visuals like images and videos to help illustrate your products or services.
- Social Proof: Adding social proof like testimonials or reviews can help build trust with your audience and increase sales and conversions. No landing page is complete with a testimonial or reviews section.
- Clear Call to Action: Whether it is a button, an email opt-in, or a contact form, every landing page needs a clear call to action to make it easy for users to take the step you want.
What are the Benefits of Creating a Landing Page with AI?

Creating a successful landing page can be time-consuming and expensive, especially when hiring professionals. But with the help of AI, you can create landing pages with all the essential elements without wasting time and money to get professional results.

Here are some of the benefits of using AI to create your landing pages:
- Faster Development: AI allows you to build landing pages quickly. AI has progressed to the stage where you can create content, generate images, and spin high-quality videos quickly and efficiently. All of these features are important when building a solid landing page.
- Professional AI Copywriting: AI writing tools can help you add professional copywriting to your landing page consistent with your brand and conversion goals, making headlines pop and the content more engaging and compelling.
- Custom AI Visuals and Videos: Various AI tools can quickly create a landing page’s welcome video or sizzle reel. And there are powerful AI art generators for creating high-quality images and illustrations for your landing page. This can save you significant time and money from hiring a professional.
- Integrated Automation: With AI, it’s possible to add a level of automation to the interactions that your users experience on your landing page. Integrations with third-party tools, A/B testing, dynamic content, and others are examples of automation AI can help you bring to your landing page. Furthermore, the actual landing page-building can be automated with AI.
- Enhanced Personalization: Tailoring content and features to the needs of your users is easier to do with AI. Quickly increase user engagement by utilizing AI tools that bring individualization to your landing pages. AI Chatbots are a common way to personalize the user experience your future customers may have on your landing page.
- Deeper Data Insights: AI can also analyze and process data to improve landing pages. User behavior analysis, conversion rate optimization (CRO), and other insights can be gleaned, processed, and analyzed more easily with AI. Furthermore, running AI-driven tests can help you fine-tune your pages for your future customers.
Now that we’ve looked at some benefits of using AI to build your landing pages let’s learn how to do this practically.

Ways to Create Landing Pages with AI

There is a myriad of ways that you can create landing pages with AI, including:
- Using AI website builders or landing page generators
- Using AI Tools and Platforms for help
- Using AI Page Builders and Plugins for WordPress
First, look at how AI website builders can help us build landing pages.

Using AI Landing Page Generators to Create Landing Pages Automatically

Many website builders can be used to create landing pages for your product or service. Most come with a library of modules, a repository of templates, plus apps and add-ons to include additional features. Some website builders have taken this a step further. By including AI in their platforms, there are a few AI website builders on the market that you can use to generate and optimize landing pages.

For example, Hostinger’s AI Website Builder takes four simple steps to create a website. Plus, you can quickly generate landing pages for your site using their AI assistant.

Wix ADI is another AI website builder by Wix, which can generate entire websites and landing pages with a single prompt. It also has an AI Assistant within its builder to adjust your landing page content with the power of AI. For example, Wix’s AI Text Creator within Wix Studio can generate titles, paragraphs, and more based on easy-to-use prompts.

We have compiled a list of the top AI website builders to study if using an AI website builder is a good choice for your landing page.

Creating Landing Pages With the Help of AI Tools

Not all website builders or platforms have built-in AI solutions for generating an entire landing page for you automatically. However, you can still use external AI tools to help create more effective landing pages on any website platform. Most website builders and CMS platforms like WordPress will have many premade landing page templates or themes you can use to get a high-quality landing page up and running in minutes. Then, you can use other AI tools to finish the job. When you blend these tools, great things can happen, resulting in landing pages with the best each software can offer.

For example, you can use ChatGPT or an AI writing tool, Jasper, to create professional copywriting for headlines, content, and essential CTAs for your landing pages.

You can also use AI image generators like Midjourney to create beautiful digital art that you can use on your landing pages.

AI video generators like Synthesia are at the cutting edge of creating professional tutorials and sales pitch videos for you to use on your landing page. You can create compelling and captivating landing pages for your next launch by interweaving the wealth of tools available in the AI space.

Create Landing Pages in WordPress Using AI

Finally, WordPress is joining the ranks of tech products employing AI in their ecosystem. From themes to plugins, you can now find more than a handful of WordPress AI tools that you can use to create your next landing page.

A plugin like AI Engine brings chatbots, code creation, image generation, and other AI features to your WordPress website. Installing the Uncanny Automator plugin lets you bring automation and AI to your WordPress website. Furthermore, themes like Elementor and Divi bring AI into the theme space. Divi AI, combined with its no-code builder, split testing, and marketing integrations, makes it a solid choice for building a landing page with WordPress and AI.

How to Create a Landing Page with AI in WordPress (Step by Step)

At this point, we’ve learned the differences between a typical web page and a landing page. Additionally, we understand the various ways we can use AI to build a landing page. Now, we’ll use Divi to create our landing page’s layout and essential sections, like our hero area and call-to-actions. Then, we will create a landing page in WordPress with Divi AI.

1. Map Out Your Landing Page with AI

Creating an outline before building your landing page puts you on the right track to a successful launch. An outline will guide you on the sections to create, the headings to use, and the potential add-ons or plugins you’ll need to invest in for your landing page to run smoothly. We can use a chatbot like ChatGPT to generate an outline for our website.

To start, navigate to ChatGPT. Then, enter a prompt. This prompt generated an outline to promote a podcast episode, “Outline a simple four-section landing page for a podcast episode.” This was the outline that was created:

ChatGPT has provided a simple guide on the titles, call-to-actions, and content we can create on our landing page. This can help inspire us as we create. With our outline in hand, let’s build our WordPress installation.

2. Setup WordPress

There are a few ways that you can set up your WordPress install. We have a step-by-step tutorial showing you how to install and set up WordPress. At the bare minimum, you’ll need a domain name and web hosting to get your WordPress website off the ground. When it comes to the installation of the WordPress CMS, you can use your web host’s one-click installer. However, it would be best to install WordPress manually for more customization. Once your WordPress install is live, you can now move on to install Divi.

3. Install Divi and Divi AI

We’ll use Divi with Divi AI to build a landing page in WordPress. If you are new to Divi, you will need to get a membership and download Divi from your member page. Follow this great walkthrough of how to install Divi, which goes in-depth about downloading the theme file, installing it in WordPress, and authenticating your website.

Building your landing pages with Divi and Divi AI is an intelligent choice. Divi has a powerful no-code page builder, making building beautiful yet complex landing pages quick and easy. Divi has a vast library of landing page templates optimized for conversions and can help you meet your targets. Coupled with Divi AI, your landing page is taken to the next level. Divi AI can automatically generate content by just scanning your page context. It can also create unique, custom digital art that can be resized, upscaled, and downloaded for use in other marketing materials. Choosing to use Divi and Divi AI to power your next landing page build is the best way to create your sales and squeeze pages with AI.

4. Set Your Website’s Site Name and Tagline

Divi AI uses your website’s site title and tagline as a starting point to create on-brand and relevant content for your website. After we have installed WordPress and Divi, we must set these two up. After logging into your WordPress dashboard, hover over the Settings menu from the left-hand menu. Then, click General.

Next, enter your site title, as well as your tagline. We included one of the keywords we’d like to use as we optimize our content for search engines – podcast – within our site title and tagline.

Finally, click on the blue Save Changes button. Next, we will begin creating and laying out our landing page in Divi with Divi AI.

5. Create Your Landing Page

We’ll create a landing page in this guide to encourage listeners to join our email list. Hover over the Pages link from the left-hand menu to create a new page. Next, click Add New.

Next, give your page a title. Then, click the blue Publish button to create your page. Finally, click the purple Use Divi Builder button to activate the Divi Builder.

You’ll have three options to create a new page in Divi. We’ll use a layout from the many layout packs Divi provides. So, click the purple Browse Layouts button to open the Divi Layout Library.

Next, enter podcast in the search box to pull up the various podcast layouts from the Divi Layout Library. We’ll be using the landing page layout from the Podcaster Layout Pack.

Next, click the blue Use This Layout Button.

Once your layout is installed, click the green Save button at the bottom right of your screen.

We’ll use the Divi-provided layout with all its sections for this tutorial. Now that our page layout is in place, we can begin editing and adding our landing page copy with Divi AI.

6. Add an Exciting Section Title

While the free Divi layout packs contain some language within their layouts, we can create better and more impactful content for our landing pages using Divi AI.

Setting Up the Initial Text Module for the Hero Section

While we have an outline from ChatGPT, we will follow the flow of the default landing page from our layout for this tutorial. To start, let’s add a title to our hero section. Click on the gear icon over the Text Module. Here, we will add an exciting title to encourage people to sign up for our mailing list, which is the primary goal of our landing page.

Next, click the Divi AI icon. Then click Write with AI. This will activate Divi AI.

Now that Divi AI is activated let’s create a title for this landing page that will encourage users to sign up to our mailing list. To do this, change the content type to title. Then, add a prompt to the text field. Our prompt was, “Create an exciting page title, encouraging people to join our podcast’s mailing list.”Â Finally, set the added context of our title to This Page Content.

Divi AI generated this title for our landing page:

As opposed to simply having the name of our podcast on our landing page, Divi AI created a title for our landing page that entices viewers to join our podcast’s inner circle, our mailing list.

Using Divi AI to Refine the Hero Section’s Subtitle

Notice we have two Text Modules in our hero section. Again, we want to focus on promoting our podcast’s newsletter. Let’s add some additional text to our hero section to do this. Before we add our content, let’s save our styling using Divi’s copy and paste featureâ€”Right-click on the text module. Then, click Copy Module Styles.

Now, let’s click on the gear icon for the first Text Module.

Next, we navigate to the text editorÂ and click the Divi AI icon. Now, we’ll click on the Improve with AI button.

With Divi AI activated, we will set the Content Type to Title. We will use the following prompt to generate our subtitle: “Create a compelling statement getting viewers to join our email list.”Â Thirdly, we’ll change the Added Context to This Section. Lastly, click the blue Generate Text button.

This is what Divi AI created to support our title and the primary goal of our landing page:

Divi AI was able to pick up that we had called our email list the “Inner Circle” and was able to use that and establish continuity on our landing page with our subtitle. Now, we click on the blue Use This Text. Then, click the green check mark to save our content. Don’t forget to paste back the module styles!

7. Create Content for Section

Our hero section has its title and subtitle created, so we can move on to creating content for the final Text Module within this section. As before, we click the gear icon to edit our Text Module.

Next, we will use another Divi AI feature to improve this copy. Click on the Divi AI icon. Then, click on the Improve with AI text link.

Before we enter our prompts, we will click on the Guide Me text link. We are now presented with a comprehensive modal box with additional settings that we’ll be using to create the final content for our hero section.

For our hero section, we set the content type to a Paragraph. Then, we specified our prompt, “Encouraging people to join our newsletter and listen to our podcast.” We want to change the context of this Text Module to This Section’s Content. For our tone of voice, we want to set it to Creative. We add a keyword to help with search engine optimization. Lastly, we don’t want the text to be too long, so we set the content length to precisely three sentences.

Divi AI was able to add our podcast name, provide some information about our podcast, and encourage viewers to subscribe. This is the power of using Divi AI to build your landing page! To finish with our section, click the blue Use This Text button. Then, click the green check mark to save our changes.

This is what our hero section looks like thus far:

By only inputting our podcast title, we were able to generate supporting content for our landing page that is on-brand, unique, and flows well with the rest of the content on our landing page. Before we finish with our hero section, let’s create a new image with Divi AI.

8. Generate Unique Digital Art for Your Landing Page

Divi AI not only works with text but can also work with images. We will replace the Image Module within the hero section with a custom image created by AI. To begin, let’s click on the gear icon for the image.

Next, click the Divi AI icon. Then, click the Generate with AI link.

Now, we can enter a set of options into Divi AI. Following the landing page style, we set the Image Style to Cartoon. Then, we issue a prompt to Divi AI, “Create an illustration podcast equipment with a cityscape.” Next, we set the aspect ratio to portraitÂ and assign a size to our image.

With these commands, Divi AI creates unique, custom digital art that we can use on our website and in other marketing materials. Once we’ve selected it, click the Use This Image button. Finally, click the green checkmark to save our new digital art piece.

Now, this is what our hero section looks like:

Divi AI created our headline, encouraged users to join our podcast, told users about our email list, and generated a piece of custom digital art. A task that could be done across multiple tools has been simplified with Divi AI. Continue this process for the other sections of your landing page using prompts and Divi AI’s quick actions to efficiently create landing page images and written content.

9. Add Modules and Call-to-Actions to Your Landing Page

After creating your landing page’s content, it’s time to focus on the most essential aspect of a landing page: the call to action. This landing page layout has multiple Button Modules throughout. It also has a bold section with an Email Optin Module in the footer. Let’s see how Divi AI can transform this section into a compelling call-to-action for our landing page.

First, click the gear icon on the Text Module with the title of this section. Remember to copy the styling!

Next, click the Divi AI icon. Then, click the Write With AI text link.

Next, change the Content Type to Title. Give Divi AI a prompt to create an engaging title to encourage viewers to subscribe to your email list. Finally, click This Page Context for the added context of this Text Module.

While this title is good, we can improve it with Divi AI. Click the Improve With AI button. Then, click Change Tone. Finally, click Funny. We’ve used a funny tone throughout creating the content for our landing page. So, it follows that we’d want to use that same voice when creating our call-to-action.

Our new title matches closely with the tone of voice of our landing page! As such, click the blue Use This Text button and click the green checkmark to save our work.

Now, let’s create the body text for our call to action.

Create Content for the Call-to-Action Body

Firstly, click on the gear icon for the body text module and remember to copy the module’s styling.

Then, click the Divi AI icon within the text editor. Click the Write with AI text link to start writing copy.

For our body text, set the Content Type to Paragraph. Next, give Divi AI a prompt to create a copy to encourage our website views to subscribe to our email list. Finally, set the Added Context to This Page Content.

The body text created takes from content within our page and provides ample information to potential listeners on the benefits of signing up for our newsletter. So, click the Use This text button andÂ the green check mark to save our call-to-action body text.

The last part of our call-to-action is our Email opt-in module. We’ll use Divi AI to create some new text for our button.

Change the Call-to-Action Button Text

First, click on the gear icon to edit the Email Optin Module.

Next, click the Divi AI icon from within the text box on the Email Optin button. Then, click Write With AI.

Then, set the Content Type to Button. Leave the prompt area blank. Lastly, set the Added Context to This Section Content.

Finally, Divi AI creates a witty phrase for our button. We’ll use this text, so click the blue Use This Text. Finally, click the green checkmark to save our Email Optin Module.

With that, we’ve used Divi AI in various ways to create content for our landing page. Whether it’s titles, body content, or call-to-actions, Divi AI is the perfect tool to help you build your landing pages with AI.

Optimizing Your WordPress Landing Page with AI

Now that our landing page has been created, there are a variety of ways to enhance the landing page with AI tools:
- Check spelling and grammar: You can use Divi AI’s Spelling and Grammar quick action to ensure your content has no mistakes. Also, don’t forget to read through your AI-generated content to ensure that it flows well for human readers.
- Don’t forget to add keywords and optimize for search: Divi AI allows you to add keywords to your content. Adding keywords to your content helps you get found by search engines, which will help more people find your product or service’s landing page online. Additionally, using a solid SEO plugin will help your landing page’s search ranking.
- Compress images: A good WordPress AI tool that you should consider using is ShortPixel. This tool helps to compress your images while maintaining the quality of your photos and images on your landing page.
- Consider adding a chatbot: Setting up a chatbot can help drive conversions. Using an AI chatbot like Tidio, you can answer your users’ frequently asked questions, better prepping them for a sale.
- Collect and showcase testimonials: Use plugins like Strong Testimonials or Thrive Ovation to display your testimonials and other forms of social proof on your landing page.
- Â Add a video intro or explainer video to your hero section: Placing a well-made video above the fold of your landing page is a great way to engage views, tell your brand story, and build a personal connection with visitors. A professional video can be very impactful for a website. If you’re on a budget, consider using an AI video generator to make your landing page’s video stand out.
After considering these things, you are on your way to creating a beautiful yet practical landing page with WordPress and AI.

Conclusion

There are many ways to create a landing page with AI. Today, there are hundreds of AI-powered tools that you can use simultaneously to build a robust landing page. AI content creators like Jasper and Copy.ai provide high-quality, search engine optimized content on the fly. Midjoureny are image generators that bring your digital art to life through the power of a few simple prompts and templates. Website builders like Hostinger and Wix are slowly adding AI into their website-building process. Divi AI can bring aspects of these tools together, helping you create a standout landing page powered by AI. To stay on the cutting edge, consider using AI as you build your landing pages. Save time, increase productivity, and gain new perspectives that can help increase your bottom line.

The post How to Create a Landing Page with AI appeared first on Elegant Themes Blog.
16.09.2023
How to Use AI to Improve WordPress SEO
Want to take your WordPress SEO to the next level? With the help of AI technologies, you can easily elevate your WordPress SEO game. AI SEO tools like Semrush, Divi AI, and Rank Math can help you create high-quality content that search engines love. In this article, we’ll walk you through the steps you need to take to improve WordPress SEO with each of these AI tools.

Understanding How AI Can Improve WordPress SEO

Using Artificial Intelligence (AI) in SEO is more than a passing trend. Many website owners have been experimenting with practical approaches to boost your WordPress site’s performance significantly. Here’s how:

Understanding Search Intent

AI algorithms like those in Semrush can analyze high-level user needs from search queries. This analysis provides insights into what your audience is looking for, allowing you to tailor your content to meet their needs and expectations. You can vaguely tell if your content should fit into one of these buckets: Informational, Commercial, Transactional, or Navigational. Search intent helps you predict what searchers are looking for with a given term so you can provide the content they need. The more you address their needs, the more they may appreciate other insights you may provide in your content.

Enhancing Topical Authority

You can create content demonstrating expertise and relevance in your niche by utilizing AI and Natural Language Processing (NPL) to develop rich content with related keywords and semantic topics. As search engines grow in sophistication, they’ll look for things beyond NPL and topical coverage, but these are good things to include at a base level. This approach helps search engines understand your content’s context. It also gives you something to add to your expertise while hitting the essential marks needed to rank.

Optimizing On-Page Elements

AI can assist in fine-tuning meta descriptions and keyword usage. By analyzing SERP data, you can gain insights into competitor strategies, allowing you to improve your click-through rates and rankings.

Ensuring Quality with E-E-A-T Standards

Part of the point of Google’s standard for rankable content is for site owners to lean into better content and not just more of it. Using a programmatic SEO approach with AI writers with little oversight isn’t the way to go. However, using AI correctly can make your writers even more efficient. AI can evaluate the quality and relevance of your content, ensuring alignment with the latest search engine guidelines. Factors such as expertise in the subject matter, the effort put into research, the authoritativeness of sources, the trustworthiness of information, content length, and readability are analyzed to meet high standards.

WordPress SEO Optimization with AI Tools

We’ll spend most of our time in this article seeing how three AI tools, in particular, can help WordPress site owners with their SEO efforts. These are Semrush, Divi AI, and Rank Math SEO.

First, let’s see how Semrush’s various tools can help set us up for success.

1. Outline and Keyword Research with Semrush

Semrush is a comprehensive suite that aids SEO research, especially for WordPress sites. Its free Content Outline tool is a standout feature that helps you organize and optimize your keywords and ideas. Learn more about their AI Content Outline Builder.

How to Use the Semrush AI Outline Builder

Semrush’s Outline Builder is the easiest-to-use AI tool by Semrush. You can use it and share up to three outlines for free. To get started, provide a topic you want to cover. We’re building a homepage for a boat tour business in Maine. We’ve tested this tool with blog articles, homepages, and landing pagesâ€”it performs well in each case. Click “Create Outline.”

The first major aspect of the outline builder is the SEO Title. You have three options:
1. Write your own title
2. Use AI suggestion (recommended)
3. See competitor titles that are ranking in the SERPs (excellent for research)
In our case, we liked the AI’s first suggestion. When you’ve found yours, click “+ Use this title.”

Next, your options for article description mirror those for the title: write your own, draw inspiration from competitors, or adopt an AI suggestion. Feel free to start with an AI-suggested description and modify it to align with your vision.

Next, it will give you basic keyword recommendations, but using Semrush’s Keyword Overview tool is best, which we’ll touch on in a moment.

The last major step is actually building your page outline. This section lists AI-suggested and competitor headings/questions based on your topic. Include the ones you want by dragging them over to your outline. You can even add your own using the “+ Add subheading/heading” button on the left. This table of contents section is excellent for structuring your page, whether it’s a landing page or a blog article.

Finally, when satisfied, click “Preview” to see the finalized outline.

There are more options, but we’ve found that those are less helpful. If you want, you can explore AI-gathered “facts” that you can use in your articles and see what images competitors are using.

How to Use Semrush for Basic Keyword Research

Semrush is better known as a robust research tool to help you find content gaps and trends, explore search volumes, and track SERP rankings.

Start your keyword research by entering the keyword you want to analyze into the search bar. Select the target region you want to focus on. Click “Search,” and Semrush will take you to the Keyword Overview page for that keyword.

Detailed information about the selected keyword is on the Keyword Overview page. This includes an analysis of organic search volume, keyword difficulty, search trend graph, search intent, and cost-per-click. This information helps you assess the keyword’s potential for your content and advertising strategies.

Further down the Keyword Overview page, you’ll see additional insights such as keyword variations, related questions to your keywords, and potential keyword clusters (paid). These details allow you to explore variations and related terms.

Semrush’s paid tool gives you even more powerful tools to look up keyword information. It can also help you track published pages and how they are performing.

2. Using Divi AI for Faster Website Creation

Now that we have an AI-generated content outline and keywords for our page, we’ll use Divi to build it out. Fortunately, we have Divi AI, which will play a vital role in creating images and keyword-rich content.

Make sure to set up a WordPress site and install Divi. For our example, we created a page and used the Sightseeing Tours layout pack to get us started. This will be the base we will iterate from for maximum design speed. One last step that we’ll do before using Divi AI is pasting in our headings from the Semrush Outline Builder. The outline we created with it is great, and it is easy to add section headings to our premade layout. This saves us from designing from a blank page.

Generating Images with Divi AI

We want to change the picture in our hero section (and other sections of the layout). To use Divi AI to generate images, open the image module, go to the background image, select the “AI” icon, and then “Generate With AI.”

Fill in the Divi AI image generation parameters. Learn more about creating images with Divi AI. Here’s what we choose:

Divi AI did an excellent job creating images. We could refine or generate more images like these, but we liked image #3. Click “Use This Image” to add it to the module.

We went ahead and repeated the steps for all the images on the page.

Generating SEO Content with Divi AI

Now that we’ve created a new image for the page, we can move on to generating website copy. The layout had some placeholder text that we want to use Divi AI to replace. To do this, open the text module, click the “AI” icon, and select “Write With AI.”

Much like Divi AI’s image generation, we need to tell it what content we want to create. Give a description and set other parameters to your liking. You can even prompt Divi AI to include all the keywords you need for a block of content. When ready, click “Generate Text.”

Divi AI came up with some text for this text module, and it’s very close to what we need. Clicking “Use This Text” adds it to the module, where we can edit it to our liking.

If you want to run Divi AI again, you can either “Retry,” use a quick action (i.e., Shorten), or “Refine Result.”

Divi AI Results

By simply using a premade layout pack, Divi AI, and our Semrush outline, we created an entire homepage in 15 minutes. Best of all, it is ready to run through Rank Math!

Here’s the hero section we made with the help of Divi AI’s image-generation capabilities:

Moving down a section, this is our second heading based on the Semrush outline. Divi AI handled the image creation plus the paragraph of the sales copy.

Doing this for each section in our content outline is a breeze. Semrush gave us the structure of our page content, and Divi AI created each piece of it. You could do the same exact steps for either a landing page or a blog article. See our detailed guide to using Divi AI for blog article writing.

3. Improve On-Page SEO with Rank Math

Rank Math is the go-to for setting up a site with proper SEOâ€”page by page. Rank Math’s AI and NPL-powered content scoring can use data straight from the SERPs to analyze each page of content you create. It has a pro version that helps more with Keyword planning, but we’ll look at how the free version can help with editing content for SEO quality.

To get started, click the Rank Math icon on the bottom center of the screen.

$Use Rank Math to Improve SEO - Steps 1$

Notice that it gives you a start score before optimizing â€” 21/100 is not good! Start by giving your page/post a meta description by clicking “Edit Snippet.” Then add a “Focus Keyword.”

$Use Rank Math to Improve SEO - Steps 2-4$

There are two main sections that help you know exactly what to optimize. The first is “Basic SEO,” which covers the bare minimum. A Red X icon shows you what you need to work on.

$Use Rank Math to Improve SEO - Steps 5$

For even more optimization recommendations, see the “Additional” section. This dives even deeper into your on-page SEO needs.

$Use Rank Math to Improve SEO - Steps 6$

You probably noticed these two buttons near the top. These open up Rank Math’s AI content analysis and tracking tools. They are not available for free but are worth their weight in gold if you don’t have similar tools for analyzing your content and tracking your rankings.

$Rank Math Content AI and Keyword Trends Buttons$

Here’s what Content AI suggestions look like for adding semantic keywords, questions, and additional links to your content. It shows you if your content uses suggested semantic phrases and how many times. Green is the goal!

Want a full breakdown of Rank Math? See our Rank Math introduction to help get your site ranking in no time.

4. Other AI Tools for WordPress SEO

These other WordPress AI plugins and tools help with other aspects of SEO not covered above.

ShortPixel

Speed is an ever more important aspect of the SEO game. ShortPixel ensures your images are blazing fast for every user, every device, and every page load.

It helps reduce image sizes without losing image quality. It also boasts an AI-powered CDN that can serve images at the sizes needed for a particular screen resolution, so you are never bogging your visitors down.

These features are great for some Divi AI-generated images, which can be large in file size if you ignore them.

Link Whisper

What if AI could analyze the content of all your pages and find effortless internal linking opportunities? That’s what Link Whisper is all about!

Link Whisper matches relevant phrases across your website with pages that cover those topics. Since it uses AI, it has an excellent understanding of your content and can suggest relevant internal links.

Programmatic internal linking is an AI tool that we are all here for.

Grammarly

Did you know that correct spelling and grammar are signals for helpful content? Grammarly is the premier tool for editing grammar and fixing simple errors. It works in the browser and with your favorite writing programs. It’s saved us more than once!

Grammarly gives real-time suggestions (in the form of helpful underlining) to help you improve your writing as it is typed. Its Premium version offers even more suggestions that will make you a better writer.

WordLift

The WordLift plugin can be used to apply schema markup on your WordPress pages effortlessly. With this tool configured, you won’t need to write code to add valid Schema markup to your pages/posts.

A menu on your article’s right side in the WordPress editor (classic or block) will let you annotate specific content for adding automatic Schema entities. Since WordLift uses AI, it gives you intelligent suggestions that are easy to act on.

Wrapping Up

If you haven’t already started using AI to build websites faster, you are in for increased productivity. Half the battle is figuring out which tools can realistically help you get the job done. This article showed you how to improve WordPress SEO with AI tools like Semrush, Divi AI, and Rank Math.

We’ve written extensively about AI tools for general productivity as well as for SEO. If you are looking to incorporate more AI into your workflow to save time and get better results, check out these helpful articles:
- Best AI SEO Tools for WordPress and other CMSs
- A deep dive into the best AI Chatbots
- Creative use cases for Divi AI and
- The Best AI Website Builders worth considering
How are you using AI to build websites and create better (or more) SEO Content?

Featured Image by Piscine26 / shutterstock.com

The post How to Use AI to Improve WordPress SEO appeared first on Elegant Themes Blog.
14.09.2023
How to Use ChatGPT in WordPress (2023 Tutorial)
ChatGPT has greatly impacted how we create since it burst onto the scene in November 2022. With the chops to help you craft outlines, headlines, paragraphs, or full blog posts, digital creators everywhere are warming up to the idea of creating content with artificial intelligence (AI). As AI continues to evolve, we see integration with ChatGPT in several ways, including within WordPress. In this post, we’ll showcase how to use ChatGPT in WordPress.

Let’s dive in.

What is ChatGPT?

ChatGPT (or generative pre-trained transformers) is an AI chatbot, created by OpenAI, that makes humanlike dialog through natural language processing. It can respond to questions, carry on conversations, and even write code for you. It uses a form of artificial intelligence called generative AI, which is also used to create images, videos, music, and text.

What is Generative AI?

Generative AI is a unique form of artificial intelligence that learns from large amounts of data to produce high-quality text, images, and other forms of media. It uses deep learning, such as generative adversarial networks (GANs), to learn from a dataset and generate new content based on that data. GANs are made up of two systems: a discriminator and a generator.

During training, the generator’s job is to create new content to try and fool the discriminator. The discriminator receives the data, processes it, and determines whether it’s real. Initially, the generator could be better at creating new content so the discriminator can easily spot the fake. As training progresses, the generator gets better at its job, eventually being able to fool the discriminator.

Benefits of Using ChatGPT in WordPress

There are several benefits to using ChatGPT within WordPress. First and foremost, it can save you a ton of time in the content creation process. With ChatGPT, you can quickly write blog posts, product descriptions, and more within a few clicks. Another benefit of ChatGPT is increased customer engagement.

AI chatbots answer common questions, personalize recommendations, and quickly access information. Using ChatGPT as a live chat agent, you can provide customers with a service without hiring live agents to field questions. That said, there are plenty of other use cases for ChatGPT.

7 Use Cases for Using ChatGPT in WordPress

There are a few ways to use ChatGPT within WordPress. It’s great for researching blog post ideas, generating outlines, writing code, and creating plugins. Here are a few tasks that ChatGPT can assist you within WordPress.

Researching Blog Post Ideas

Coming up with fresh blog post ideas can be a challenge. With ChatGPT integrated into WordPress, you can brainstorm ideas by conversing with it. It can suggest topics, trends, or even niche subjects, helping to overcome writer’s block and ensuring your blog has fresh content regularly.

Generating Outlines

Crafting a well-structured blog post starts with an outline. ChatGPT can help you build an online based on an idea, adding main points, subheadings, and key points, allowing you to keep your thoughts organized and on track.

Writing and Debugging Code

If you’re looking for a way to add functionality to your site but don’t have coding knowledge, ChatGPT can help you write CSS, HTML, and even PHP. In addition, if you’re experiencing an error and need help deciphering it, you can plug error messages into ChatGPT to help identify the problem.

Creating Plugins

If you need your site to encompass functionality that isn’t possible with existing plugins, you can ask ChatGPT for help. It can assist you in creating plugins to handle several different tasks, from something simple as a link finder to more complex functions like a mortgage calculator.

User Engagement

ChatGPT can increase user engagement through chatbots. You can integrate it to offer recommendations, answer questions, and assist in finding relevant content on your site. You can even use it to provide technical support should you offer products and services.

SEO Optimization

One of the most important ways to ensure your site gets noticed in the search engine ranking pages (SERPs) is by using an SEO plugin. Did you know that one of the more popular ones, AIOSEO, uses ChatGPT? With AIOSEO, you can use ChatGPT to generate titles and meta descriptions, making your life much easier.

Generating Web Content

Writing high-quality, engaging content is a time-consuming task. ChatGPT can aid in writing content for your site, saving you time and effort. It’s perfect for crafting headlines, paragraphs, or entire landing pages.

How to Use ChatGPT in WordPress: 2 Methods

There are many ways to use ChatGPT for your website, but most involve using OpenAI’s interface to do it. In this post, we want to concentrate on ways to use ChatGPT within WordPress itself. The first is through Divi AI, which allows you to generate text (and images) when building pages in the Divi Builder. The second is through a WordPress plugin called AI Engine.

Divi AI

Elegant Themes’ new flagship AI product, Divi AI, incorporates ChatGPT (3.5) inside the Visual Builder, so you can generate text on the fly. It can also be used to build a webpage, write a blog post, or simply improve copy you’ve already written.

You can use Divi AI to create posts or pages, but for this post, we’ll create a page. Log in to the WordPress admin dashboard, then create a new page to start using Divi AI with ChatGPT.

Next, give your page a title (1), then click the Use Divi Builder button (2).

You can create a new page from scratch or choose a premade layout. We’ll choose to build our page with a premade layout:

Select the ramen shop layout pack for Divi:

Next, choose the landing page layout (1), then click the Use This Layout button (2).

With the layout loaded, we can start using Divi AI to generate copy for our page.

Divi AI: Generating Copy Automatically with ChatGPT

One of the fastest ways to use ChatGPT in WordPress is to generate copy automatically. Divi AI uses proprietary technology combined with ChatGPT that gives Divi unique insight into the content you want to create. Divi AI can examine surrounding content and make suggestions when using a pre-made layout or previously built page. To showcase this, select the text box under the page title by hovering over it to reveal the gray settings icon.

Click it to bring up the module settings. You’ll have two options to create copy with Divi AI. If you want to automatically generate copy for your module, click the Generate Content With AI button (1). Alternatively, you can hover over the text area to reveal the AI icon (2).

Upon clicking the Generate Content With AI button, a new dialog box will appear with AI-generated text. As you can see, it used other elements within the layout pack to create copy directly associated with the content on the page.

To use the text, click the Use This Text button to insert the newly generated text into the text module.

Improving Copy with Divi AI

What if you want to improve the text? Thankfully, Divi AI lets you make improvements to copy just as easily. With the same text module activated, click the AI icon within the text box to bring up the options. As you can see, there are quite a few to choose from.

Let’s choose Improve with AI. A new dialog box will appear, revealing a few options:
1. Content Type: Choose from a title, paragraph, button, blog post, or social media post.
2. What are you writing about: Allows you to provide context to give Divi AI a better shot at producing what you want.
3. Added context: Choose from this page content, this section content, this module content, or no context.
4. Tone of voice: Allows you to provide the tone for ChatGPT to follow, including creative, informative, or funny.
5. Must use keywords: Add keywords (short or long tail) that you’d like included in the text.
6. Content length: Specify how many words, characters, sentences, paragraphs, or list items you want to generate.
7. Language: Choose the language for your text.
These settings allow you to fine-tune copy generated with Divi AI or written by a human. The great thing about ChatGPT within Divi AI is that you can guide it using keywords and other settings to produce content more attuned to your needs. For example, suppose we want to shorten the content created in the last section. In that case, we can easily specify how many words we’d like the text to have.

AI Engine

Another good way to use ChatGPT in WordPress is through a WordPress AI plugin called AI Engine. It allows you to create chatbots, generate blog post ideas, and create images. To use AI Engine, you’ll need to obtain an API key through OpenAI and purchase credits. In our experience, generating a three-paragraph blog post will cost roughly a fraction of a penny, so it’s very cost-effective. Before we walk you through using AI Engine, let’s get you set up with an API Key.

Setting up AI Engine

After searching for and installing AI Engine, the first step is getting the settings squared away. Before you do anything else, you’ll need to acquire an API key through OpenAI. To do this, click on the settings tab in the AI Engine interface.

Before proceeding to the next step, be sure that you sign in (1) to an active OpenAI account and have purchased credits. If you need to sign up, click the sign up button (2) on the top right of the OpenAI website.

To add credits, navigate to the billing overview screen and click the add to credit balance button to add credits to your account.

Once you’ve purchased credits, click API keys (1) under the user tab. From there, click + Create new secret key (2).

Next, give your API key a name (1) and click Create secret key (2).

Once the key is created, click the copy button to copy the key to your pasteboard.

Finally, head to the AI Engine settings screen and paste your new API key into the text field.

AI Engine Content Generator Settings

Now that AI Engine is set up, we can start generating content. Start by clicking the content tab at the top right of your screen.

Once your screen refreshes, you’ll be taken to the AI Engine content generator. Here, you can easily use it to create content for your site, emails, or even code. Here’s a brief overview of the interface:
1. Topic: Start by adding a topic for the content you want to generate.
2. Templates: Create new templates based on current settings.
3. Title: Insert a title for your content. Alternatively, you can use the topic box to create one for you.
4. Sections: Input text to rewrite it using ChatGPT, or have the AI generate it for you.
5. Content: The body of your content.
6. Excerpt: Used to generate a post excerpt.
7. Select between posts and pages.
8. Create Post button.
9. Content parameters: Includes a language selector, writing style, and writing tone for your content.
10. Post Parameters: Choose between posts and pages.
11. Model Parameters: Set the temperature, max tokens, and model.
12. Prompts: Shows the prompts used, along with variables. Prompts are saved in templates for reuse.
13. Usage Cost: Allows you to see the cost of the current generation.
Generating Content With AI Engine

Now that you are familiar with the settings in the content generator, we’ll demonstrate how easy it is to create a blog post with AI Engine. Start by adding the following topic: How to Make Money with ChatGPT. Then click the Generate button.

After clicking the generate button, AI Engine will enter a title based on the topic you entered. The next step is to create sections. Choose the number of sections you’d like. For this tutorial, we’ll set the number of sections to 3. Then click the generate sections button. ChatGPT will create them and add them to the page.

Next, choose how many paragraphs you’d like to generate per section, then click generate content. We’ll add two paragraphs per section here. Depending on how many you choose to create, it could take up to a couple of minutes.

Then, you can generate an excerpt for your post based on the surrounding content.

Finally, choose whether you want your new content added as a post or a page. We’ll select posts (1), then click the create post (2) button.

Your new post will be created as a draft, so you can go in and make edits, add images, and publish it at your convenience.

Adding a Chatbot to WordPress

Another cool feature of AI Engine is the ability to create a chatbot to display on your website. It only takes a few minutes and can help with customer engagement by answering questions, pointing customers to a specific product or service, and more.

By default, AI Engine comes with a chatbot ready to integrate into your site, so to get it up and running, you can leave the settings as is and copy the shortcode to embed it wherever you wish. However, you can use some additional settings to make it more functional. For example, you can set it as a popup, make it full-screen, and style it to match your branding.

Whether you need to generate copy for your website or incorporate a chatbot to help with customer service, AI Engine is a great way to incorporate ChatGPT in WordPress.

Final Thoughts on Using ChatGPT in WordPress

The emergence of ChatGPT has significantly changed how business owners and creative professionals create content. It can handle many tasks, including making headlines and blog outlines to complete blog posts in minutes. The integration of ChatGPT in WordPress through breakthrough generative AI tools like Divi AI and WordPress plugins like AI Engine, stand to change the way we work within WordPress. These tools empower creators to efficiently generate high-quality content, enhance user engagement, optimize SEO, and more. As the partnership between the two advances, we should all look forward to the future of AI in WordPress.

Would you like to learn more about using AI? Check out a few of our AI-related posts:
Featured Image via sofirinaja /Â shutterstock.com

The post How to Use ChatGPT in WordPress (2023 Tutorial) appeared first on Elegant Themes Blog.
09.09.2023
How to Make an AI Voice in 2023 (Tutorial)
Since ChatGPT hit the scene in late 2022, new generative AI (artificial intelligence) programs have been popping up everywhere. One of the more unique types of artificial intelligence is AI voice, which allows you to use text prompts to create voice clips for marketing, employee training, and more. In this post, we’ll show you how to make an AI voice using a popular program, PlayHT. Let’s dive in.

What is AI?

image created with Midjourney

Artificial intelligence is an expansive technology that allows computers to perform extensive tasks that humans would normally do. However, those tasks take a fraction of the time with AI systems. There are several types of AI, the most common being narrow AI. This type of AI is used to create images, voice, music, and text from a simple text prompt.

What is AI Voice Generation?

image created with Midjourney | Photoshop AI

AI voices are computer-generated voices that mimic human voices’ sounds, features, and tones. They either start as text or by recording your own voice to create a unique human-sounding voice. Through the power of AI’s text-to-speech technology, creators can develop voices for podcasts, voiceovers, or serve as assistive tools for the visually impaired.

How do AI Voice Generators Work?

image created with Leonardo | Photoshop AI

AI voice generators require a text preprocessor, phonetic transcription, and voice synthesis in order to work. The first step, text preprocessing, takes the raw text and makes it all neat and organized. It breaks down words into smaller parts called tokens, fixes weird artifacts like contractions or special characters, and turns numbers into actual words.

Then, in the second step, those tokens are analyzed and given tags like verbs, nouns, or adjectives. This helps the system understand how each word should be used and what it means in the context.

Now, here’s where the magic happens. The text goes through phonetic analysis, which means it’s converted into a special kind of writing that captures how words should sound when spoken. This includes stress, tone, and rhythm to make the speech sound natural.

Finally, in the last step, all that hard work pays off. The phonetic transcriptions are turned into real speech using sound waves. Thanks to modern AI algorithms, the speech generated nowadays sounds way more natural and human-like than the text-to-speech engines of the past.

How to Make an AI Voice

Voice generators have come a long way since IBM released Shoebox in 1962. Modern systems, such as PlayHT, have a variety of synthetic voices with varying tones, making it possible to create the most realistic voices. Other tools, such as MurfAI, will allow you to adjust the pitch, tone, and speed. In this tutorial, we will use PlayHT to create an AI voice.

Step 1: Creating an Account

The first step in the process is to create a free PlayHT account. Start by navigating to the home page, then click the try for free button at the top right of the screen.

You can sign up using a Google account or enter your name and email. Use your chosen method, then click sign up to continue.

In the next step, choose whether you plan to use PlayHT as an individual or in a company setting.

PlayHT will ask questions about how you will use the software in the next few screens.

Once your selections are made, and your account is created, you can begin exploring the interface.

Step 2: Exploring the Interface

Let’s get familiar with the interface before we generate our first voice:
1. Create new file: This is where you’ll create your first project.
2. Recent files: A list of your most recent projects.
3. Files: Where all of your files are located.
4. Voice cloning: You can upload audio of a voice, then clone it for use in the software.
5. API access: For integrating PlayHT into other applications
6. Billing: Manage your account.
7. Language selector: English is the only option right now, but other languages are in the works.
8. Word count: Allows you to see how many remaining words are available.
9. Generate all paragraphs: Used to generate an AI voice.
10. Import video: Add voiceovers to an uploaded video.
11. Text prompt: Text input for AI voice generation.
12. Audio controls: Adjust the timeline of your voice, and rearrange clips.
13. Export project: Save your project by paragraph or as one wav file.
Step 3: Generating Your First AI Voice

Generating an AI voice with PlayHT is simple. You can create your own script or use an AI chatbot to assist you. In this tutorial, we’ll use ChatGPT to generate the text for our voice. Start by clicking the create new file button to create a new project for our voice.

Next, we’ll choose a synthetic voice for the project. To do this, click the voice icon directly above the text prompt.

A new popup window will appear, allowing you to sample one of more than 130 AI voices. To choose one, simply click on it (1), select the playback speed (2), choose to apply the voice to all paragraphs in your project (3), then confirm the changes (4).

We’ll choose Hudson because he sounds the most realistic and has a good narrative voice for our script.

Use ChatGPT to Generate a Video Script

Now that we have our voice selected, we’ll need to generate some text. We’ll ask ChatGPT to create a short video script providing interesting facts about dogs. We used the following prompt: Provide a brief video script to showcase 5 unknown facts about dogs.

Once the script is generated, we’ll need to input some text for our project. We’ll start by pasting the intro of our script into PlayHT: Hello, dog lovers! Today, we will uncover five fascinating and lesser-known facts about man’s best friend, dogs! So, grab a treat, sit back, and let’s dive in!

To generate the voice, click the play icon to the left of the text prompt.

PlayHT will generate the text using Hudson’s voice. Depending on the amount of text you use, the generation process could take up to a few minutes. Once complete, you’ll be able to preview the voice by clicking the play button (1) to the right of the screen. If you aren’t satisfied with the result, you can click the regenerate button (2) to try again.

Here’s how the first paragraph sounds:

While this does sound pretty good, it could use a bit of adjusting. The breaks in the voice don’t sound quite right, so we’ll make a couple of adjustments.

Regenerating Output

PlayHT allows you to make changes to the text input, then regenerate it. This is helpful when the output isn’t up to your standards. A good tip is to add dashes between sentences to create a natural pause. With AI voice generators, there is a tendency to rush the text, creating unnatural run-on sentences. So, to correct this, we’ll change our original prompt to: Hello dog lovers! – Today, we will uncover five fascinating and lesser-known facts about man’s best friend – dogs! – So, grab a treat, sit back, and let’s dive in!

Here are the results:

Step 4: Voice Cloning

Another cool feature of PlayHT is the ability to create your own AI voices. It works by uploading a 30-second clip, then transforming it into a usable AI voice for your projects. To start, click the voice cloning tab in the PlayHT interface.

Next, click the create a new clone button.

Since we are using the free license, our only option is to choose the instant option, which creates an AI voice from a 30-second sound clip.

Next, give your voice a name (1), choose a gender (2), upload an audio file (3), confirm that you have the rights to use the clip (4), and click create (5).

Once the clone is created, it will appear underneath the create a new clone button (1). From there, you can use it (2), share it (3), or delete it (4).

To see how it sounds, add a text prompt to preview it. To be honest, we were pretty impressed with the results:

Step 5: Exporting a Project

The last step in the creation process is exporting your sound files. You can do this one of two ways: exporting one paragraph at a time or all paragraphs in one file. For most creators, it makes sense to export files separately. That way, you can add cut scenes and other effects between each one. To export your files, click the export button at the top left of the screen.

A drop-down menu will appear with two options: each paragraph separately and as a single audio file.

All files are exported as wav audio files, which can be imported using any audio software.

Best Practices for AI Voice Generators

Understanding a few best practices when creating clips to get the most out of AI voice generators is important. First, separate sentences by adding a dash (-). This lets the algorithm know there should be a pause and will typically eliminate run-on sentences. Similarly, commas and semi-colons can add a natural pause between words. On the other hand, avoid hyphens between words in a sentence. For example, you would use landlocked rather than land-locked.

You should also add spaces between acronyms to help AI understand that there should be individual spoken letters rather than words. For example, instead of using AI, use A I. You can also add a period between letters in acronyms. To avoid word repetition, rephrase your text to include punctuation, such as commas, semicolons, or hyphens. Another way to remedy repetition is to break sentences down into smaller ones. This prevents the AI from becoming confused, which usually ends with undesirable results.

Final Thoughts on Creating an AI Voice

AI voice generators are changing the way creators make audio. Through artificial intelligence software like PlayHT, you can create voices for podcasts, YouTube videos, marketing videos, training materials, and more. As AI technology advances, the future of voice generation holds tremendous potential, opening doors to more immersive experiences.

For those interested in exploring other AI applications, our blog has plenty of posts to help you become an AI superstar in no time.
Featured Image via Pro_Vector /Â Shutterstock.com

The post How to Make an AI Voice in 2023 (Tutorial) appeared first on Elegant Themes Blog.
08.09.2023
How to Speed Up WordPress with 15 Tips (2023)
One of the biggest issues WordPress website owners face is a slow website. When your website is lagging, it can affect placement in search engine ranking pages (SERPs), cause your visitors to leave and never return, and can even affect your conversion rates. In this post, we’ll offer fifteen tips (and some bonus ones) to speed up WordPress.

Let’s get started.

Why Should You Care About WordPress Speed?

The first and most critical thing to remember is that no one likes a slow website. It doesn’t matter how fancy it is; if it doesn’t load in under 3 seconds, most people will bail and never return. A high bounce rate is detrimental because you could miss out on sales, lose potential customers, and even scare off those who frequent your site.

Another downside to a slow website is a poor position in the SERPs. Google uses core web vitals to gauge how well your site is performing. If your site loads slowly, Google will penalize you heavily, pushing your site’s content down in search results. One of the most important metrics to watch is the time to first byte (TTFB), which measures how long it takes to get the user’s browser to the first byte of info from your site’s server.

Lastly, if your site is slow, it could discourage visitors from purchasing, signing up for a newsletter, or even reading a blog post. Generally, a slow site translates into unhappy customers who aren’t willing to give you their time, much less their money.

How to Speed Up WordPress

Throughout this post, we’ll provide you with actionable ways to increase the speed of your site. Before we get to that, though, let’s discuss an important first step to measure how your site is performing so that you can take the necessary steps to correct it.

1. Conduct A Speed Test

The first thing you should do when you notice your website lagging is to perform a speed test to measure its speed and performance. There are a few you can use, including GTmetrix, Pingdom, and Google’s Page Speed Insights.

To demonstrate the process, we’ll walk you through using GTmetrix to run a scan. Copy and paste your website URL into the text field (1) and click test your site (2).

It will take a few minutes for the scan to complete. Once finished, you’ll understand why your site is not performing well. GTmetrix measures things like performance, structure, largest contentful paint, total blocking time, and cumulative layout shift:

Breaking Down the Results

Using the screenshot below, we see we have a couple of issues with our test site. Within the performance tab, we can see that our site is struggling with a higher-than-recommended largest contentful paint score, along with a page index speed of 5.1. This means that it takes 5.1 seconds to load our page, with the largest element taking a whopping 7.8 seconds to fully load. As a general rule, your site should load in less than 3 seconds to keep visitors on your site.

We can gain insight into what is causing our site to load so slowly on the structure tab. As you can see, we have several images that are way too big, causing our page to load slowly. In addition, a few large network payload issues due to javascript files that are hogging resources.

The results you see will vary depending on the needs of your site, but as you can see, GTmetrix will provide you with all of the necessary information so that you can take steps to speed up WordPress.

2. Choose the Right WordPress Hosting Provider

One of the best ways to speed up WordPress is by choosing a fast hosting provider. One of the best, SiteGround, is one of the fastest hosting providers available due to its Google Cloud infrastructure and Nginx webserver. Unlike Apache, which is still utilized on a lot of websites, Ngnix has performance enhancements that make it much faster than its counterpart. Another advantage of SG is its custom PHP and MySQL setup, which makes sites hosted on it blazing fast.

Regardless of the hosting partner you choose, be sure to check what speed-enhancing features they offer before signing up.

3. Optimize Core Web Vitals

As mentioned, you should familiarize yourself with Google’s core web vitals and what each means. These metrics are crucial to your website’s success in search results, so staying on top of these is a must. To help you understand what each does, here’s a simple definition for each:
- Largest Contentful Paint (LCP): The time it takes to load the largest image or text on a page.
- First Input Delay (FID): Measures the time from a user’s first click to when the browser begins to process the response.
- Cumulative Layout Shift (CLS): Measures unexpected layout shifts on the page. When a visible element changes its position from one frame to the next (layout shift).
- First Contentful Paint (FCP): Measures the time needed to load the page once the first element (text, images, videos, etc) loads.
- Interaction to Next Paint (INP): Assesses a page’s overall response to user interactions (clicks, taps, etc.)
- Time to First Byte (TTFB): Calculates the time it takes between the request for a resource and the first byte of information loading.
4. Choose Premium DNS

In addition to hosting, choose a reputable domain name registrar, such as Namecheap, who offers a premium domain name system (DNS). Premium DNS is a paid service offered by DNS providers to enhance the performance, security, and reliability of a website’s domain name resolution process. Basically, DNS translates human-readable domain names (like elegantthemes.com) into IP addresses that computers use to locate servers on the internet.

Premium DNS offers several advantages over free DNS services, such as faster performance, enhanced security, better reliability, DDoS protection, and more customization options. Premium DNS providers often have a more extensive network of servers that are strategically located around the world. This helps reduce the time it takes for a user’s request to be resolved, resulting in quicker loading times.

5. Keep Your Site’s Database Clean

Another way to speed up WordPress is by keeping your site’s database clean. Over time, post revisions, comments, and other orphaned data can build up, bloating your site’s database and adding unnecessary bulk. To ensure a speedy, clutter-free database, consider installing a database optimization plugin, such as WP-Optimize.

WP-Optimize is an all-in-one solution for cleaning your database, compressing images, and minifying clunky CSS and JS files. When you keep your database optimized, you can limit potential errors that may arise, all while holding image and script file size in check. Before optimizing your database, be sure to make a backup first. Failure to do so can result in database errors, which could break the connection between your site’s files and database.

6. Use a CDN

image via VectorMine | Shutterstock.com

If you’re looking for ways to speed up WordPress, incorporating a content delivery network (CDN) is an excellent option. A CDN is a collection of computer servers used to store website files. It typically encompasses servers worldwide, serving your website’s files to visitors based on their location. By delivering files from the closest point to your site’s visitors, your website will load much faster. CDNs work as a failsafe, too. For example, if one server housing your files goes down, another can swoop in and save the day, ensuring your site stays up and running. Depending on your hosting provider, you may already have access to a free CDN. Most reputable ones, like SiteGround, offer a free CDN to their customers as part of a hosting package.

7. Cache Your WordPress Website’s Files

When it comes to speeding up your WordPress website, adding a caching plugin can definitely help. Every time a user lands on your site, the browser sends a request to your website’s server to view the pages. Depending on how many images, videos, and other elements you have, that can take significant time. When you use a caching plugin, your site’s files are temporarily stored and served to your visitors much faster. Most managed WordPress hosting providers will provide caching with a hosting plan, but for those who don’t have that option, plugins like WP Rocket are an excellent option.

8. Minify CSS, JS, and HTML

When you minify your site’s CSS, javascript, and HTML, you can reduce page loading time, making visitors and Google happy. While it won’t be a drastic difference, when you combine minification with other tips on this post, your site will be screaming fast in no time. Minifying these files removes unnecessary characters in your site’s code, cleaning it up and serving them more quickly when called by the browser. There are several ways to go about it, including online tools, manually (which is not recommended), or by using a plugin. Most speed optimization plugins, such as NitroPack, will do all the hard work for you, ensuring your site loads fast without breaking the code.

9. Enable GZIP Compression

image created with Divi AI| Photoshop AI

Despite having caching and image optimization tools, enabling GZIP compression on your website can further enhance its speed. GZIP, a compression technique, reduces the size of resources like web pages, stylesheets, and JavaScript files by compressing them before transmission. This minimizes data transfer, resulting in quicker loading times. When a browser requests a page, the server checks for GZIP support. If supported, the server compresses files before sending. Upon receipt, the browser decompresses and displays the content. GZIP not only accelerates WordPress but also improves bandwidth efficiency and SEO. Some caching plugins like WP Rocket enable GZIP automatically. Others, like WP-Optimize, offer it but require manual activation.

10. Optimize Images

One of the biggest speed hogs in WordPress is images. If not sized correctly, they can obliterate your TTFB. They can also hurt SEO and your rankings in the SERPs. To avoid this, always ensure that your images are sized correctly. While you can do this manually, sites with hundreds or even thousands of photos require a more practical solution: an image optimization plugin. These plugins work by resizing existing images and automatically resizing the ones you upload. A good option is Ewww Image Optimizer, which resizes images as you upload them, removes embedded metadata, and uses lazy-loading to compress your images. In addition to that, it can convert the images on your site to WebP format, which will drastically reduce image file size.

11. Host Videos Outside of WordPress

image via YoGinta | Shutterstock.com

Videos are great for marketing, are perfect for introducing your brand to the world, and provide interest for your site’s visitors. That said, they will kill your site’s speed. It’s best to host videos outside of WordPress, like on YouTube, Vimeo, or Amazon S3. If you use a theme like Divi, you can embed YouTube and Vimeo links in design elements, but for others, you’ll need a YouTube plugin.

You take the pressure off your web server to do the hard work by embedding videos with a link. YouTube works fine for embedding videos in your site, but if you want to use video backgrounds, you’d be better served using Vimeo. While it does require a paid subscription, it offers tools to strip the branding from your videos, offering a more streamlined experience for your users. If you want a side-by-side comparison of the two, check out our Youtube vs. Vimeo post to help you decide which is best for your situation.

12. Minimize the Use of Plugins

WordPress plugins are a great way to add new functionality to your WordPress site but should be used sparingly. As a general rule, you should only use absolutely necessary plugins. One common mistake new WordPress users make is trying out different plugins, then leaving them installed on their websites. It’s best to only use what is needed, deactivate and delete plugins that aren’t in use, and always run a database cleanup after uninstalling them. That way, you cut down on database bloat, keeping your site running smoothly. In addition, be sure to always keep your plugins updated. Outdated plugins can lead to security vulnerabilities, which can entice hackers to do harm. That said, be sure to update plugins safely to avoid unnecessary downtime.

13. Keep PHP Updated

One of the most overlooked speed-boosting steps you can take for your WordPress site is to update PHP when needed. PHP updates are released periodically, with older versions being discontinued regularly. It’s important to keep PHP updated for several reasons. First, an outdated version of PHP can slow your site down. As updates are released, they usually contain performance-enhancing features to help WordPress process requests more efficiently. Secondly, outdated PHP can be a severe security risk. With hackers and nefarious actors always looking for a way in, having crucial software like PHP updated is a must. Another consideration is the number of PHP workers on your server. If PHP is up to date and you have a resource-heavy website, it might be time to contact your hosting provider and ask how many PHP workers are running and whether you can add more.

14. Stay on Top of Comments

Another overlooked aspect of WordPress is comments. Although comments alone don’t typically affect site speed, when combined with other factors, comments can be a source of sluggishness on your WordPress site. To keep comments in check, consider installing a comment plugin along with routine cleaning to ensure that your site’s database isn’t filled with hundreds (if not thousands) of unnecessary comments. Using a database cleaning plugin along with a comment plugin, such as Akismet, is a great way to moderate comments, engage with your users, and keep the spam out and bloat minimal.

15. Pick the Right Theme

Last but certainly not least, choose a fast WordPress theme, like Divi, to help speed up WordPress. You should keep a few things in mind when looking for a new theme. First of all, is it responsive? A theme that works well on any screen size is a must considering Google adopts a mobile-first mentality regarding search engine rankings. Secondly, opt for a theme that offers performance enhancements through code minification, dynamic framework, and other speed-boosting features.

With Divi, you’ll get all of those things and a lot more. A few features include a dynamic framework that allows loading only what is needed – on the fly. Additionally, Divi’s CSS is dynamic, too. It’s broken into hundred of smaller components, then combined on each page to produce a fast-loading website that only uses what is necessary rather than loading the entire stylesheet. In addition to dynamic CSS, Divi offers Google font caching and asynchronous Javascript and removes unneeded resources, such as emojis. If you’re looking for a WordPress theme that’s efficient and has the design chops to create the site of your dreams, Divi is the way to go.

Bonus Tips

In addition to the tips above, there are a few other things you can do to speed up WordPress:
- Turn off automatic updates: Although this may seem counterproductive, it’s best to update plugins manually, as leaving auto-update on involves a constant background process which can slow your site down.
- Disable trackbacks and pingbacks: WordPress comes with a feature in settings > discussion that enables trackbacks and pingbacks. While they can be useful, they can also be a speed-sucker. Therefore, it’s recommended to disable them.
- Limit the number of posts on the blog roll page: If site speed is an issue on your blog, consider limiting the number of blog posts you feature on any one page. Remember, your browser has to load every element on a page before delivering it to the browser, so if you have a lot of posts on one page, you could be causing your site to load slowly.
- Enable object caching: A type of server-side caching, object cache involves storing database queries to serve specific data within a server request. When enabled, there will be far fewer requests made, thereby speeding up WordPress.
- Delete unused images: Leaving unused images on your site can cause massive slowdowns. So if you aren’t using them, get rid of them.
- Manage cron jobs: Cron jobs are useful for setting up automatic tasks, but using too many of them can really slow your site down. Try to limit the number you create to keep background processes at a minimum.
- Optimize Google Fonts: Google fonts are great for UX but not so much for page speed. Follow these tips to keep your site running optimally when using Google fonts.
Final Thoughts on Speeding Up WordPress

WordPress is the most popular CMS in the world but left unchecked, it can be slower than molasses. That’s why it’s important to take steps to ensure that it’s running optimally. A slow WordPress site threatens your position in the SERPs and could result in lost revenue. With a good hosting provider like SiteGround and a few strategic plugins like WP Optimize, your site will be screaming fast, have a better chance at ranking well, and will keep visitors on your site, ensuring more conversions and an overall better user experience.

Need more tips? Check out a few of our posts to increase your knowledge of WordPress:
Featured Image via Kapralcev /Â shutterstock.com

The post How to Speed Up WordPress with 15 Tips (2023) appeared first on Elegant Themes Blog.
07.09.2023