Sortable

Create sortable grids and lists to rearrange the order of its elements.


  • Drop a Grid stack into the Sortable stack and give id an ID
  • Enter the same ID at the Sortable Target ID field
Note Sortable uses the local storage to store values. Use one instance per page for better performance.
Item 1
Item 2
Item 3
Item 4
Item 5
Item 6
Item 7
Item 8

Handle

By default, the entire sortable element can be used for drag and drop sorting. To create a handle which will be used instead, just use a button for the handle and select the related element in the options panel.
Item 1
Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.
Item 2
Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.
Item 3
Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.
Item 4
Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.
Item 5
Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.
Item 6
Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.
Item 7
Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.
Item 8
Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.