Code Monkey home page Code Monkey logo

skybrud.linkpicker's Introduction

Skybrud.LinkPicker

Looking for the Umbraco 7 version of the package?

Skybrud.LinkPicker is a package for Umbraco 8 that introduces a property editor for adding or editing a single link. Together with Skybrud.Umbraco.Elements or similar packages, it may also be used to create lists of links.

Skybrud.LinkPicker is a small package that adds a single property editor to Umbraco that can be used for picking a link - either being content, media or a custom URL.

image The destination property shows the link picker editor in use. When clicking to add or edit a link, the editor utilizes Umbraco's build-in link picker overlay.

Installation

  1. NuGet Package
    Install this NuGet package in your Visual Studio project. Makes updating easy.
  1. ZIP file
    Grab a ZIP file of the latest release; unzip and move the contents to the root directory of your web application.

Skybrud.Umbraco.Elements

If you've used the Umbraco 7 version of this package, you may recall that it featured a property editor for managing a list of links rather that a property editor for a single link as in the Umbraco 8.

With the link list property editor, you could add all the links you wanted, but each item in the list would just be a link without the support for any additional properties. As Umbraco 7 matured, and Umbraco 8 came closer, we released this was limiting our capatabilities for building better websites - eg. a link could for instance include extra properties for improving the accessbility of a website, but this wasn't possible with the old link list property editor.

When we're building link lists in Umbraco 8, we're now instead relying on our own Skybrud.Umbraco.Elements package. The package then allows developers to set up properties and grid elements based on content types and IPublishedElement.

link

In the GIF above, the link item has an additonal property for the link text, but other properties - like an icon - could make sense as well.

To use the link list view provided by this package, you can set the View option to /App_Plugins/Skybrud.LinkPicker/Views/Elements/LinkList.html when creating your link list data type:

image

Umbraco Block List

The new Block List in Umbraco uses the same principles as our Elements editor described above. Ideally this package will also provide a custom view for the Block List in the future, making it more friendly to create and manage a link list with the block list.

skybrud.linkpicker's People

Contributors

abjerner avatar chestercampbellam avatar nikcio avatar rasmusfjord avatar tnielsenskybruddk avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

skybrud.linkpicker's Issues

Feature proposal - config nodetree

It would be quite cool to have a config-option to control the content-tree. Like the xpath option in the MNTP. Ex. if i have a multisite solution, it would be cool to only see nodes from the current site (ex. $current/ancestor-or-self::*[@Level = 2])

LinkPickerItem should have constructors for manual initialization

Right now the LinkPickerLink class has a single constructor taking an instance of JObject. This works fine when you're only using the property editor.

But in some situations, it might be ideal to initialize an instance of LinkPickerLink manually - eg. a constructor that automatically populates the properties from an instance of IPublishedContent. Or another constructor with parameters matching all available properties on LinkPickerLink.

GetLinkPickerItem should never return null

If a link has been selected (single picker) or the list is empty (multi picker), the extension method GetLinkPickerItem will return null. Ideally it should return an empty item so we don't have to check whether it isn't null as well as checking IsValid.

If the method returns an empty item, we only need to check IsValid ๐Ÿ˜„

Problems with LeBlender

Hi Bjerner,
i use Skybrud.LinkPicker 1.1.1. If i add a linkpicker datatype to LeBlender and use it on a gridelement, it will not save the data on the save event.

LinkPicker data binding in the backend

Hi @abjerner ,

I was trying to reuse your LinkPicker editor in a custom view but then when the data is sent to the backend to be saved, the data isn't correctly 'binded' for the 'LinkPickerList' object.
I've confirmed that the data is being passed on the Http Post to the backend and I've also confirmed that the "Title" property is correctly set, but the 'LinkPickerItem[] Items' isn't.

In the example above, "My Title" is correctly set in the backend, but the item array is shown as an empty LinkPickerItem[]:

"title": "My Title",
"items": [{
	"id": 1061,
	"name": "history",
	"url": "http://example.dev/history/",
	"target": "_self",
	"mode": "content"
}],
"count": 1

Can you help me to understand why this is happening?

PS: The functionality in the backoffice is working as expected :)

Thank you very much.
Best Regards

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.