diff -u b/js/paragraphs.admin.js b/js/paragraphs.admin.js
--- b/js/paragraphs.admin.js
+++ b/js/paragraphs.admin.js
@@ -4,78 +4,115 @@
 
   /**
-   * For body tag, adds tabs for selecting how the content will be displayed.
-   *
-   * @type {Drupal~behavior}
-   */
+  * Set content fields to visible when tabs are created. After an action
+  * being performed, stay on the same perspective.
+  *
+  * @param $parWidget
+  *   Paragraphs widget.
+  * @param $parTabs
+  *   Paragraphs tabs.
+  * @param $parContent
+  *   Paragraphs content tab.
+  * @param $parBehavior
+  *   Paragraphs behavior tab.
+  * @param $mainRegion
+  *   Main paragraph region.
+  */
+  var setUpTab = function ($parWidget, $parTabs, $parContent, $parBehavior, $mainRegion) {
+    var $tabContent = $parTabs.find('#content');
+    var $tabBehavior = $parTabs.find('#behavior');
+    if ($tabBehavior.hasClass('is-active')) {
+      $parWidget.removeClass('content-active').addClass('behavior-active');
+      $tabContent.removeClass('is-active');
+      $tabBehavior.addClass('is-active');
+      $parContent.hide();
+      $parBehavior.show();
+    }
+    else {
+      // Activate content tab visually if there is no previously
+      // activated tab.
+      if (!($mainRegion.hasClass('content-active'))
+        && !($mainRegion.hasClass('behavior-active'))) {
+        $tabContent.addClass('is-active');
+        $mainRegion.addClass('content-active');
+      }
+
+      $parContent.show();
+      $parBehavior.hide();
+
+      $parTabs.show();
+      if ($parBehavior.length == 0) {
+        $parTabs.hide();
+      }
+    }
+  };
+
+  /**
+  * Switching active class between tabs.
+  * @param $parTabs
+  *   Paragraphs tabs.
+  * @param $activeTab
+  *   Clicked tab.
+  * @param $mainRegion
+  *   Main paragraph region.
+  * @param $parWidget
+  *   Paragraphs widget.
+  * @param $context
+  *   Current context.
+  */
+  var switchActiveClass = function ($parTabs, $activeTab, $mainRegion, $parWidget, $context) {
+      $parTabs.find('li').removeClass('is-active');
+      $activeTab.parent('li').addClass('is-active');
+      $mainRegion.removeClass('behavior-active content-active is-active');
+      $($parWidget).find($activeTab.attr('href')).addClass('is-active');
+
+      if($context.find('.paragraphs-tabs-wrapper').find('#content').hasClass('is-active')) {
+          $parWidget.find('.layout-region-node-main').addClass('content-active');
+          $parWidget.find('.paragraphs-content').show();
+          $parWidget.find('.paragraphs-behavior').hide();
+      }
+
+      if($context.find('.paragraphs-tabs-wrapper').find('#behavior').hasClass('is-active')) {
+          $parWidget.find('.layout-region-node-main').addClass('behavior-active');
+          $parWidget.find('.paragraphs-content').hide();
+          $parWidget.find('.paragraphs-behavior').show();
+      }
+  };
+
+  /**
+  * For body tag, adds tabs for selecting how the content will be displayed.
+  *
+  * @type {Drupal~behavior}
+  */
   Drupal.behaviors.bodyTabs = {
     attach: function (context) {
-      var $parWidgets = $('.paragraphs-tabs-wrapper', context).once('paragraphs-bodytabs');
-      $parWidgets.each(function() {
+      var $topLevelParWidgets = $('.paragraphs-tabs-wrapper', context).filter(function(){
+        return $(this).parents('.paragraphs-nested').length === 0;
+      });
+
+      //Initialization.
+      $topLevelParWidgets.once('paragraphs-bodytabs').each(function() {
         var $parWidget = $(this);
         var $parTabs = $parWidget.find('.paragraphs-tabs');
-        var $parContent = $parWidget.find('.paragraphs-content');
-        var $parBehavior = $parWidget.find('.paragraphs-behavior');
         var $mainRegion = $parWidget.find('.layout-region-node-main');
-        var $tabContent = $parTabs.find('#content');
-        var $tabBehavior = $parTabs.find('#behavior');
-
-        // Set content fields to visible when tabs are created. After an action
-        // being performed, stay on the same perspective.
-        if ($parWidget.hasClass('behavior-active')) {
-          $parWidget.removeClass('content-active').addClass('behavior-active');
-          $tabContent.removeClass('is-active');
-          $tabBehavior.addClass('is-active');
-          $parContent.hide();
-          $parBehavior.show();
-        }
-        else {
-          // Activate content tab visually if there is no previously
-          // activated tab.
-          if (!($mainRegion.hasClass('content-active'))
-            && !($mainRegion.hasClass('behavior-active'))) {
-            $tabContent.addClass('is-active');
-            $mainRegion.addClass('content-active');
-          }
-
-          $parContent.show();
-          $parBehavior.hide();
-        }
-
-        // Checking the number of behavior elements and showing tabs only if
-        //  there are behavior elements.
-        if ($parBehavior.length != 0) {
-          $parTabs.show();
-        }
-        else {
-          $parTabs.hide();
-        }
 
         // Create click event.
         $parTabs.find('a').click(function(e) {
           e.preventDefault();
-          // Switching active class between tabs.
-          var $this = $(this);
-          $parTabs.find('li').removeClass('is-active');
-          $this.parent('li').addClass('is-active');
-          $mainRegion.removeClass('behavior-active content-active is-active');
-          $($parWidget).find($this.attr('href')).addClass('is-active');
-
-          // Show/Hide fields based on current active class.
-          if ($parWidget.find('#content').hasClass('is-active')) {
-            $mainRegion.addClass('content-active');
-            $parContent.show();
-            $parBehavior.hide();
-          }
-
-          if ($parWidget.find('#behavior').hasClass('is-active')) {
-            $mainRegion.addClass('behavior-active');
-            $parContent.hide();
-            $parBehavior.show();
-          }
+            switchActiveClass($parTabs, $(this), $mainRegion, $parWidget, $(context));
         });
       });
+
+      if ($('.paragraphs-tabs-wrapper', context).length > 0) {
+        $topLevelParWidgets.each(function() {
+          var $parWidget = $(this);
+          var $parTabs = $parWidget.find('.paragraphs-tabs');
+          var $parContent = $parWidget.find('.paragraphs-content');
+          var $parBehavior = $parWidget.find('.paragraphs-behavior');
+          var $mainRegion = $parWidget.find('.layout-region-node-main');
+          setUpTab($parWidget, $parTabs, $parContent, $parBehavior, $mainRegion);
+        });
+      }
     }
   };
-
 })(jQuery, Drupal);
 
only in patch2:
unchanged:
--- a/src/Plugin/Field/FieldWidget/ParagraphsWidget.php
+++ b/src/Plugin/Field/FieldWidget/ParagraphsWidget.php
@@ -772,7 +772,9 @@ class ParagraphsWidget extends WidgetBase {
       $tabs = '<ul class="paragraphs-tabs tabs primary clearfix"><li id="content" class="tabs__tab"><a href="#' . $field_prefix . '-values">Content</a></li><li id="behavior" class="tabs__tab"><a href="#' . $field_prefix . '-values">Behavior</a></li></ul>';
     }
     else {
-      $form['#attributes']['class'][] = 'paragraphs-nested';
+      if ($items->getEntity()->getEntityTypeId() != 'node') {
+        $form['#attributes']['class'][] = 'paragraphs-nested';
+      }
     }
     $elements['#prefix'] = '<div class="is-horizontal paragraphs-tabs-wrapper" id="' . $this->fieldWrapperId . '">' . $tabs;
     $elements['#suffix'] = '</div>';