How to Add Related Content for Strapi

12 August 2024

Strapi is an open-source, Node.js-based headless Content Management System (CMS) that allows developers to create powerful APIs for their applications. One of the crucial aspects of creating a robust content structure in Strapi is the ability to establish relationships between different content types. This not only enhances the functionality of your application but also significantly improves user engagement by presenting relevant content through related articles.

In this article, we will explore how to add related content in Strapi, including various types of relations, practical steps to implement them, and best practices to follow. Additionally, we'll look at how Wisp automatically suggests related articles using AI, but we’ll save that discussion for later.

Understanding Relations in Strapi

Introduction to Relations

In Strapi, content is organized into different structures called content types. These can be categorized into Collection types (plural) and Single types (singular). Establishing relations between these content types allows developers to create logical links, effectively managing complex data structures.

Types of Relations

  1. One-to-One (1:1): A single record in one collection relates to a single record in another. For instance, a User can have one Profile.

  2. One-to-Many: A single record relates to multiple records in another collection. For example, a Company can have multiple Employees.

  3. Many-to-Many: Multiple records in one collection can relate to multiple records in another. For instance, Products can belong to multiple Categories.

  4. One-Way: A unidirectional link where one record points to another without a back-reference. For example, User details pointing to User records.

  5. Many-Way: A unidirectional link from one record to multiple others, such as a User owning multiple Cars without those Cars referencing back to the User.

  6. Polymorphic: A single column linking to various types of columns across different collections, such as Tags that can be associated with both Articles and Images.

Step-by-Step Guide to Adding Related Content

Creating a New Content Type in Strapi

  1. Accessing the Content-type Builder: The Content-type Builder is accessible only when the Strapi application is in development mode. In production mode, it is read-only.

  2. Creating Content Types: You have the option to create either a Collection type or a Single type. To create a new content type, choose the type, click on "Create a new collection/single type," and fill in the name of your new content type.

  3. Adding Fields: After creating your content type, you can add necessary fields. Remember that new content types are only created once they have been saved and at least one field is added.

Establishing Relations between Content Types

  • Using the Strapi Admin Panel: You can define relationships within the admin UI by selecting the type of relation while adding fields.

  • Configuration in Schema: For those comfortable with coding, you can also define relation fields directly in the schema.json files. This involves using properties like type, relation, target, etc.

  • Example: Suppose you want to create a related articles functionality. You would create an Articles collection type and establish relations to itself to enable cross-referencing articles.

Advanced Techniques for Related Content

Bidirectional Relations

  • Understanding Bidirectional Relations: These relations allow for linking two records effectively in both directions. For instance, if Article A links to Article B as a related article, Article B should also link back to Article A.

  • Challenges: Implementing this can be tricky, and you might face errors related to naming conflicts. As discussed in various forums, users often encounter issues trying to establish such relations.

  • Example: To implement related articles with bidirectional relations, you can create a simple component to manage the linking dynamically.

Using Components for Relations

  • Creating Components: A reusable component can be created for related content. This component can be designed to embed relational fields to facilitate linking.

  • Implementation Steps: You would define the component's structure and include it in the Articles collection type, thereby effortlessly allowing users to connect related articles.

  • Use Case: Tags can also be an effective way to dynamically link articles. For instance, creating tags associated with articles can allow users to filter and discover content quickly.

Best Practices for Managing Related Content

Designing Relation Schemes

  • When designing your relation schemes, it's crucial to maintain data normalization, ensuring relationships are clear and logical, which aids in the overall maintainability of your database.

Performance Considerations

  • Optimizing queries may significantly enhance application performance. Avoid creating overly complex relationships that could complicate data fetching and management.

Conclusion

Adding related content in Strapi is a vital process that enhances content discoverability and user interaction. By understanding the different types of relations, effectively establishing them, and following best practices, you can create a well-structured content ecosystem.

For those interested in automating related article suggestions, Wisp CMS provides an AI-powered feature that intelligently suggests related content, enhancing user experience.

To learn more about how Wisp can help you streamline related content suggestions, visit Wisp Blog.

References

Choosing a CMS?

Wisp is the most delightful and intuitive way to manage content on your website. Integrate with any existing website within hours!

Choosing a CMS
Related Posts
How to Add Related Content for Directus

How to Add Related Content for Directus

Unlock the full potential of Directus! Learn how to create and manage impactful content relationships with our step-by-step guide. Enhance your user experience and SEO effortlessly!

Read Full Story
How to Add Related Content for Payload CMS

How to Add Related Content for Payload CMS

Discover how Payload CMS's Relationship fields can streamline your content management and elevate user experience seamlessly.

Read Full Story
Understanding Relationships in Payload CMS

Understanding Relationships in Payload CMS

Master Payload CMS relationships: From basic configs to advanced use cases. Discover how to build complex content architectures that elevate your web projects.

Read Full Story