Copied to clipboard

Flag this post as spam?

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


  • Owain Jones 21 posts 198 karma points MVP c-trib
    Dec 10, 2019 @ 17:17
    Owain Jones
    1

    Macro custom Content Picker with Start Node

    Hello,

    I'm trying to add a custom content picker (with a start node) to a macro's parameter editor on Umbraco 8.

    I can successfully do this on Umbraco 7 by generating a package manifest, from a custom DataType, with this plugin: Parameter Editor Generator

    Which generates this file:

    {
      "propertyEditors": [
        {
          "alias": "Peg.ReusableContentPickerRichTextContent.2a4bda56-fbbe-4853-b18f-218133d69196",
          "name": "Reusable Content Picker - Rich Text Content",
          "editor": {
            "view": "~/umbraco/views/propertyeditors/contentpicker/contentpicker.html",
            "hideLabel": false,
            "valueType": "STRING"
          },
          "defaultConfig": {
            "showOpenButton": "0",
            "ignoreUserStartNodes": "0",
            "startNodeId": "umb://document/221f086fda99486482c64255670989e9"
          },
          "isParameterEditor": true,
          "group": "Generated Parameter Editors",
          "icon": "icon-autofill"
        }
      ]
    }
    

    And that works brilliantly on Umbraco 7, but if I use that same package manifest on my Umbraco 8 project (with the GUIDs changed accordingly) it almost works, the only part that doesn't is the start node...

    During my digging, I did notice that the DataType config structures are different in Umbraco 8 compared to 7.

    This is how my custom content picker data type's config looks in Umbraco 8:

    <?xml version="1.0" encoding="utf-8"?>
    <DataType Key="cb0bff3c-9244-4b58-a488-19dfd6c150df" Alias="Reusable Content Picker - Rich Text Content" Level="1">
      <Info>
        <Name>Reusable Content Picker - Rich Text Content</Name>
        <EditorAlias>Umbraco.ContentPicker</EditorAlias>
        <DatabaseType>Nvarchar</DatabaseType>
      </Info>
      <Config><![CDATA[{
      "ShowOpenButton": false,
      "StartNodeId": "umb://document/e4c58b7fa7b84207bee2f2ae7f313f25",
      "IgnoreUserStartNodes": false
    }]]></Config>
    </DataType>
    

    and Umbraco 7:

    <?xml version="1.0" encoding="utf-8"?>
    <DataType Name="Reusable Content Picker - Rich Text Content" Key="2a4bda56-fbbe-4853-b18f-218133d69196" Id="Umbraco.ContentPicker2" DatabaseType="Nvarchar">
      <PreValues>
        <PreValue SortOrder="1" Alias="showOpenButton"><![CDATA[0]]></PreValue>
        <PreValue SortOrder="2" Alias="ignoreUserStartNodes"><![CDATA[0]]></PreValue>
        <PreValue SortOrder="3" Alias="startNodeId"><![CDATA[umb://document/221f086fda99486482c64255670989e9]]></PreValue>
      </PreValues>
    </DataType>
    

    This gif shows it working in Umbraco 7:

    enter image description here

    And it not working in Umbraco 8:

    enter image description here

    Has anyone else tried this before? And does anyone know how to properly format the Property Editor package manifest for Umbraco 8?

  • Javed 7 posts 88 karma points
    Dec 11, 2019 @ 01:10
    Javed
    0

    Hi,

    I am also facing the same issue with Umbraco 8.3. Does anyone knows how to fix package manifest file for version 8.3?

    Thanks.

  • Javed 7 posts 88 karma points
    Dec 11, 2019 @ 04:05
    Javed
    1

    After spending 2 hours on Umbraco (8.3) source code, I finally managed to create custom Macro Parameter Editor based on Content Picker and restrict selection to specific node's children.

    Here is the C# code, if anyone interested:

    using Umbraco.Core.Logging;
    using Umbraco.Core.PropertyEditors;
    using System.Configuration;
    
    namespace Umbraco.Web.PropertyEditors
    {
        /// <summary>
        /// Content property editor that stores UDI
        /// </summary>
        [DataEditor(
            "Umbraco.ContentPickerEx",
            EditorType.MacroParameter,
            "Content Picker Ex",
            "contentpicker")]
        public class ContentPickerExParameterEditor: DataEditor
        {
            public ContentPickerExParameterEditor(ILogger logger)
                : base(logger)
            {
                var startNodeId = ConfigurationManager.AppSettings["MacroParamEditors.InfoCardStartNodeId"];
                DefaultConfiguration.Add("startNodeId", startNodeId);
            }
        }
    } 
    

    Hope it helps.

    Thanks.

  • Owain Jones 21 posts 198 karma points MVP c-trib
    Dec 11, 2019 @ 10:10
    Owain Jones
    0

    Hi Javed,

    Glad you've found a solution! :D

    Where did you put that C# code in your solution? And did you need to do anything different with the package manifest file?

    Cheers

  • Javed 7 posts 88 karma points
    Dec 11, 2019 @ 17:26
    Javed
    1

    Hi Owain,

    Glad you fixed manifest file.

    Just for records, I added C# file in VS.NET project with code I pasted above and added app settings in web.config. Build, deploy and I can see my new Macro parameter editor.

    Thanks.

  • Owain Jones 21 posts 198 karma points MVP c-trib
    Dec 11, 2019 @ 11:29
    Owain Jones
    102

    I've fixed it!

    I added a "prevalues" to my manifest that defined the start node and it started working! (also I changed the defaultConfig options to use bools instead of 1s & 0s).

    EDIT: I also changed the StartNodeId to an ID instead of a UDI.

        {
          "propertyEditors": [
            {
              "alias": "ReusableContent-ContentPicker.cb0bff3c-9244-4b58-a488-19dfd6c150df",
              "name": "Reusable Content - Content Picker",
              "editor": {
                "view": "~/umbraco/views/propertyeditors/contentpicker/contentpicker.html",
                "hideLabel": false,
                "valueType": "STRING"
          },
          "prevalues": {
            "fields": [
              {
                "label": "Start node",
                "description": "Choose the start node",
                "key": "startNodeId",
                "view": "contentpicker"
              }
            ]
          },
          "defaultConfig": {
            "showOpenButton": false,
            "startNodeId": "1238",
            "ignoreUserStartNodes": false
          },
          "isParameterEditor": true,
          "group": "Generated Parameter Editors",
          "icon": "icon-autofill"
        }
      ]
    }
    

    I also added a .js and a .html file to my plugin and copied the Content Picker js controller and html view from the umbraco source code and then changed the manifest to reference them instead, as suggested here link!

    {
      "propertyEditors": [
        {
          "alias": "ReusableContent-ContentPicker.cb0bff3c-9244-4b58-a488-19dfd6c150df",
          "name": "Reusable Content - Content Picker",
          "editor": {
            "view": "/App_Plugins/ReusableContent-ContentPicker/ReusableContent-ContentPicker.html",
            "hideLabel": false,
            "valueType": "STRING"
          },
          "prevalues": {
            "fields": [
              {
                "label": "Start node",
                "description": "Choose the start node",
                "key": "startNodeId",
                "view": "contentpicker"
              }
            ]
          },
          "defaultConfig": {
            "showOpenButton": false,
            "startNodeId": "1238",
            "ignoreUserStartNodes": false
          },
          "isParameterEditor": true,
          "group": "Generated Parameter Editors",
          "icon": "icon-autofill"
        }
      ],
    
      "javascript": [
        "/App_Plugins/ReusableContent-ContentPicker/ReusableContent-ContentPicker.controller.js"
      ]
    }
    

    As you can see with this gif, it now works as expected :D (Umbraco 8.3)

    Gif of it now working

    These links helped me with this: https://our.umbraco.com/documentation/Tutorials/Creating-a-Property-Editor/part-2

    https://our.umbraco.com/forum/developers/extending-umbraco/63642-How-to-use-MultiNodeTreePicker-as-a-Macro-parameter-editor

Please Sign in or register to post replies

Write your reply to:

Draft