Editing content directly from your app
Content contributors sometimes need to fix minor errors or typos right away when they see them on your website or app. You can add an Edit button to the preview environment of your application, which redirects users straight to the particular item or even element in Kentico Kontent.
Table of contents
This way, your editors don't have to spend time looking for the right content in Kentico Kontent. This approach is similar to Setting up content preview, just in the opposite direction: Instead of navigating from Kentico Kontent to a preview of the item, you navigate from content inside the preview to the corresponding content item in Kentico Kontent.
Using smart links
To navigate to a specific item in Kentico Kontent, construct a link with the following structure:
To navigate to a specific content element in Kentico Kontent, add the element's codename to the link:
We check if your user role has access to the specified content item.
Navigating to nested elements
You can also link to an item nested in a Linked items or Rich text element in another item. The structure of the relationship will be reflected in the breadcrumbs inside the app for easy navigation.
For example, a link like this
will send you to the following screen:
Note: Currently, you can't directly access elements nested in content components. You can only link to the highest-level Rich text element in which the component is nested.
Below is a simple TypeScript application which uses the TypeScript Delivery SDKOpens in a new window to retrieve a specific content item. Then, it uses the
item.system.language metadata properties of the item to display an Edit link for it.
Note: In most cases, you want to display the edit links only in a preview environment that only your editors can access. But you can also use them in production – it's up to you to limit their visibility according to your needs.
See the code example on https://stackblitz.com/edit/typescript-kc-edit-button
Have a look at a more complex example of an Edit button in our .NET Sample applicationOpens in a new window. The application uses helper methods in our Management SDKOpens in a new window to construct the edit links more easily.