This article will explain how the "Van Gogh (Museum) - with Headless CMS" sample experience has been built, and how it differs from its previous version: "Van Gogh (Museum)".
The entire experience architecture has been retained from the previous version, and you can learn more by completing the "Build your First Experience" course in Intuiface Academy.
This article will focus on this experience's use of Intuiface Headless CMS (H-CMS), enabling editors to
- Update content such as text and images
- Store content in multiple languages using a flexible structure that makes it very easy to add a new language.
If you are unfamiliar with Intuiface Headless CMS, we suggest you first become familiar with it - either via the Headless CMS chapter in our Help Center or the Headless CMS course in Intuiface Academy - before proceeding with this article.
Structure of the H-CMS base
The content that has been removed from the original Marketplace experience and placed in a Headless CMS base is
- All the text that could be translated
- All the object lists that could evolve over time, such as the list of pictures.
Therefore, the base has the following structure:
- 1 component for General Settings used across the entire experience
- In this sample, only the header navigation buttons are set in an experience layer.
- 1 component per scene, with sub-components when necessary to better organize the content.
The base has one variant - "Language" - with 2 variations: English & French.
The Content tab enables the easy removal or addition of Artwork pictures, as well as the entry of multi-language information for the Title text field defined in the Structure tab.
Below is the Artwork list with text for the English variant:
And below is the French variant:
Modifications made to the experience
Converting the original "Van Gogh (Museum)" sample into this H-CMS-based experience was achieved through these steps:
- Adding the "Sample - Van Gogh (Museum)" H-CMS base to the experience.
- Replacing all locally stored content with their corresponding H-CMS content (titles, navigation, images)
- Replacing Museum information that was stored in Excel with its corresponding H-CMS content, adjusting the bindings when required then removing of the Excel file from the experience.
- Binding all translated text to their corresponding text fields in the H-CMS.
- Adding the two language buttons in the top bar of the running experience.
Reusing this sample / base
At the moment, Headless CMS does not offer a way to duplicate a base or change its ownership. As a result, you will not be able to view or edit the base. Further, if you choose to create a personal copy of this sample experience - using Save As - then you will have to recreate the base for your own Intuiface account and then associate it with your experience copy.
If recreating the base, use the same naming and structure as the H-CMS base discussed above because the experience is constructed to expect those names/structures. (Of course, you can use any naming convention or structure in your base, you'll just have to update the experience accordingly.)
Don't forget you can learn a lot about using H-CMS in our Intuiface Academy. You can also contact our Support Team if you have any questions about this base or the sample experience.
This article will be updated as soon as cross-account base duplication is possible.
Article is closed for comments.