DEV Community

Cover image for Expand Content Reach Using AI for SEO and Translation in Your CMS
Antonello Zanini for Apostrophe

Posted on • Edited on • Originally published at apostrophecms.com

Expand Content Reach Using AI for SEO and Translation in Your CMS

In recent months, the way we approach our work has changed significantly. AI has become central to many workflows, driving productivity, enhancing efficiency, and providing valuable insights. The CMS industry is no exception to this trend. That is why why Apostrophe recently released two new extensions that leverage AI for SEO and translation.

In this article, you will discover the latest developments from Apostrophe in the AI space. You will learn what the new SEO Assistant and Automatic Translation extensions are, and see how they can streamline your SEO metadata definition and content translation processes with just a few clicks.

AI Applications in the CMS Industry: From Ideas to Reality

In our article published in mid-2023, we examined how AI could transform the CMS industry. During that discussion, we introduced the AI Helper extension to generate images and rich text directly from a prompt within ApostropheCMS.

In the months that followed, those insights were validated and evolved into concrete developments. These ideas were incorporated into Apostrophe's roadmap and have now materialized into two new AI-powered extensions for Apostrophe Pro. 

Let’s dive into these exciting new features!

Introducing New Apostrophe AI-Powered Plugins: SEO Assistant and Automatic Translation

These are two new extensions in the Apostrophe AI offerings:

  • SEO Assistant: Automatically generates SEO page metadata through AI.
  • Automatic Translation: Provides AI-driven translation of documents (pages and pieces) for content localization.

Note: Both extensions are exclusive to Apostrophe Pro and Apostrophe Assembly users. These premium versions of Apostrophe offers advanced features tailored for both developers and editors.

As you are about to learn, both extensions work together to optimize your site’s reach. To better showcase SEO Assistant and Automatic Translation, they will be integrated into the site showcased in our tutorial on how to create an e-commerce platform with Apostrophe. If you are not familiar with that article, you can see an example of in the following video.

Using AI for SEO Optimization in Your CMS

One of the most tedious, yet essential, tasks when handling the SEO of a website is defining the meta title and SEO description of a webpage. This information is key because search engines like Google use it to generate the SERP (Search Engine Results Page) entry associated with your page, as in the following image:

Example of how SEO metadata is used in search results.

This is even more important when considering that over 50% of traffic to business websites comes from organic search (i.e., SEO).

When specifying the SEO meta title and description of a page, there are a few best practices to keep in mind:

  • Both the title and description should be concise, actionable, and to the point. They should also include relevant keywords to help search engines rank your page higher.
  • The meta title should be between 50 to 60 characters long to ensure that search engines do not truncate it in the SERP snippet.
  • The meta description should ideally be between 50 to 160 characters, with an optimal length of around 150/160 characters. For more information, check out Google's best practices of meta descriptions.

The problem is that writing effective SEO titles and descriptions is often seen as a boring task. Ask your editors, and they will likely tell you that they prefer to craft great content rather than focusing on SEO details. 

Additionally, SEO optimization is typically the final step in the publication process. As a result, some editors might overlook it or not give it the attention it deserves to push the page online.

The good news is that SEO title and description values are directly related to the page's content, which opens the door to leveraging AI for SEO. Specifically, the AI-powered SEO Assistant extension can analyze the page content to generate effective meta titles and descriptions for you. 

Let’s explore how this Apostrophe Pro extension works in the section below!

SEO Assistant in Action  

Follow the official integration guide to install and configure the SEO Assistant extension in your Apostrophe application. As of this writing, the prerequisites for using the SEO Assistant are:

In this example, we will use OpenAI as the AI provider, but keep in mind that SEO Assistant also supports custom AI providers.

Now, assume you just created a special web page called “Summer Collection 2024" to promote your clothing line for the summer season. The final step before publishing it is to define the meta title and description.

To reach the page edit modal, click on “Pages” in the top left menu, locate the “Summer Collection 2024” draft page, and select the “Edit” option:

Example of how you get to an edit screen from the page manager.

Navigate to the “SEO” tab, where you will see that both the “Title” and “Description” fields are empty:

Example of the SEO metadata fields when the SEO assistant is installed.

Normally, you would have to manually fill in those fields, but no worries—your AI-powered SEO Assistant is here to help!

Click on the button to access the SEO Assistant options. Select “Make a suggestion based on page content” to instruct AI to generate the selected meta field using the content found on the page:

Example of using the SEO Assistant to suggest a page title.

Now you have three options:

1. Use this suggestion: Populate the field with the AI-generated text.

An example of choosing to use an SEO suggestion and applying that text to be part of the form field that will be saved.

2. Try again: Request an alternative suggestion on the fly.

An example of regenerating an SEO title property with the SEO Assistant.

3. Edit prompt: Manually configure the prompt used to query the AI for SEO meta field generation.

An example of editing the prompt to tailor the SEO title suggestion.

Similarly, you can generate an SEO meta description with a couple of clicks:

Using the SEO Assistant to suggest content for the Description field.

Note: The above example focused on a page, but SEO Assistant also works for individual content pieces. Plus, it can be configured to produce results of a given minimum length.

Amazing! SEO Assistant generated a captivating meta title and description for you in just a fraction of a second. It only remains to click “Publish.”

As shown here, using AI for SEO simplifies metadata optimization and removes the tediousness associated with the task.

Integrating AI for Translation in your CMS

Localizing a website into several languages is critical to reaching a global audience. As of 2023, approximately 1.46 billion people are estimated to speak English worldwide. That represents about 18.07% of the global population—less than 1 in 5 people.

As you can imagine, localization becomes essential when targeting local markets in regions such as Asia, Europe, or Latin America. Thankfully, Apostrophe comes with comprehensive support for localization.

When translating a website, a common practice is to start with layout elements like menus, footers, and headers. Although this initial step can be time-consuming, it only needs to be done once as those elements are shared across all pages. That might create the misconception that translating a website into a new language is a quick task. Well, that is not true!

The real challenge arises when realizing that you have to translate all pages, content, and media files. This process can take up to months, especially on large sites. Luckily, you can now automate the task by using AI for translation.

Let’s see how the Apostrophe Pro Automatic Translation extension can help you translate pages and pieces with just a few clicks!

Automatic Translation in Action  

Follow the integration guide to install and set up the Automatic Translation extension in your Apostrophe application.

Automatic Translation comes with built-in support for Google Cloud Translation and DeepL as AI translation providers (with support for Azure AI Translator coming soon). To integrate them, you just need a valid API key. Keep in mind that the extension also supports custom providers

In this example, we will use DeepL, but any other AI translation provider will do.

Suppose you already configured the es locale in your Apostrophe e-commerce project and translated all layout elements. The next step is to translate all content from English to Spanish, which will make your site more accessible to the 500 million native Spanish speakers worldwide. ¡Empezamos!

This is what the English version of the e-commerce site currently looks like:

Scrolling through an example of the ecommerce starter kit.

The goal is to have the entire site translated into Spanish.

The first document to translate is undoubtedly the home page. To do that, click on "Pages" in the top left menu, locate the "Home" page, and select the "Localize…" option:

Example of localizing a page via the context menu item.

This will open the Automatic Translation modal below:

Screenshot of the Localize Content modal.

A wizard will guide you through the process of configuring how Apostrophe will use AI for translation. Specifically, you will be asked to:

  1. Select the content to localize. The available options are the current document, the current document and its related documents (such as images and any other referenced documents), or only the related documents.
  2. Choose the locales to translate the content into.
  3. Specify the related document types to localize, if you chose to translate them in step 1. You can also decide whether to translate only new related documents or to overwrite existing translated documents. Select the “Translate text content option“ for automatic AI translation.

The home page depends on some related documents. Therefore, the recommended option is "This document and related documents":

An example of how the Localize Content UI is used in the automatic translation workflow.

In the last step of the wizard, you can select which types of related documents you want to localize. Apostrophe will automatically translate them together with the current document.

The following notifications will inform you that the current document and the selected related documents were translated successfully:

Example of notifications received after successful localization and translation of content.

Visit the home page of the Spanish version of your e-commerce site, and you will now see:

An example of scrolling through the ecommerce page after translating it to spanish.

Wow, a good start! However, notice that there are no products or categories on the page. This is because they need to be translated as well.

Before translating them, you may find that you are not satisfied with the translation results provided by the AI. No problem, you can always edit the localized documents using Apostrophe's editing capabilities:

Example of editing a page's settings in the modal after translating it into Spanish.

The translated pages will be saved as drafts in the selected locale(s). This way, a content manager will have to manually review and approve them for publication. Also, Apostrophe will automatically mark the AI-translated fields, as they require additional attention from your editors. 

Also, keep in mind that Automatic Translation also translates the SEO meta title and description into the target language. To verify that, explore the “SEO” tab of the “Summer Collection 2024” page mentioned in the previous chapter:

Example of UI for SEO fields that have automated translations applied.

Observe how both the meta title and the SEO description were translated into Spanish.

Awesome, you are ready to translate products and categories!

Click on "Content" in the top left menu, select a content category, and follow the same procedure as above to translate each piece:

Example of the localize menu action on a Product piece type.

Considering that pieces often involve or are connected to other documents, you can choose the “this document and related documents” option to speed up the translation process.

Use AI to translate all pages and pieces in your project, and this is the end result you will get in just a few minutes:

The finished product after translating the ecommerce page and all of the product categories that are included.

While it may not be perfect, this is definitely impressive!

Similarly, this is what an AI-translated page product looks like:

Example product show page after it's been translated to spanish via the localization capability.

Note: Automatic Translation offers a wide range of options and customizations to tailor the AI content translation experience to your needs. For more details, see the developer documentation.

As proven here, leveraging AI for translation significantly accelerates the content localization process. That creates a tremendous opportunity to make your site accessible to millions of users worldwide.

Benefits of SEO Assistant and Automatic Translation Extensions

A few months ago, it was merely a guess, but now there is little doubt that integrating AI directly into a CMS introduces substantial benefits. Specifically, using AI for SEO and translation provides these advantages:

  • Expanding content reach: AI-driven SEO and translation help to reach a broader audience. Enhanced SEO rankings increase your site's visibility, while localized content resonates with diverse audiences in different regions, significantly boosting the chances of attracting new users to your pages.
  • Improving productivity: Tasks that once required hours of meticulous work can now be completed in seconds. AI handles the heavy lifting, leaving you to refine and personalize the generated content. This shift reduces time spent on manual tasks and helps you concentrate on what truly matters, such as creating outstanding user experiences.
  • Saving money: By delegating specialized tasks like SEO optimization and translation to AI, you may no longer need to hire a team of dedicated experts in those fields. Such a cost-effective strategy enables you to allocate resources more efficiently while still achieving high-quality results, ultimately saving your business money.

The above improvements are made possible by SEO Assistant and Automatic Translation, the new AI-powered Apostrophe Pro extensions. 

These are just a few of the several powerful features available in the Pro and Assembly tiers of Apostrophe, which also include advanced permissions, document version history, and more.

Conclusion

In this article, we looked at what the new AI-powered SEO Assistant and Automatic Translation extensions have to offer. With AI integrated directly into Apostrophe, you can now generate SEO metadata and translate content into any language within seconds and a handful of clicks.

While the current results are already spectacular, this is just the beginning. The Apostrophe team is continually working to discover new and effective AI integrations, and you should be excited about what the future holds.

To get a preview of what's next for Apostrophe, keep an eye on our product roadmap!

Top comments (0)