Skip to main content

Glossary

Look up any word you meet in Studio or in these docs. Each entry links to the page that covers it, and bold words inside an entry are the exact labels Studio shows on screen.

Jump to a term (59)

The building blocks​

Component
A React component registered with Studio, or one of the components Studio ships. It's the smallest thing you place on the canvas. See Your components in Studio.
Component slot
A drop zone inside one registered component, declared as a slot prop. Authors drop components into it on the canvas, and your component receives what they dropped. A Section Slot belongs to a section instead, and each template's author fills it. See Slot props.
Composition
What Studio saves when you build a template or a section. It's a layout stored as an entry in your stack, not code. See What is a composition.
Condition Block
A Studio component that shows or hides what's inside it depending on a field's value, such as showing a banner only when a post has a cover image. It's in the Smart Containers group. See Show or hide content with a condition.
Connected template
A template connected to one content type. Entries of that type render through it, at the URL its pattern gives them. If another template's pattern matches the same URL more specifically, that template serves it instead, and Studio warns about the conflict. See Connected or freeform template.
Exposed props
The settings a section's builder lets template authors change each time they use the section, chosen in the section's Expose Props dialog. See Build sections.
Freeform template
A template with no content type, for a one-off page. Its URL is its own and can't use an entry's values. It's available once Enable Freeform Feature is turned on for the project. See Connected or freeform template.
Linked schema
What a section is linked to: a content type, or a part of one such as a group, a global field, modular blocks or a reference field. It tells the section the shape of its data. You add one with Add Schema while building the section. See Linked schema matching rules.
Registering
The one-time step a developer takes to make a component available in Studio, by calling registerComponent from the Studio SDK. It gives the component a tile in the Components tab, a settings form, bindable props and a row in Layers. See Register a component.
Repeater
A Studio component that repeats what's inside it once for each item in a list, such as one card per related post. Its Repeater Mode switch changes that Repeater between Design, where you edit what's inside, and Preview, which shows the result with real data. See Render a list.
Section
A reusable part of a layout, built in Studio from components, such as Post hero. Templates point at sections rather than copying them, so once a section is deployed, every template that uses it shows the new version. See Components, sections and templates.
Section Slot
A space inside a section that the template's author fills with another section. The section's builder can limit which sections are allowed, and can set a default section that shows when the slot is left empty. See Section slots.
Section UID
The unique ID you give a section in the Create Section dialog. It can't be changed afterward. Your code passes it to the SDK to fetch the section, for example as the compositionUid of <StudioComposition /> on the client. A template has a Template UID in the same way. See StudioComposition and Slot props.
Slot
A place where someone drops other components or sections. A section has a Section Slot, and a registered component has a component slot. See Components, sections and templates.
Smart Containers
A group in the Components tab holding three Studio components that work with data and structure: Repeater, Condition Block and Section Slot. See Where data comes from.
Studio project
Studio's workspace for one site. It's connected to one stack and holds that site's templates, sections and settings, such as its environment, language and Canvas URL. See Create a project.
Template
The layout for a page or a kind of page, built from sections and components. A template is either connected or freeform. See Components, sections and templates.

The editor​

Base URL
The address of your site that the canvas loads, taken from the URL your stack's environment has for the project's language. You can't type it in Studio, because it comes from the environment's settings in your stack. You can pick another environment's or language's URL for yourself with the Configuration icon in the canvas toolbar. See Configure your project.
Breakpoint
A screen-width rule your site registers with Studio. Your site's own CSS decides which breakpoint applies at a width, and style changes are saved per breakpoint. The canvas opens on the first one, the default breakpoint. See Register breakpoints.
Canvas
The middle of the Studio editor, where your running site is shown in a frame and you arrange the layout. See Select and arrange elements.
Canvas URL
The project setting that points at the route on your site where sections are built and previewed, which renders the SDK's <StudioCanvas />. Give that route a path of its own, never a catch-all route. Only sections use it, but the project's configuration can't be saved without one. See Mount the section preview route.
Components tab
The Components tab on the left, listing everything you can drag onto the canvas: sections first when you're building a template, then your registered components, then Studio's own groups. See Built-in components.
Configuration dialog
The dialog behind the settings icon in the canvas toolbar, labeled Configuration. It lets you preview with a different environment and language, and it saves that choice only in your browser, so nobody else on the project is affected. Reset puts you back on the project's settings. A Canvas URL you change here is the exception: it's saved to the project for everyone. To change what everyone uses, go to the Settings page. See Project settings.
Data tab
The Data tab on the right, where you attach Pinned Entries, Pinned Queries and Component Data to a layout. It appears once Enable Freeform Feature is on for the project. See Add extra data to a template.
Design tab
The Design tab on the right, where you style the selected component with your design tokens and breakpoints. By default it also accepts any value typed in, and your site can limit it to your tokens. It appears once Enable Freeform Feature is on for the project. See Style on the canvas.
Design token
A named style value, such as a color, a spacing size or a font size, that your site registers with registerDesignTokens. Authors pick one from Use Token in the Design tab instead of typing a value. See SDK API.
Enable Freeform Feature
A toggle on the project's Configuration tab. When it's on, you can create freeform templates. Connected templates and sections also get the Data and Design tabs beside Settings. When it's off, they show only Settings. See Feature flags.
Layers
The Layers tab on the left, an outline of everything on the canvas. You can select, rename, hide, lock and reorder from it. See Select and arrange elements.
Metadata props
Extra meta tags for a template, entered as key and value pairs in Template Details alongside the title, description and Open Graph image. See SEO and metadata.
Playground canvas
The canvas Studio shows when the project has no Base URL. It lets you try Studio without an app, and Deploy is turned off. See Try Studio without an app.
Preview entry
The entry a connected template shows on the canvas while you build it, such as AI 101. Change it with Replace entry in the toolbar. See Preview with a different entry.
Preview URL Pattern
The field in a template's Edit URL dialog that holds its URL pattern, such as /blog/{{entry.slug}}. Studio fills each variable with the field's exact value, without changing its case or spacing, so the field has to hold the value you want in the URL. Don't confuse it with the stack's Custom Preview URL, a Live Preview setting that Studio can copy from when you create a template. See URLs and URL variables.
Settings page
The project's Settings page, with two tabs. General holds the project's name and description. Configuration holds the settings everyone on the project shares: Environment, Language, the Base URL they give, the Canvas URL, and Enable Freeform Feature. See Project settings.
Template Details
The toolbar button that opens a template's title, description, Open Graph image and metadata props, used in search results and link previews. See SEO and metadata.

Data​

Binding
A link from one component prop to one value, such as a heading's text bound to the entry's title. The layout keeps the binding, not the value. See How components get content.
Component Data
Data your app passes in when it renders a layout, for values that aren't in Contentstack. You can type sample data in Studio to design with, and your app's data replaces it on the site. See Bring your own data.
Data Picker
The panel that opens when you select the Bind Data icon beside a property in the Settings tab. It lists the fields you can bind the property to, grouped by data source, with a search box. Studio shows no title on it, and its tooltips and messages call it the data binder. See How components get content.
Data source
A place a bound value can come from: Linked Template Entry, Pinned Entries, Pinned Queries, Component Data, Repeater Data, or a value typed in. See Where data comes from.
Linked Template Entry
The entry a connected template is showing, such as the post at /blog/ai-101. It's the data source you'll bind to most. See Bind a component.
Pinned Entries
Specific entries attached to a layout, beyond the one it's showing. The entries are fixed, and their latest content is fetched each time the page renders. See Add extra data to a template.
Pinned Queries
Saved queries attached to a layout that run each time the page renders, so newly published entries appear without editing the layout. See Add a query.
Repeater Data
Inside a Repeater, the item currently being repeated. See Render a list.
Section Data
The first row in the Settings tab when you select a placed section. It shows which data the whole section reads. Studio fills it in when the section matches the template's content type. Open it to pick other data. See Linked schema matching rules.

Saving and going live​

Deploy
Publishes a composition to the environments you pick, so your site can show it. Studio saves any unsaved changes first. Deploy is turned off on the Playground canvas. See Save, preview, deploy.
Publish
Contentstack's word for making an entry available in an environment. Deploying a composition publishes its entry, which is why Studio's messages after a deploy say "Published". See Save, preview, deploy.
Save
Stores your changes as a new version of the composition in your stack, without making them live. See Save, preview, deploy.
Send with References
The deploy option that also publishes every section the template uses. Send without References publishes only the template. See Save, preview, deploy.

Around Studio​

Compositions content type
The content type Studio creates in your stack for each project, to hold its templates and sections as entries. It's named Compositions unless you change it when you create the project. See Your content model in Studio.
Custom Preview URL
A stack setting in Contentstack that tells Live Preview where each entry lives on your site, with a URL pattern for each content type. When you create a connected template, Studio copies the template's starting URL from it if the setting has a row for the content type. It isn't the template's Preview URL Pattern. See How template URLs work.
Delivery token
The Contentstack token your site uses to read published content. Your site needs one for Studio layouts to load. See Prerequisites.
Edit tags
The data-cslp attributes Visual Editor uses to find editable values on a page. The Studio SDK adds them to values bound to an entry once a developer turns them on. They're off by default. See Make bound values editable in Visual Editor.
Environment
A Contentstack destination for published content, such as production. A Studio project loads your site from one environment's URL, and deploys to the environments you pick. The environment doesn't change which draft content the canvas shows. See Configure your project.
Language
A project setting that picks which of your site's URLs the canvas loads. It doesn't change the language your content loads in, which your site decides. Templates and sections are always saved in your stack's master language. See Your content model in Studio.
Live Preview
The Contentstack feature that shows unpublished changes on your running site. Studio uses it to show draft content on the canvas. See Studio, Live Preview and Visual Editor.
Preview token
A token paired with a delivery token that lets your site read content that's saved but not yet published. With it, the preview host for your region and Live Preview turned on, the canvas shows draft content. See Install Live Preview.
Studio SDK
The package your site installs to render Studio layouts, @contentstack/studio-react. Its <StudioComponent /> renders templates on your site's routes, and its <StudioCanvas /> renders sections on the route your Canvas URL points at. The two aren't interchangeable. See Install the Studio SDK.
StudioComposition
The Studio SDK component <StudioComposition />. It renders one composition with data your code already holds, such as one Post card section for each post on a blog index. You pass it a composition you fetched, or the composition's UID. See StudioComposition and Slot props.
Variant alias
The name of a Personalize variant, which your site passes when it fetches a layout so the content comes back in that variant. The layout itself is the same for every variant. See Fetch a Personalize variant.
Visual Editor
A separate Contentstack tool for editing content values by clicking them on the page. Studio edits layout. Visual Editor edits content. See Studio, Live Preview and Visual Editor.

Report a problem with this page