kontent-ai
Add Preview Edit Links
Kentico Kontent admin UI now supports navigating to specific content items via URLs in a certain format.
The goal of this task is to enrich the markup of this sample application with the links.
Suggested approach:
- observe the reference implementation in the .NET sample site
- https://github.com/Kentico/kontent-sample-app-net/pull/65
- https://github.com/Kentico/kontent-sample-app-net/pull/67/files
- copy the CSS stylesheets 1:1.
- implement the preview links on the "About us" page
- use the JS SDK to generate the links
Blocked by: https://github.com/Kentico/kontent-delivery-sdk-js/issues/52
Motivation
We want to present to our customers an example of this feature – how they can use that
Solution
When I open About Us preview Then I see enabled "Edit mode" in the fixed bar on the bottom of the page And I am able to click on each element from the page About Us
When I open About Us preview Then I see the link "Open in KC" in the fixed bar on the bottom of the page And I am able to click on it
When I click on toggle button Edit mode Then Edit mode is turned off And I am able to preview page without distraction - only the fixed bar is presented
Design notes
- Do not show button for menu/navigation,Language selector, Dancing goat heading
- For Text element – show edit button next to the element (on the right)
- For Richt text element (and others) – show edit button in the center of the element
- While in Edit mode, I am able to click anywhere on the element (not just on the button) to be redirected to KC
- When I hover over the element, the button should be in hover state
Hello @leniquenoralez, I've just sent you an invitation to the project. If you accept it, I'll be able to assign the issue to you.
Currently there is no support for generating links in javascript SDK (https://github.com/Enngage/kentico-cloud-js/issues/29), so it is required to implement the Preview edit links generation in an application.
It would be great to implement this functionality similarily as it is in content management SDK for .net: https://github.com/Kentico/content-management-sdk-net/pull/8/files (EditLinkBuilder class) to be able to use the code in the SDK in the future.
There is the documentation fot the preview edit links. https://developer.kenticocloud.com/docs/implementing-a-preview-edit-button
If you have any questions, feel free to ask!
Hey @web20opensource , absolutely. This sample project is being updated along with releases of new features in Kentico Cloud.
