Kumu
  • Getting started
    • Welcome
    • Kumu 101
    • First steps
    • Quick tips
    • Webinars
  • Overview
    • Kumu's architecture
    • Accounts and workspaces
    • Kumu.io and Kumu Enterprise
    • Billing
    • User interfaces
      • Dashboard
      • Settings
      • Map editor
      • View editors
      • Quick Actions
    • Collaborating and sharing
    • Actions and permissions
    • Security
    • Advanced Editor hub
      • @settings reference
      • @controls reference
      • Color reference
      • Property reference
      • Selector reference
  • DISCIPLINES
    • SNA / Network Mapping
    • Systems mapping
    • Systems Practice workbook
  • Guides
    • Activity feed
    • Add-ons
      • Disqus
    • Bridge
    • Cluster
    • Controls
      • Cluster control
      • Color-legend control
      • Filter control
      • Focus control
      • Image control
      • Label control
      • Showcase control
      • SNA-dashboard control
      • Tagged-timeline control
      • Text Control
      • Title Control
      • View toggle control
    • Decorations
      • Direct decorations
      • Data-driven decorations
      • Flags
      • Icons
      • Images
      • Label templates
      • Popovers
    • Default view settings
    • Export
    • Fields
      • Computed fields
    • Filter
    • Focus
    • Forking
    • Grids & Guides
    • Import
      • Structure your data for Kumu
      • Excel / CSV
      • Google Sheets
      • JSON / Blueprints
    • Imported views
    • Layouts
      • Fixed
      • Force-directed
      • Remove overlap
      • Scatter
      • Snap-to
    • Legends
    • Licensing
    • Lightbox
    • Loops
    • Metrics
    • Two-factor authentication
    • Pro workspaces
      • Archiving projects
      • Discussions
    • Partial views
    • Presentations
    • Profiles
      • Markdown
    • Project admin
    • Selectors
    • Shapes
    • Share and embed maps
    • Shortcuts
    • Showcase
    • Slugs
    • Table
    • Templates
      • Geo template
    • URLs
    • Views
    • Widgets
  • About Kumu
    • What is Kumu?
    • How does it work?
    • Where can I get help?
  • Enterprise
    • About enterprise
    • Getting started with VMWare
    • Upgrading
    • Configuration
    • Creating user accounts
    • SSH Access
    • Single sign-on
    • Backing up enterprise data
    • Restoring enterprise data
    • Command line utilities
    • Changelog
  • Frequently Asked Questions
    • Does Kumu have a public API?
    • Does Kumu make use of AI?
    • How do I add annotations?
    • How do I add anchors to my map description?
    • How do I add arrows to my connections?
    • How do I add documents to profiles?
    • How do I add more than one element with the same label?
    • How do I add text dropdowns to my map overview?
    • How do I adjust arrow size?
    • How do I avoid duplicating data?
    • How do I change connection curvature?
    • How do I change font color?
    • How do I change font size?
    • How do I change the default for currency fields?
    • How do I change the length or strength of connections?
    • How do I change the order of control options?
    • How do I change the position of my element labels?
    • How do I cite Kumu?
    • How do I collapse duplicate connections?
    • How do I copy a map to another project?
    • How do I control label size while scaling element size?
    • How do I control text wrapping?
    • How do I convert a project from private to public?
    • How do I convert a project from public to private?
    • How do I create dynamic on/off toggles for my map?
    • How do I customize link text in popovers?
    • How do I customize the order of my legend?
    • How do I delete a project, map, or view?
    • How do I delete data from my project?
    • How do I downgrade my subscription?
    • How do I edit virtual elements?
    • How do I get rid of duplicates?
    • How do I hide elements without connections?
    • How do I hide images from the map but keep them in the profile?
    • How do I hide labels on my map?
    • How do I hide the settings button?
    • How do I keep elements from moving?
    • How do I list an element's connections in its profile?
    • How do I make elements transparent?
    • How do I make sense of my receipt?
    • How do I open a sub-system when clicking on an element?
    • How do I remove the Opposite entry from my legend?
    • How do I remove unneeded controls?
    • How do I remove unwanted legend entries?
    • How do I rename my map/view?
    • How do I restructure my adjacency matrix?
    • How do I select options by default in my control?
    • How do I set a minimum or maximum zoom level for my map?
    • How do I show the Settings button?
    • How do I size elements based on number of connections?
    • How do I transfer a project?
    • How do I update my credit card information?
    • How much data can my Kumu project handle?
    • How do my readers switch between maps and views?
    • My data won't import. What can I do?
    • My Kumu embed is not working. What can I do?
    • My map disappeared. How do I bring it back?
    • My PDF won't export. What can I do?
    • What pricing plans does Kumu have?
    • Where can I find my invoices?
    • Where can I find example Kumu projects?
Powered by GitBook
On this page
  • Create lists of elements, connections, loops, or field values
  • Embed video
  • Embed audio
  • Embed documents
  • Scribd
  • Embed slideshows
  • Slideshare
  • Speaker Deck

Was this helpful?

Edit on GitHub
  1. Guides

Widgets

PreviousViewsNextWhat is Kumu?

Last updated 21 days ago

Was this helpful?

We've built a flexible widget framework to give superpowers to the and the Description field in .

With widgets, you can do the following:

To use widgets, start editing the Map Overview, or the Description of an element, connection, or loop, and type double square brackets [[]]. What you put inside the double square brackets depends on which widget you're using—you can read the rest of this article to learn more about each option.

Create lists of elements, connections, loops, or field values

The list widget allows you to create lists of elements, connections, and loops inside the Map Overview or a Description.

Basic lists of elements, connections, or loops

For a basic list, just type list/ inside your double square brackets, and then type elements, connections, or loops depending on what you want to list.

[[list/elements]]     --> Creates a list of all elements
[[list/connections]]  --> Creates a list of all connections
[[list/loops]]        --> Creates a list of all loops
[[list/connection?sort=strength]]
[[list/element?sort=net-worth]]

Add &desc=true to the end if you want to sort in descending order:

[[list/loop?sort=label&desc=true]]

More specific lists of elements, connections, or loops

[[list "person"]]                   --> List elements with "Person" in the Type field
[[list ":from(person)"]]            --> List connections leading from "Person" type elements
[[list "['influence'='high']"]]     --> List items with "High" in the Influence field.

Normally, it would be okay to write a selector with double quotes, e.g. ["influence"="high"]. But inside the list widget, you need to write it with single quotes instead: ['influence'='high'].

'influence' and 'high' are enclosed in single quotes, and the entire selector is enclosed in double quotes.

[[list?sort=net-worth "person"]]
[[list?sort=strength ":from(person)"]]

Add &desc=true to the end if you want to sort in descending order:

[[list?sort=type&desc=true "['influence'='high']"]]

Change the showcase behavior for lists of items

Kumu's showcase actually has three different "modes" to affect how it works:

  • normal mode showcases the selection plus any connections between the showcased elements (default)

  • loose mode showcases the selection plus neighboring elements

  • strict mode showcases only the selection itself, nothing else

By default, hovering over an item in the list widget will showcase that item in normal mode. You can override this default behavior by adding ?mode=loose or ?mode=strict.

For basic lists, add that modifier at the very end:

[[list/elements?mode=loose]]

For more specific lists, add the modifier after the word list:

[list?mode=strict ":from(person)"]

Lists of field values

To list all the values of a particular field, type list inside your double square brackets, followed by the field name in double quotes.

Simply include the field name in quotes in the standard list format.

[[list "Level of Influence"]]

When you hover over a field value in the list, Kumu will showcase all elements, connections, and loops that have that field value in their profile.

Embed video

Vimeo

To embed a Vimeo video, type vimeo/ inside the double square brackets, followed by the ID if the video you'd like to include:

[[vimeo/36519586]]

Optionally, you can change the aspect ratio from hd (the default) to sd:

[[vimeo/36519586?aspect=sd]]

You can also add a descriptive title:

[[vimeo/36519586 "a story for tomorrow by gnarly bay"]]

YouTube

To embed a YouTube video, type youtube/ inside the double square brackets, followed by the ID if the video you'd like to include.

You can find the ID for a given YouTube video within the URL of the video. Just grab the portion after the ?v= part of the URL.

[[youtube/mXiFqI-mekw]]

Optionally, you can change the aspect ratio from hd (the default) to sd:

[[youtube/mXiFqI-mekw?aspect=sd]]

Embed audio

Soundcloud

To embed audio from Soundcloud, type soundcloud/ inside your double square brackets, followed by the ID of the audio file:

[[soundcloud/313184173]]

Embed documents

Scribd

To embed documents from Scribd, type scribd/ inside your double square brackets, followed by the ID of the document:

[[scribd/416217686]]

The Scribd widget supports a start_page option that lets you define which page the embedded document should show first.

To set the option, add a ? after the document ID, then type start_page=, and the page number you want to set.

[[scribd/416217686?start_page=3]]

Embed slideshows

Slideshare

To embed a slideshow from Slideshare, type slideshare/ inside your double square brackets, followed by the ID of the slideshow:

[[slideshare/32200030]]

Optionally, you can change the aspect ratio from sd (the default) to hd:

[[slideshare/32200030?aspect=hd]]

You can also add a descriptive title:

[[slideshare/32200030 "Changing behavior through persuasive design"]]

Speaker Deck

To embed a slideshow from Speaker Deck, type speakerdeck/ inside your double square brackets, followed by the ID of the slideshow:

[[speakerdeck/39d28e80a7840130b36006a0b9603b35 "The product is the byproduct"]]

Optionally, you can change the aspect ratio from sd (the default) to hd:

[[speakerdeck/39d28e80a7840130b36006a0b9603b35?aspect=hd]]

You can also add a descriptive title:

[[speakerdeck/39d28e80a7840130b36006a0b9603b35 "The product is the byproduct"]]

All the items in the list are links—you can hover over a link to an item on the map, or you can click a link to jump to the profile for that item.

Basic lists can also be sorted by any field in your . To do so, add ?sort=field-name after elements, connections, or loops, and replace field-name with a of the field name you want to sort by.

To create a list that is more specific that "all elements", for example, you can type list and a in double quotes.

Having trouble writing the right selector for your use case? Feel free to !

If you want to list all of an element's connections in it's profile, we wrote on how to achieve that.

These more specific lists, like basic lists, can also be sorted by any field in your . To do so, add ?sort=field-name after list and before the selector, and replace field-name with a of the field name you want to sort by.

Note: When embedding a Youtube video, make sure to use the full URL (e.g. ), not the shortened URL (e.g. ), as the shortened URL will .

Need any other widgets?

showcase
profiles
slug
selector
email support
a more detailed article
profiles
slug
https://www.youtube.com/watch?v=VzNdrLLlJIU
https://youtu.be/VzNdrLLlJIU
make the embed fail
Send us an email!
profiles
Create lists of elements, connections, loops, or field values
Embed video
Embed audio
Embed documents
Embed slideshows
Map Overview
image of list of connections belonging to an element
List widget