Easily reorder nested paragraphs with Drupal 8

The Paragraph module allows, among other uses, to propose various and varied structured layouts according to the needs of a project, directly accessible and manageable by a content editor, without any particular administration rights.

One of the major drawbacks I have encountered with Paragraph, for the design of complex landing pages, is the impossibility to change the parent of a paragraph in the case of paragraphs (picto or image/text type, etc. for example) embedded in other paragraphs (container type for example, allowing to control the layout). And in this case it was necessary to delete and then redo the paragraph at the level of the correct parent to make structural modifications to the layout of this type of page (landing page, home page, etc.).

As a user of the Paragraph module for many years, I may not have read all the release notes of the module. And that's probably why I'm only now discovering that the Paragraph module now natively offers a drag and drop function that allows you to completely reorder the layout of paragraphs, whether or not they are nested in other paragraphs. In one click it is now possible to modify the parent of a paragraph.

And I just (re)-read the README of the module. This is probably something you don't do very often when you think you know a module well.

Drag & drop
-------------

The experimental widget offers a separate mode that allows to re-sort paragraphs
not just within the same level but it is also possible to change the hierarchy
and move paragraphs including their children around and into other paragraphs.

During drag & drop mode, paragraphs are also displayed as a summary only, which
results in a very compact display that makes it easier to move them around.

To use this, an additional library is necessary, which needs to be put in the
/libraries folder. Download from https://github.com/RubaXa/Sortable/releases,
make sure that the folder name is Sortable (with uppercase S) so that the path
to the javascript file is /libraries/Sortable/Sortable.min.js.

Use the version 1.10+ as it's tested and approved. Older versions may introduce
bugs with nested drag & drop functionality.

If the file exists, the feature will automatically be available.

So by installing the jQuery Sortable library as shown, this feature is enabled automatically. We then have a Drag and Drop action button in the Paragraph field itself.

And once enabled all the paragraphs of the field switch to a Drag and Drop mode and this allows us to reorder at will all the paragraphs of the page and in particular to change their parent if necessary.

In conclusion, at each module update, remember to read the release note, but also to browse its README file, even briefly, and even for the modules you think you know well. This may save you from missing major and extremely useful new features for many months, as it could happen to me.

Edit: and since Drupal Core 8.8 and Paragraphs 8.x-1.11, it's not necessary anymore to install the Sortable library. It's available out of the box.