• Basics
  • Abyss
  • Web APIs
  • C# & Razor
  • .net API
  • JS & TS API

    Show / Hide Table of Contents

    Edit User Experience in the Page

    you are here (click to zoom) - discover the stack

    2sxc has powerfull CMS features, most of them just work by magic. You can also modify the behavior to fit your needs.

    When users edit content they usually use in-page buttons to access edit-dialogs and more. Here is a short overview and links to what you need to know.

    The Standard Edit Dialogs

    Editing mostly happens in stand-alone dialogs which are JavaScript based (built using Angular). These dialogs are typically dialogs like

    1. edit an item
    2. edit a combination of items - like a content item and an assigned presentation-settings item

    Note that other edit-actions happen in-page directly, like move-up/down in a list etc.

    All about Toolbars and Editing

    1. In-Page Item Edit Toolbars

      1. Most of the concept is explained in InPage Toolbars.
      2. You will usually create such toolbars from the Razor templates - read about Edit.TagToolbar and Edit.Toolbar
    2. The hovering insert-modules toolbar-system is called quickE for quick-edit. There you will also see how to customize the editing experience.

    Customize Toolbars and Buttons

    If you want to do more than the default toolbars do, you want to read about:

    1. Html toolbars and buttons to customize the toolbars
    2. Toolbar settings to configure alignment, hover etc.
    3. Buttons to understand in details how buttons work and how to customize them
    4. There is also a more technical article if you want to see deeper into the JavaScript.
    5. Commands to understand which commands the CMS can run, and how to call them from normal links
    6. Custom Code Buttons to create buttons which run your custom code

    Customize QuickE (Quick Edit)

    You can also Customize / Configure QuickE (Quick Edit).

    Create Custom Input Fields (in the Edit Form)

    1. How to create Custom Input Fields

    Customize the Inner-Content Editing Behaviors

    TODO: Inner Content - edit/config Documentation WIP - so for now just learn about Inner Content

    Read also

    1. Blog post about Introducing Shake - Mobile Content Editing just turned sexy
    2. Blog post about Toolbars for Designers and Developers
    3. Blog post about Customize in-page toolbars
    4. Blog post about Calling commands from links
    • Improve this Doc
    Back to top Generated by DocFX