Point: What is Studio.Design CMS?
Studio.Design CMS is a Content Management System (CMS) feature that lets you structure, manage, and update content within Studio.Design. By combining models, items, and properties, you can manage frequently updated article content like blogs and news in one central place.
For more on how Studio.Design CMS works and the basics of using it, see the following articles.
Before you start
The steps in this article assume that you've already created your CMS article content. Please make sure the following are in place:
In the CMS Dashboard, create an article-type model (CMS Model) and CMS article items (CMS Items).
In the Design Editor, use a Dynamic Page to create an article page linked to the CMS article model you created in step 1.
For an overview of the entire process from creating an article to publishing it, also see the following article.
1. Add a User-type model
Writer information is easier to manage when you use a User-type CMS model, which includes an avatar image property.
In the CMS Dashboard, create a new User-type model.
Give the model a name that clearly indicates it's for managing writers, such as "Writer" or "Author."
2. Add user items
Add profile information for each writer to the User-type model.
Add a new item inside the model you created.
Set the writer's profile image (the User type includes an avatar image property).
Add CMS properties for any information you want to display about the writer, such as their name, profile text, and social media accounts.
Create as many user items as you have writers.
3. Reference the User-type model as a property of the article item
Use a Reference property to link the article item you created in Before you start with the User-type model for writer info.
In the CMS Dashboard's model list, select the article item model where you want to show writer info.
In the item list view, add a new property.
For the property type, choose [Reference Model] from the bottom of the property list, and select the User-type model you created in step 1 as the reference target.
Choose either Single Select or Multi Select for the reference method (Single Select works well when there's one writer; Multi Select works well when multiple writers contribute).
4. Set property info for each article item
Use the reference property you created to assign a writer to each article.
5. Add a box on the article detail page to display writer info
On the Dynamic Page (article page) that displays the article item you created in Before you start, place boxes that show the writer's name and profile image.
Open the Page Panel and select the relevant dynamic page.
Add box elements where you want to show the writer info.
For writer name and profile info: Add a Text box
For the avatar image: Add an Image box
If a box doesn't end up where you wanted, use the Layers Panel to move it and arrange the layer structure as needed.
6. Link the added box elements to the CMS properties you set up
Following Link box elements to CMS properties in the Design Editor, connect the box elements you added to the CMS properties you set up.
7. Adjust the design of the box elements
Use the tabs in the right panel to fine-tune the design. If the panel is closed, open the right panel.
For more details, see help articles in the Box Design Settings category and the Box Types category.
8. Check your setup
Verify how the writer info is displayed and its publication status.
Open Live Preview and check that the writer info is shown correctly.
Check how it looks on the published site.
Make sure every related CMS item has its status set to Published.
If everything looks good, publish the site from the Publish panel.
If your site is already live, use Update Site to push the changes to the published site.