Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Jon Herrell 13 posts 67 karma points
    Aug 13, 2014 @ 17:51
    Jon Herrell
    0

    Documentation for Umbraco 7 backoffice customization

    I'm having a very hard time finding any documentation on how to customize the backoffice web client (Angular) for Umbraco 7.1+.

    For instance, can you do the following and how is it best done?

    • Create new custom actions for context menus
    • Show/hide context menu items based on a node type and possibly even the node content
    • Hook into an existing action at various points in the process, or override the existing action.
    • Hook into existing events on the client side (and where do I find a list of the events I can hook into)

    Perhaps some of this stuff doesn't exist, but I suspect there are ways of doing this.

  • Jordy van Eijk 7 posts 51 karma points
    Aug 13, 2014 @ 23:12
    Jordy van Eijk
    0

    This is exactly the things i want to know. Im strugling with the views for the backend. I can create trees in custom sections but i can't figure out when i click a node how to show the information in this node.

  • Jon Herrell 13 posts 67 karma points
    Aug 13, 2014 @ 23:31
    Jon Herrell
    0

    Everything I've seen seems to focus on creating your own tree from scratch. I'd like to modify the actions a little depending on DocType and still use the main content tree...if that's possible.

    Jordy, have you seen this? https://github.com/perploug/UkFest-AngularJS-Demo

  • Jeavon Leopold 3074 posts 13632 karma points MVP 11x admin c-trib
    Aug 13, 2014 @ 23:54
    Jeavon Leopold
    0

    Hi Both,

    Have you found the "extending Umbraco" documention here? There is quite a lot of details for v7, such as trees, sections assets etc in there.

    Jeavon

  • Veronica Burd 76 posts 201 karma points
    Sep 16, 2014 @ 09:45
    Veronica Burd
    0

    Hi,

    I'm in the same boat in that I'd like to create a context menu that would appear only when a certain document type is selected.  However, the documentation for Menu Items is not available (coming soon).  

    I've also had a look at http://umbraco.github.io/Belle/#/api but the treeService does not seem to have any way of adding a custom menu entry.

    Ver.

  • Steve Morgan 1349 posts 4458 karma points c-trib
    Sep 22, 2014 @ 11:28
    Steve Morgan
    1

    Hi Veronica,  

    It sounds like you have a custom tree with lots of child nodes - I don't have this but I do have a custom tree with a few different parent nodes that work like a menu. 

    If this helps you then this is how I have a different set of custom menu options. Each option only has a single menu option but they do different things.  I hope this helps.

    Here's my tree controller - the "route" is to different back office angular pages, be very careful to match the case

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Net.Http.Formatting;
    using System.Web;
    
    using Umbraco.Core;
    using Umbraco.Web.Models.Trees;
    using Umbraco.Web.Mvc;
    using Umbraco.Web.Trees;
    
    
    /// <summary>
    /// Summary description for CustomSectionTreeController
    /// </summary>
    
    [Tree("CustomSection", "CustomSectionTree", "My Custom Section")]
    [PluginController("CustomSection")]
    public class CustomSectionTreeController : TreeController
    {
        protected override TreeNodeCollection GetTreeNodes(string id, FormDataCollection queryStrings)
        {
            // check if we're rendering the root node's children
            if (id == Constants.System.Root.ToInvariantString())
            {
                // add nodes to tree
                var tree = new TreeNodeCollection
                {
                    // routepath HAS to be /appsection/treealias/htmlview/ID 
                    CreateTreeNode("1", "-1", queryStrings, "View Quotes", "icon-dollar-bag", "/CustomSection/CustomSectionTree/quotes/-1"),
                    CreateTreeNode("2", "-1", queryStrings, "View Sales Leads", "icon-handshake",  "/CustomSection/CustomSectionTree/salesleads/-1"),
                    CreateTreeNode("3", "-1", queryStrings, "View Applications", "icon-mailbox", "/CustomSection/CustomSectionTree/applications/-1"),
                    CreateTreeNode("4", "-1", queryStrings, "View Complaints", "icon-iphone", "/CustomSection/CustomSectionTree/complaints/-1")
                };
    
                return tree;
            }
            // this tree doesn't support rendering more than 1 level
             throw new NotSupportedException();
        }
    
    
        protected override MenuItemCollection GetMenuForNode(string id, FormDataCollection queryStrings)
        {
            // create Custom Section menu items e.g. "Delete Quotes"
            var menu = new MenuItemCollection();
    
            var m = new MenuItem();
    
            switch (id)
            {
                case "1":
                    m.Alias = "deletequotes";
                    m.Name = "Delete Quotes";
                    m.Icon = "settings-alt";
                    break;
                case "2":
                    m.Alias = "deletesalesleads";
                    m.Name = "Delete Sales Leads";
                    m.Icon = "settings-alt";
                    break;
                case "3":
                    m.Alias = "deleteapplications";
                    m.Name = "Delete Applications";
                    m.Icon = "settings-alt";
                    break;
                case "4":
                    m.Alias = "deletecomplaints";
                    m.Name = "Delete Complaints";
                    m.Icon = "settings-alt";
                    break;
            }
    
            menu.Items.Add(m);
    
            return menu;
        }
    }
  • Veronica Burd 76 posts 201 karma points
    Sep 22, 2014 @ 11:44
    Veronica Burd
    0

    Hi Steve.

    I don't have a custom tree.  However, I'd like to add a custom menu entry for certain document types in the content tree. For example, I have a Sitting document that can have children of type Ruling Issued, Ministerial Statement, BillStatus and Motion.  I'd like to offer my users a custom menu option that will allow them to copy the Sitting document and only the children of type BillStatus and Motion.  The other document types (i.e. Ruling Issued and Ministerial Statement) should not be copied to the new Sitting. I also do not want to show them the relate option as this is not required in this case.

    Will have a look at this and see how I can customise to use with content tree.

    Thanks for your help,

    Ver

  • Steve Morgan 1349 posts 4458 karma points c-trib
    Sep 22, 2014 @ 12:12
    Steve Morgan
    0

    Hi Veronica,

    That is an interesting idea - afraid I don't know if that is possible and I doubt my custom section code will help much. Hopefully someone from the core team can advise. This area definitely needs some more documentation. Hopefully questions like this will help flesh it out. 

    Steve

     

  • Jan Hansen 20 posts 50 karma points
    Nov 30, 2015 @ 14:13
    Jan Hansen
    0

    You may find this part of the documentation usable: https://our.umbraco.org/documentation/Extending/Section-Trees/trees-v7

    You could set this up in an ApplicationEventHandler in an overridden ApplicationStarted-method.

    public class MyAppEventHandler : ApplicationEventHandler
    {
        protected override void ApplicationStarted(
                UmbracoApplicationBase umbracoApplication, 
                ApplicationContext applicationContext
            )
        {
            TreeControllerBase.MenuRendering += (sender, e) =>
            {
                if (sender.TreeAlias == "content")
                {
                    e.Menu.Items.Add(new MenuItem("tweetLink", "Tweet this"));
                }
            };
        } 
    }
    

    This should add the menuitem to the menu of the content-tree (you may have to push the "Do something else"-button in the menu to get to this custom menuitem - along with other menuitems).

    Note that this event is triggered for all nodes in all sections but not all treenodes has an alias (actually not many of them has) so you might have to find other means of identifying which treenode you are dealing with.

  • Veronica Burd 76 posts 201 karma points
    Nov 30, 2015 @ 14:28
    Veronica Burd
    0

    Thanks Jan,

    I never posted the 'finished' code. It's very similar to yours but I placed it in its own method as I may add more custom entries later on. My menu calls a plugin I wrote to display a custom screen and handle the actual copying of sitting type documents and their selected children.

        void TreeControllerBase_MenuRendering(TreeControllerBase sender, MenuRenderingEventArgs e)
        {
            var u = umbraco.helper.GetCurrentUmbracoUser();
    
            //get doc type alias for current node 
            if (sender.TreeAlias == "content")
            {
                IContent doc = sender.Services.ContentService.GetById(int.Parse(e.NodeId));
                if(doc != null && !doc.Trashed) { 
                    if (doc.ContentType.Alias == "Sitting")
                    {
                        MenuItem mi = new MenuItem("CopySitting", "Copy Sitting");
                        mi.Icon = "icon-screensharing";
                        mi.LaunchDialogView("/App_Plugins/HoRSitting/views/copy.html", "Copy Sitting with children");
                        e.Menu.Items.Add(mi);
                    }
    
                }
            }
        }
    

    Ver

Please Sign in or register to post replies

Write your reply to:

Draft