diff --git a/conf/default.php b/conf/default.php
index b3f0126..49c767f 100644
--- a/conf/default.php
+++ b/conf/default.php
@@ -6,3 +6,4 @@
  */
 
 $conf['loadBootstrap'] = 0;
+$conf['allowStylingAttributes'] = 0;
\ No newline at end of file
diff --git a/conf/metadata.php b/conf/metadata.php
index 8ee671b..2541e6f 100644
--- a/conf/metadata.php
+++ b/conf/metadata.php
@@ -6,3 +6,4 @@
  */
 
 $meta['loadBootstrap'] = array('onoff', '_caution' => 'danger');
+$meta['allowStylingAttributes'] = array('onoff');
diff --git a/lang/en/settings.php b/lang/en/settings.php
index f162924..e4dc3f0 100644
--- a/lang/en/settings.php
+++ b/lang/en/settings.php
@@ -8,3 +8,4 @@
  
 // for the configuration manager
 $lang['loadBootstrap'] = "Load the Bootstrap vanilla CSS. Disable it if you have installed a Bootstrap based template.";
+$lang['allowStylingAttributes'] = "Allow the use of ''class=\"\"'', ''id=\"\"'' and ''style=\"\"'' attributes on all components.";
diff --git a/lang/ja/settings.php b/lang/ja/settings.php
index c4549f7..7c67c7f 100644
--- a/lang/ja/settings.php
+++ b/lang/ja/settings.php
@@ -7,3 +7,4 @@
  
 // 設定管理画面用
 $lang['loadBootstrap'] = "Bootstrap vanilla CSS を読み込む。Bootstrap を基にしたテンプレートをインストールした場合、無効にします。";
+$lang['allowStylingAttributes'] = "Allow the use of ''class=\"\"'', ''id=\"\"'' and ''style=\"\"'' attributes on all components.";
diff --git a/script.js b/script.js
index 8482a08..b3c444d 100644
--- a/script.js
+++ b/script.js
@@ -122,6 +122,14 @@ jQuery(document).ready(function() {
         case 'btnSize':
           btn_class.push(['btn-', value].join(''));
           break;
+        case 'btnClass':
+          btn_class.push(value);
+        case 'btnId':
+          $btn_link.attr('id', value);
+          break;
+        case 'btnStyle':
+          $btn_link.attr('style', value);
+          break;
         case 'btnBlock':
           btn_class.push('btn-block');
           break;
diff --git a/syntax/accordion.php b/syntax/accordion.php
index b82b95d..75a7221 100644
--- a/syntax/accordion.php
+++ b/syntax/accordion.php
@@ -14,7 +14,7 @@
 
 class syntax_plugin_bootswrapper_accordion extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start  = '<accordion>';
+    protected $pattern_start  = '<accordion.*?>(?=.*?</accordion>)';
     protected $pattern_end    = '</accordion>';
 
     protected $tag_attributes = array(
@@ -42,7 +42,10 @@ function render($mode, Doku_Renderer $renderer, $data) {
                 case DOKU_LEXER_ENTER:
 
                     $id     = $attributes['id'];
-                    $markup = sprintf('<div class="bs-wrap bs-wrap-accordion panel-group" id="%s">', $id);
+                    $style = $this->getStylingAttributes($attributes);
+
+                    $markup = sprintf('<div class="bs-wrap bs-wrap-accordion panel-group %s" id="%s" style="%s">',
+                      $style['class'], $id, $style['style']);
 
                     $renderer->doc .= $markup;
                     return true;
diff --git a/syntax/affix.php b/syntax/affix.php
index 576f4b5..e5feed2 100644
--- a/syntax/affix.php
+++ b/syntax/affix.php
@@ -55,6 +55,7 @@ function render($mode, Doku_Renderer $renderer, $data) {
                     $top    = $attributes['offset-top'];
                     $bottom = $attributes['offset-bottom'];
                     $target = $attributes['target'];
+                    $style = $this->getStylingAttributes($attributes);
                     $data   = array();
 
                     if ($top) {
@@ -67,7 +68,8 @@ function render($mode, Doku_Renderer $renderer, $data) {
                         $data[] = sprintf('data-target="%s"', $target);
                     }
 
-                    $markup = sprintf('<div style="z-index:1024" class="bs-wrap bs-wrap-affix" data-spy="affix" %s>', implode(' ', $data));
+                    $markup = sprintf('<div class="bs-wrap bs-wrap-affix %s" id="%s" style="z-index:1024; %s" data-spy="affix" %s>',
+                      $style['class'], $style['id'], $style['style'], implode(' ', data));
 
                     $renderer->doc .= $markup;
                     return true;
diff --git a/syntax/alert.php b/syntax/alert.php
index eac705c..94d8b65 100644
--- a/syntax/alert.php
+++ b/syntax/alert.php
@@ -50,9 +50,10 @@ function render($mode, Doku_Renderer $renderer, $data) {
                 case DOKU_LEXER_ENTER:
 
                     extract($attributes);
+                    $style = $this->getStylingAttributes($attributes);
 
-                    $markup = sprintf('<div class="bs-wrap alert alert-%s %s" role="alert">',
-                                      $type, (($dismiss) ? 'alert-dismissible' : ''));
+                    $markup = sprintf('<div class="bs-wrap alert alert-%s %s %s" id="%s" style="%s" role="alert">',
+                      $type, (($dismiss) ? 'alert-dismissible' : ''), $style['class'], $style['id'], $style['style']);
 
                     if ($dismiss) {
                         $markup .= '<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>';
diff --git a/syntax/badge.php b/syntax/badge.php
index e41b5b4..7e747e8 100644
--- a/syntax/badge.php
+++ b/syntax/badge.php
@@ -14,10 +14,10 @@
 
 class syntax_plugin_bootswrapper_badge extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start = '<badge>';
-    protected $pattern_end   = '</badge>';
+    protected $pattern_start  = '<badge.*?>(?=.*?</badge>)';
+    protected $pattern_end    = '</badge>';
 
-    protected $template_start = '<span class="bs-wrap bs-wrap-badge badge">';
+    protected $template_start = '<span class="bs-wrap bs-wrap-badge badge %s" id="%s" style="%s">';
     protected $template_end   = '</span>';
 
     function getPType() { return 'normal';}
diff --git a/syntax/bootstrap.php b/syntax/bootstrap.php
index f361648..13a50c7 100644
--- a/syntax/bootstrap.php
+++ b/syntax/bootstrap.php
@@ -15,12 +15,28 @@ class syntax_plugin_bootswrapper_bootstrap extends DokuWiki_Syntax_Plugin {
 
   protected $pattern_start    = '<BOOTSTRAP.+?>';
   protected $pattern_end      = '</BOOTSTRAP>';
-  protected $template_start   = '<div class="%s">';
   protected $template_content = '%s';
   protected $template_end     = '</div>';
   protected $header_pattern   = '[ \t]*={2,}[^\n]+={2,}[ \t]*(?=\n)';
   protected $tag_attributes   = array();
+  protected $styling_attributes = array(
 
+    'style' => array('type'  => 'string',
+                  'values'   => null,
+                  'required' => false,
+                  'default'  => ''),
+
+    'class' => array('type'  => 'string',
+                  'values'   => null,
+                  'required' => false,
+                  'default'  => ''),
+
+    'id' => array('type'     => 'integer',
+                  'values'   => null,
+                  'required' => false,
+                  'default'  => '')
+
+  );
 
   /**
     * Check default and user attributes
@@ -31,6 +47,12 @@ function checkAttributes($attributes = array()) {
 
     global $ACT;
 
+    if ($this->getConf('allowStylingAttributes')) {
+      $all_attributes  = array_merge($this->tag_attributes, $this->styling_attributes);
+    } else {
+      $all_attributes  = $this->tag_attributes;
+    }
+
     $default_attributes = array();
     $merged_attributes  = array();
     $checked_attributes = array();
@@ -42,13 +64,13 @@ function checkAttributes($attributes = array()) {
     }
 
     // Save the default values of attributes
-    foreach ($this->tag_attributes as $attribute => $item) {
+    foreach ($all_attributes as $attribute => $item) {
       $default_attributes[$attribute] = $item['default'];
     }
 
     foreach ($attributes as $name => $value) {
 
-      if (! isset($this->tag_attributes[$name])) {
+      if (! isset($all_attributes[$name])) {
 
         if ($ACT == 'preview') {
           msg(sprintf('%s Unknown attribute <code>%s</code>', $msg_title, $name), -1);
@@ -58,7 +80,7 @@ function checkAttributes($attributes = array()) {
 
       }
 
-      $item = $this->tag_attributes[$name];
+      $item = $all_attributes[$name];
 
       $required = isset($item['required']) ? $item['required'] : false;
       $values   = isset($item['values'])   ? $item['values']   : null;
@@ -113,6 +135,31 @@ function checkAttributes($attributes = array()) {
 
   }
 
+  /**
+   * Get array with styling attributes from the attributes array passed in.
+   * If the user has styling disabled this array will contain empty strings.
+   * @param array $attributes The attribute array with user values.
+   * @return array The array with styling attribute values or empty string.
+   */
+  function getStylingAttributes($attributes) {
+    $styling = array(
+      'class' => '',
+      'id' => '',
+      'style' => ''
+    );
+
+    if ($this->getConf('allowStylingAttributes')) {
+      if (isset($attributes['class']) && $attributes['class'])
+        $styling['class'] = $attributes['class'];
+      if (isset($attributes['id']) && $attributes['id'])
+        $styling['id'] = $attributes['id'];
+      if (isset($attributes['style']) && $attributes['style'])
+        $styling['style'] = $attributes['style'];
+    }
+
+    return $styling;
+  }
+
 
   function getType(){ return 'formatting'; }
   function getAllowedTypes() { return array('container', 'formatting', 'substition', 'protected', 'disabled', 'paragraphs'); }
@@ -202,12 +249,14 @@ function render($mode, Doku_Renderer $renderer, $data) {
     if ($mode !== 'xhtml') return false;
 
     /** @var Doku_Renderer_xhtml $renderer */
-    list($state, $match) = $data;
+    list($state, $match, $attributes) = $data;
 
     switch($state) {
 
       case DOKU_LEXER_ENTER:
-        $markup = $this->template_start;
+        $style = $this->getStylingAttributes($attributes);
+
+        $markup = sprintf($this->template_start, $style['class'], $style['id'], $style['style']);
         $renderer->doc .= $markup;
         return true;
 
diff --git a/syntax/button.php b/syntax/button.php
index 03975d5..d5ecf19 100644
--- a/syntax/button.php
+++ b/syntax/button.php
@@ -65,6 +65,7 @@ function render($mode, Doku_Renderer $renderer, $data) {
 
                 case DOKU_LEXER_ENTER:
 
+                    $style = $this->getStylingAttributes($attributes);
                     $html5data = array();
 
                     foreach ($attributes as $key => $value) {
diff --git a/syntax/callout.php b/syntax/callout.php
index dcb6075..1fd131a 100644
--- a/syntax/callout.php
+++ b/syntax/callout.php
@@ -45,8 +45,10 @@ function render($mode, Doku_Renderer $renderer, $data) {
                 case DOKU_LEXER_ENTER:
 
                     $type = $attributes['type'];
+                    $style = $this->getStylingAttributes($attributes);
 
-                    $markup = sprintf('<div class="bs-wrap bs-callout bs-callout-%s">', $type);
+                    $markup = sprintf('<div class="bs-wrap bs-callout bs-callout-%s %s" id="%s" style="%s">',
+                      $type, $style['class'], $style['id'], $style['style']);
 
                     if ($title = $attributes['title']) {
                       $markup .= "<h4>$title</h4>";
diff --git a/syntax/caption.php b/syntax/caption.php
index 920756d..9150c80 100644
--- a/syntax/caption.php
+++ b/syntax/caption.php
@@ -14,10 +14,10 @@
 
 class syntax_plugin_bootswrapper_caption extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start = '<caption>';
+    protected $pattern_start = '<caption.*?>(?=.*?</caption>)';
     protected $pattern_end   = '</caption>';
 
-    protected $template_start = '<div class="bs-wrap bs-wrap-caption caption">';
+    protected $template_start = '<div class="bs-wrap bs-wrap-caption caption %s" id="%s" style="%s">';
     protected $template_end   = '</div>';
 
     function getPType() { return 'block';}
diff --git a/syntax/carousel.php b/syntax/carousel.php
index 6757389..bece25c 100644
--- a/syntax/carousel.php
+++ b/syntax/carousel.php
@@ -54,13 +54,15 @@ function render($mode, Doku_Renderer $renderer, $data) {
 
                 case DOKU_LEXER_ENTER:
 
+                    $style = $this->getStylingAttributes($attributes);
                     $html5_attributes = array();
 
                     foreach ($attributes as $attribute => $value) {
                       $html5_attributes[] = sprintf('data-%s="%s"', $attribute, $value);
                     }
 
-                    $markup = sprintf('<div class="bs-wrap bs-wrap-carousel carousel slide" data-ride="carousel" %s><ol class="carousel-indicators"></ol><div class="carousel-inner" role="listbox">', implode(' ', $html5_attributes));
+                    $markup = sprintf('<div class="bs-wrap bs-wrap-carousel carousel slide %s" data-ride="carousel" id="%s" style="%s" %s><ol class="carousel-indicators"></ol><div class="carousel-inner" role="listbox">',
+                      $style['class'], $style['id'], $style['style'], implode(' ', $html5_attributes));
 
                     $renderer->doc .= $markup;
                     return true;
diff --git a/syntax/collapse.php b/syntax/collapse.php
index 3eb70c4..d3958c3 100644
--- a/syntax/collapse.php
+++ b/syntax/collapse.php
@@ -48,7 +48,10 @@ function render($mode, Doku_Renderer $renderer, $data) {
 
                     $id        = $attributes['id'];
                     $collapsed = $attributes['collapsed'];
-                    $markup    = sprintf('<div class="bs-wrap bs-wrap-collapse collapse %s" id="%s">', ($collapsed ? '' : 'in'), $id);
+                    $style = $this->getStylingAttributes($attributes);
+
+                    $markup    = sprintf('<div class="bs-wrap bs-wrap-collapse collapse %s %s" id="%s" style="%s">',
+                      ($collapsed ? '' : 'in'), $style['class'], $id, $style['style']);
 
                     $renderer->doc .= $markup;
                     return true;
diff --git a/syntax/column.php b/syntax/column.php
index 51e21ad..4b55eb4 100644
--- a/syntax/column.php
+++ b/syntax/column.php
@@ -55,13 +55,15 @@ function render($mode, Doku_Renderer $renderer, $data) {
 
                 case DOKU_LEXER_ENTER:
 
+                    $style = $this->getStylingAttributes($attributes);
                     $col = '';
 
                     foreach (array('lg', 'md', 'sm', 'xs') as $device) {
                         $col .= isset($attributes[$device]) ? sprintf('col-%s-%s ', $device, $attributes[$device]) : '';
                     }
 
-                    $markup = sprintf('<div class="bs-wrap bs-wrap-col %s">', trim($col));
+                    $markup = sprintf('<div class="bs-wrap bs-wrap-col %s %s" id="%s" style="%s">',
+                      trim($col), $style['class'], $style['id'], $style['style']);
 
                     $renderer->doc .= $markup;
                     return true;
diff --git a/syntax/grid.php b/syntax/grid.php
index 1f204bf..8c949ad 100644
--- a/syntax/grid.php
+++ b/syntax/grid.php
@@ -14,10 +14,10 @@
 
 class syntax_plugin_bootswrapper_grid extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start = '<grid>';
+    protected $pattern_start = '<grid.*?>(?=.*?</grid>)';
     protected $pattern_end   = '</grid>';
 
-    protected $template_start = '<div class="bs-wrap bs-wrap-row row">';
+    protected $template_start = '<div class="bs-wrap bs-wrap-row row %s" id="%s" style="%s">';
     protected $template_end   = '</div>';
 
     function getPType(){ return 'block'; }
diff --git a/syntax/hidden.php b/syntax/hidden.php
index dfca856..efca81b 100644
--- a/syntax/hidden.php
+++ b/syntax/hidden.php
@@ -14,10 +14,10 @@
 
 class syntax_plugin_bootswrapper_hidden extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start = '<hidden>';
+    protected $pattern_start = '<hidden.*?>(?=.*?</hidden>)';
     protected $pattern_end   = '</hidden>';
 
-    protected $template_start = '<div class="bs-wrap bs-wrap-hidden hidden">';
+    protected $template_start = '<div class="bs-wrap bs-wrap-hidden hidden %s" id="%s" style="%s">';
     protected $template_end   = '</div>';
 
     function getPType(){ return 'block'; }
diff --git a/syntax/image.php b/syntax/image.php
index 8644891..c87257a 100644
--- a/syntax/image.php
+++ b/syntax/image.php
@@ -40,13 +40,15 @@ function render($mode, Doku_Renderer $renderer, $data) {
 
                     extract($attributes);
 
+                    $style = $this->getStylingAttributes($attributes);
                     $html5_data = array();
 
                     if ($shape) {
                         $html5_data[] = sprintf('data-img-shape="%s"', $shape);
                     }
 
-                    $markup = sprintf('<span class="bs-wrap bs-wrap-image" %s>', implode(' ', $html5_data));
+                    $markup = sprintf('<span class="bs-wrap bs-wrap-image %s" id="%s" style="%s" %s>',
+                      $style['class'], $style['id'], $style['style'], implode(' ', $html5_data));
 
                     $renderer->doc .= $markup;
                     return true;
diff --git a/syntax/invisible.php b/syntax/invisible.php
index db439b3..aaf4057 100644
--- a/syntax/invisible.php
+++ b/syntax/invisible.php
@@ -14,10 +14,10 @@
 
 class syntax_plugin_bootswrapper_invisible extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start = '<invisible>';
+    protected $pattern_start = '<invisible.*?>(?=.*?</invisible>)';
     protected $pattern_end   = '</invisible>';
 
-    protected $template_start = '<div class="bs-wrap bs-wrap-invisible invisible">';
+    protected $template_start = '<div class="bs-wrap bs-wrap-invisible invisible %s" id="%s" style="%s">';
     protected $template_end   = '</div>';
 
     function getPType(){ return 'block'; }
diff --git a/syntax/jumbotron.php b/syntax/jumbotron.php
index c6ed359..8a480d7 100644
--- a/syntax/jumbotron.php
+++ b/syntax/jumbotron.php
@@ -45,6 +45,7 @@ function render($mode, Doku_Renderer $renderer, $data) {
 
                     $background = $attributes['background'];
                     $color      = $attributes['color'];
+                    $style = $this->getStylingAttributes($attributes);
 
                     $styles = array();
 
@@ -56,7 +57,8 @@ function render($mode, Doku_Renderer $renderer, $data) {
                       $styles[] = sprintf('color:%s', hsc($color));
                     }
 
-                    $markup = sprintf('<div class="bs-wrap bs-wrap-jumbotron jumbotron" style="%s">', implode(';', $styles), $type);
+                    $markup = sprintf('<div class="bs-wrap bs-wrap-jumbotron jumbotron %s" id="%s" style="%s %s">',
+                      $style['class'], $style['id'], (implode(';', $styles) . ';'), $style['style']);
 
                     $renderer->doc .= $markup;
                     return true;
diff --git a/syntax/label.php b/syntax/label.php
index c0f4128..4eb467b 100644
--- a/syntax/label.php
+++ b/syntax/label.php
@@ -50,8 +50,10 @@ function render($mode, Doku_Renderer $renderer, $data) {
                     $label_tag = (($is_block) ? 'div' : 'span');
                     $type      = $attributes['type'];
                     $icon      = $attributes['icon'];
+                    $style = $this->getStylingAttributes($attributes);
 
-                    $markup = sprintf('<%s class="bs-wrap bs-wrap-label label label-%s">', $label_tag, $type);
+                    $markup = sprintf('<%s class="bs-wrap bs-wrap-label label label-%s %s" id="%s" style="%s">',
+                      $label_tag, $type, $style['class'], $style['id'], $style['style']);
 
                     if ($icon) {
                       $markup .= sprintf('<i class="%s"></i> ', $icon);
diff --git a/syntax/lead.php b/syntax/lead.php
index 4353237..d7d4cf0 100644
--- a/syntax/lead.php
+++ b/syntax/lead.php
@@ -14,10 +14,10 @@
 
 class syntax_plugin_bootswrapper_lead extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start = '<lead>';
+    protected $pattern_start = '<lead.*?>(?=.*?</lead>)';
     protected $pattern_end   = '</lead>';
 
-    protected $template_start = '<div class="bs-wrap bs-wrap-lead lead">';
+    protected $template_start = '<div class="bs-wrap bs-wrap-lead lead %s" id="%s" style="%s">';
     protected $template_end   = '</div>';
 
     function getPType(){ return 'block'; }
diff --git a/syntax/list.php b/syntax/list.php
index d922cf6..e611789 100644
--- a/syntax/list.php
+++ b/syntax/list.php
@@ -14,10 +14,10 @@
 
 class syntax_plugin_bootswrapper_list extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start = '<list-group>';
+    protected $pattern_start = '<list-group.*?>(?=.*?</list-group>)';
     protected $pattern_end   = '</list-group>';
 
-    protected $template_start = '<div class="bs-wrap bs-wrap-list-group">';
+    protected $template_start = '<div class="bs-wrap bs-wrap-list-group %s" id="%s" style="%s">';
     protected $template_end   = '</div>';
 
     function getPType() { return 'block';}
diff --git a/syntax/modal.php b/syntax/modal.php
index 4e2e5e4..4fc672b 100644
--- a/syntax/modal.php
+++ b/syntax/modal.php
@@ -83,10 +83,11 @@ function render($mode, Doku_Renderer $renderer, $data) {
           $show     = $attributes['show'];
           $fade     = $attributes['fade'] === true ? 'fade' : '';
           $backdrop = $attributes['backdrop'];
+          $style = $this->getStylingAttributes($attributes);
 
           //Modal
-          $markup = sprintf('<div class="bs-wrap bs-wrap-modal modal %s" id="%s" role="dialog" tabindex="-1" aria-labelledby="%s" data-show="%s" data-backdrop="%s" data-keyboard="%s">',
-            $fade, $id, $title, $show, $backdrop, $keyboard);
+          $markup = sprintf('<div class="bs-wrap bs-wrap-modal modal %s %s" id="%s" style="%s" role="dialog" tabindex="-1" aria-labelledby="%s" data-show="%s" data-backdrop="%s" data-keyboard="%s">',
+            $fade, $style['class'], $id, $style['style'], $title, $show, $backdrop, $keyboard);
           $markup .= sprintf('<div class="bs-wrap modal-dialog modal-%s" role="document"><div class="bs-wrap modal-content">', $size);
 
           //Header/Title
diff --git a/syntax/nav.php b/syntax/nav.php
index 250c073..ff37d9e 100644
--- a/syntax/nav.php
+++ b/syntax/nav.php
@@ -56,6 +56,7 @@ function render($mode, Doku_Renderer $renderer, $data) {
 
                 case DOKU_LEXER_ENTER:
 
+                    $style = $this->getStylingAttributes($attributes);
                     $html5data  = array();
 
                     if (! empty($this->type)) {
@@ -66,7 +67,8 @@ function render($mode, Doku_Renderer $renderer, $data) {
                         $html5data[] = sprintf('data-nav-%s="%s"', $key, $value);
                     }
 
-                    $markup = sprintf('<div class="bs-wrap bs-wrap-nav" %s>', implode(' ', $html5data));
+                    $markup = sprintf('<div class="bs-wrap bs-wrap-nav %s" id="%s" style="%s" %s>',
+                      $style['class'], $style['id'], $style['style'], implode(' ', $html5data));
 
                     $renderer->doc .= $markup;
                     return true;
diff --git a/syntax/pageheader.php b/syntax/pageheader.php
index 7d0965f..8614603 100644
--- a/syntax/pageheader.php
+++ b/syntax/pageheader.php
@@ -14,10 +14,10 @@
 
 class syntax_plugin_bootswrapper_pageheader extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start = '<page-header>';
+    protected $pattern_start = '<page-header.*?>(?=.*?</page-header>)';
     protected $pattern_end   = '</page-header>';
 
-    protected $template_start = '<div class="bs-wrap bs-wrap-page-header page-header">';
+    protected $template_start = '<div class="bs-wrap bs-wrap-page-header page-header %s" id="%s" style="%s">';
     protected $template_end   = '</div>';
 
 }
diff --git a/syntax/pane.php b/syntax/pane.php
index 3635aa7..3a7f353 100644
--- a/syntax/pane.php
+++ b/syntax/pane.php
@@ -41,7 +41,10 @@ function render($mode, Doku_Renderer $renderer, $data) {
                 case DOKU_LEXER_ENTER:
 
                     $id     = $attributes['id'];
-                    $markup = sprintf('<div role="tabpanel" class="bs-wrap bs-wrap-tab-pane tab-pane" id="%s">', $id);
+                    $style = $this->getStylingAttributes($attributes);
+
+                    $markup = sprintf('<div role="tabpanel" class="bs-wrap bs-wrap-tab-pane tab-pane %s" id="%s" style="%s">',
+                      $style['class'], $id, $style['style']);
 
                     $renderer->doc .= $markup;
                     return true;
diff --git a/syntax/panel.php b/syntax/panel.php
index e28713c..e7c1575 100644
--- a/syntax/panel.php
+++ b/syntax/panel.php
@@ -72,8 +72,10 @@ function render($mode, Doku_Renderer $renderer, $data) {
                     $subtitle = $attributes['subtitle'];
                     $icon     = $attributes['icon'];
                     $nobody   = $attributes['no-body'];
+                    $style = $this->getStylingAttributes($attributes);
 
-                    $markup = sprintf('<div class="bs-wrap bs-wrap-panel panel panel-%s">', $type);
+                    $markup = sprintf('<div class="bs-wrap bs-wrap-panel panel panel-%s %s" id="%s" style="%s">',
+                      $type, $style['class'], $style['id'], $style['style']);
 
                     if ($title || $subtitle) {
 
diff --git a/syntax/panelbody.php b/syntax/panelbody.php
index 8adbf45..296d540 100644
--- a/syntax/panelbody.php
+++ b/syntax/panelbody.php
@@ -14,10 +14,10 @@
 
 class syntax_plugin_bootswrapper_panelbody extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start = '<panel-body>';
+    protected $pattern_start = '<panel-body.*?>(?=.*?</panel-body>)';
     protected $pattern_end   = '</panel-body>';
 
-    protected $template_start = '<div class="bs-wrap bs-wrap-panel-body panel-body">';
+    protected $template_start = '<div class="bs-wrap bs-wrap-panel-body panel-body %s" id="%s" style="%s">';
     protected $template_end   = '</div>';
 
     function getPType(){ return 'block'; }
diff --git a/syntax/popover.php b/syntax/popover.php
index 6a23303..90e6620 100644
--- a/syntax/popover.php
+++ b/syntax/popover.php
@@ -1,13 +1,13 @@
 <?php
 /**
  * Bootstrap Wrapper Plugin: Tooltip
- * 
+ *
  * @license    GPL 2 (http://www.gnu.org/licenses/gpl.html)
  * @author     Jos Roossien <mail@jroossien.com>
  * @author     Giuseppe Di Terlizzi <giuseppe.diterlizzi@gmail.com>
  * @copyright  (C) 2015-2016, Giuseppe Di Terlizzi
  */
- 
+
 // must be run within Dokuwiki
 if(!defined('DOKU_INC')) die();
 
@@ -15,119 +15,120 @@
 
 class syntax_plugin_bootswrapper_popover extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start  = '<popover.*?>(?=.*?</popover>)';
-    protected $pattern_end    = '</popover>';
-    protected $tag_attributes = array(
+  protected $pattern_start  = '<popover.*?>(?=.*?</popover>)';
+  protected $pattern_end    = '</popover>';
+  protected $tag_attributes = array(
 
-      'placement' => array('type'     => 'string',
-                           'values'   => array('top', 'bottom', 'left', 'right', 'auto', 'auto top', 'auto bottom', 'auto left', 'auto right'),
-                           'required' => true,
-                           'default'  => 'right'),
+    'placement' => array('type'     => 'string',
+      'values'   => array('top', 'bottom', 'left', 'right', 'auto', 'auto top', 'auto bottom', 'auto left', 'auto right'),
+      'required' => true,
+      'default'  => 'right'),
 
-      'title'     => array('type'     => 'string',
-                           'values'   => null,
-                           'required' => false,
-                           'default'  => null),
+    'title'     => array('type'     => 'string',
+      'values'   => null,
+      'required' => false,
+      'default'  => null),
 
-      'content'   => array('type'     => 'string',
-                           'values'   => null,
-                           'required' => true,
-                           'default'  => null),
+    'content'   => array('type'     => 'string',
+      'values'   => null,
+      'required' => true,
+      'default'  => null),
 
-      'trigger'   => array('type'     => 'string',
-                           'values'   => array('click', 'hover', 'focus'),
-                           'required' => true,
-                           'default'  => 'click'),
+    'trigger'   => array('type'     => 'string',
+      'values'   => array('click', 'hover', 'focus'),
+      'required' => true,
+      'default'  => 'click'),
 
-      'html'      => array('type'     => 'boolean',
-                           'values'   => array(0, 1),
-                           'required' => false,
-                           'default'  => false),
+    'html'      => array('type'     => 'boolean',
+      'values'   => array(0, 1),
+      'required' => false,
+      'default'  => false),
 
-      'animation' => array('type'     => 'boolean',
-                           'values'   => array(0, 1),
-                           'required' => false,
-                           'default'  => true),
+    'animation' => array('type'     => 'boolean',
+      'values'   => array(0, 1),
+      'required' => false,
+      'default'  => true),
 
-      'delay'     => array('type'     => 'integer',
-                           'values'   => null,
-                           'required' => false,
-                           'default'  => 0),
+    'delay'     => array('type'     => 'integer',
+      'values'   => null,
+      'required' => false,
+      'default'  => 0),
 
-      'delay-show' => array('type'     => 'integer',
-                            'values'   => null,
-                            'required' => false,
-                            'default'  => 0),
+    'delay-show' => array('type'     => 'integer',
+      'values'   => null,
+      'required' => false,
+      'default'  => 0),
 
-      'delay-hide' => array('type'     => 'integer',
-                            'values'   => null,
-                            'required' => false,
-                            'default'  => 0),
+    'delay-hide' => array('type'     => 'integer',
+      'values'   => null,
+      'required' => false,
+      'default'  => 0),
 
-    );
+  );
 
-    function getPType() { return 'normal';}
+  function getPType() { return 'normal';}
 
-    function render($mode, Doku_Renderer $renderer, $data) {
+  function render($mode, Doku_Renderer $renderer, $data) {
 
-        if (empty($data)) return false;
+    if (empty($data)) return false;
 
-        if ($mode == 'xhtml') {
+    if ($mode == 'xhtml') {
 
-            /** @var Doku_Renderer_xhtml $renderer */
-            list($state, $match, $attributes) = $data;
+      /** @var Doku_Renderer_xhtml $renderer */
+      list($state, $match, $attributes) = $data;
 
-            switch($state) {
+      switch($state) {
 
-                case DOKU_LEXER_ENTER:
+        case DOKU_LEXER_ENTER:
 
-                    $html5_data = array();
+          $html5_data = array();
 
-                    extract($attributes);
+          extract($attributes);
+          $style = $this->getStylingAttributes($attributes);
 
-                    if ($html) {
-                      $title   = hsc(p_render('xhtml',p_get_instructions($title), $info));
-                      $content = hsc(p_render('xhtml',p_get_instructions($content), $info));
-                    }
+          if ($html) {
+            $title   = hsc(p_render('xhtml',p_get_instructions($title), $info));
+            $content = hsc(p_render('xhtml',p_get_instructions($content), $info));
+          }
 
-                    if ($trigger)   $html5_data[] = sprintf('data-trigger="%s"',   $trigger);
-                    if ($animation) $html5_data[] = sprintf('data-animation="%s"', $animation);
-                    if ($html)      $html5_data[] = sprintf('data-html="%s"',      $html);
-                    if ($placement) $html5_data[] = sprintf('data-placement="%s"', $placement);
-                    if ($content)   $html5_data[] = sprintf('data-content="%s"',   $content);
-                    if ($delay)     $html5_data[] = sprintf('data-delay="%s"',     $delay);
+          if ($trigger)   $html5_data[] = sprintf('data-trigger="%s"',   $trigger);
+          if ($animation) $html5_data[] = sprintf('data-animation="%s"', $animation);
+          if ($html)      $html5_data[] = sprintf('data-html="%s"',      $html);
+          if ($placement) $html5_data[] = sprintf('data-placement="%s"', $placement);
+          if ($content)   $html5_data[] = sprintf('data-content="%s"',   $content);
+          if ($delay)     $html5_data[] = sprintf('data-delay="%s"',     $delay);
 
-                    if (! $delay && ($attributes['delay-hide'] || $attributes['delay-show'])) {
+          if (! $delay && ($attributes['delay-hide'] || $attributes['delay-show'])) {
 
-                      $delays = array();
-                      $show   = $attributes['delay-show'];
-                      $hide   = $attributes['delay-hide'];
+            $delays = array();
+            $show   = $attributes['delay-show'];
+            $hide   = $attributes['delay-hide'];
 
-                      if ($hide) $delays['hide'] = $hide;
-                      if ($show) $delays['show'] = $show;
+            if ($hide) $delays['hide'] = $hide;
+            if ($show) $delays['show'] = $show;
 
-                      $html5_data[] = sprintf('data-delay=\'%s\'', json_encode($delays));
+            $html5_data[] = sprintf('data-delay=\'%s\'', json_encode($delays));
 
-                    }
+          }
 
-                    $markup = sprintf('<span class="bs-wrap bs-wrap-popover" data-toggle="popover" title="%s" %s>',
-                        $title, implode(' ', $html5_data));
+          $markup = sprintf('<span class="bs-wrap bs-wrap-popover %s" id="%s" style="%s" data-toggle="popover" title="%s" %s>',
+            $style['class'], $style['id'], $style['style'], $title, implode(' ', $html5_data));
 
-                    $renderer->doc .= $markup;
-                    return true;
+          $renderer->doc .= $markup;
+          return true;
 
-                case DOKU_LEXER_EXIT:
-                    $renderer->doc .= '</span>';
-                    return true;
+        case DOKU_LEXER_EXIT:
+          $renderer->doc .= '</span>';
+          return true;
 
-            }
+      }
 
-            return true;
+      return true;
 
-        }
+    }
 
-        return false;
+    return false;
 
-    }
+  }
 
-}
+}
\ No newline at end of file
diff --git a/syntax/progress.php b/syntax/progress.php
index 6c1d641..0d9ed3e 100644
--- a/syntax/progress.php
+++ b/syntax/progress.php
@@ -15,10 +15,10 @@
 
 class syntax_plugin_bootswrapper_progress extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start  = '<progress>';
+    protected $pattern_start  = '<progress.*?>(?=.*?</progress>)';
     protected $pattern_end    = '</progress>';
 
-    protected $template_start = '<div class="bs-wrap bs-wrap-progress progress">';
+    protected $template_start = '<div class="bs-wrap bs-wrap-progress progress %s" id="%s" style="%s">';
     protected $template_end   = '</div>';
 
 }
diff --git a/syntax/progressbar.php b/syntax/progressbar.php
index 7140372..a4c3cfb 100644
--- a/syntax/progressbar.php
+++ b/syntax/progressbar.php
@@ -61,6 +61,7 @@ function render($mode, Doku_Renderer $renderer, $data) {
                 case DOKU_LEXER_ENTER:
 
                     extract($attributes);
+                    $style = $this->getStylingAttributes($attributes);
 
                     $classCode = "";
 
@@ -72,8 +73,8 @@ function render($mode, Doku_Renderer $renderer, $data) {
                         $classCode .= " active";
                     }
 
-                    $markup = sprintf('<div class="bs-wrap bs-wrap-progress-bar progress-bar progress-bar-%s %s" role="progressbar" aria-valuenow="%s" aria-valuemin="0" aria-valuemax="100" style="width: %s%%;%s">',
-                                      $type, $classCode, $value, $value, ($showvalue ? 'min-width: 2em;' : ''));
+                    $markup = sprintf('<div class="bs-wrap bs-wrap-progress-bar progress-bar progress-bar-%s %s %s" id="%s" role="progressbar" aria-valuenow="%s" aria-valuemin="0" aria-valuemax="100" style="width: %s%%;%s %s">',
+                                      $type, $classCode, $style['class'], $style['id'], $value, $value, ($showvalue ? 'min-width: 2em;' : ''), $style['style']);
 
                     if ($showvalue){
                         $markup .= sprintf('%s%% ', $value);
diff --git a/syntax/row.php b/syntax/row.php
index 3afde50..e2e97ea 100644
--- a/syntax/row.php
+++ b/syntax/row.php
@@ -14,7 +14,7 @@
 
 class syntax_plugin_bootswrapper_row extends syntax_plugin_bootswrapper_grid {
 
-    protected $pattern_start = '<row>';
+    protected $pattern_start = '<row.*?>(?=.*?</row>)';
     protected $pattern_end   = '</row>';
 
 }
diff --git a/syntax/show.php b/syntax/show.php
index 22f0d56..2f1f298 100644
--- a/syntax/show.php
+++ b/syntax/show.php
@@ -14,10 +14,10 @@
 
 class syntax_plugin_bootswrapper_show extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start = '<show>';
+    protected $pattern_start = '<show.*?>(?=.*?</show>)';
     protected $pattern_end   = '</show>';
 
-    protected $template_start = '<div class="bs-wrap bs-wrap-show show">';
+    protected $template_start = '<div class="bs-wrap bs-wrap-show show %s" id="%s" style="%s">';
     protected $template_end   = '</div>';
 
     function getPType(){ return 'block'; }
diff --git a/syntax/slide.php b/syntax/slide.php
index 2b44f53..f349443 100644
--- a/syntax/slide.php
+++ b/syntax/slide.php
@@ -14,10 +14,10 @@
 
 class syntax_plugin_bootswrapper_slide extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start = '<slide>';
+    protected $pattern_start = '<slide.*?>(?=.*?</slide>)';
     protected $pattern_end   = '</slide>';
 
-    protected $template_start = '<div class="bs-wrap bs-wrap-slide item">';
+    protected $template_start = '<div class="bs-wrap bs-wrap-slide item %s" id="%s" style="%s">';
     protected $template_end   = '</div>';
 
     function getPType(){ return 'block'; }
diff --git a/syntax/text.php b/syntax/text.php
index 4754d13..6c19ee5 100644
--- a/syntax/text.php
+++ b/syntax/text.php
@@ -68,6 +68,7 @@ function render($mode, Doku_Renderer $renderer, $data) {
           $background = $attributes['background'];
           $align      = $attributes['align'];
           $transform  = $attributes['transform'];
+          $style = $this->getStylingAttributes($attributes);
 
           $classes = array();
           $styles  = array();
@@ -87,10 +88,8 @@ function render($mode, Doku_Renderer $renderer, $data) {
 
           }
 
-          $markup = sprintf('<%s class="bs-wrap bs-wrap-text text %s" style="%s">',
-                            $text_tag,
-                            implode(' ', $classes),
-                            implode(';', $styles));
+          $markup = sprintf('<%s class="bs-wrap bs-wrap-text text %s %s" id="%s" style="%s %s">',
+                            $text_tag, implode(' ', $classes), $style['class'], $style['id'], implode(';', $styles) . ';', $style['style']);
 
           $renderer->doc .= $markup;
           return true;
diff --git a/syntax/thumbnail.php b/syntax/thumbnail.php
index fc3b7a6..e9a92ec 100644
--- a/syntax/thumbnail.php
+++ b/syntax/thumbnail.php
@@ -14,10 +14,10 @@
 
 class syntax_plugin_bootswrapper_thumbnail extends syntax_plugin_bootswrapper_bootstrap {
 
-    protected $pattern_start = '<thumbnail>';
+    protected $pattern_start = '<thumbnail.*?>(?=.*?</thumbnail>)';
     protected $pattern_end   = '</thumbnail>';
 
-    protected $template_start = '<div class="bs-wrap bs-wrap-thumbnail thumbnail">';
+    protected $template_start = '<div class="bs-wrap bs-wrap-thumbnail thumbnail %s" id="%s" style="%s">';
     protected $template_end   = '</div>';
 
     function getPType(){ return 'block'; }
diff --git a/syntax/tooltip.php b/syntax/tooltip.php
index 52f442a..0ad20e4 100644
--- a/syntax/tooltip.php
+++ b/syntax/tooltip.php
@@ -53,12 +53,14 @@ function render($mode, Doku_Renderer $renderer, $data) {
                     $placement = $attributes['placement'];
                     $title     = $attributes['title'];
                     $html      = $attributes['html'];
+                    $style = $this->getStylingAttributes($attributes);
 
                     if ($html) {
                       $title = hsc(p_render('xhtml',p_get_instructions($title), $info));
                     }
 
-                    $markup = sprintf('<span class="bs-wrap bs-wrap-tooltip" data-toggle="tooltip" data-html="%s" data-placement="%s" title="%s" style="border-bottom:1px dotted">', $html, $placement, $title);
+                    $markup = sprintf('<span class="bs-wrap bs-wrap-tooltip %s" id="%s" data-toggle="tooltip" data-html="%s" data-placement="%s" title="%s" style="border-bottom:1px dotted; %s">',
+                      $style['class'], $style['id'], $html, $placement, $title, $style['style']);
 
                     $renderer->doc .= $markup;
                     return true;
diff --git a/syntax/well.php b/syntax/well.php
index 74f3d2e..4d67fd3 100644
--- a/syntax/well.php
+++ b/syntax/well.php
@@ -42,7 +42,10 @@ function render($mode, Doku_Renderer $renderer, $data) {
                 case DOKU_LEXER_ENTER:
 
                     $size   = ($attributes['size']) ? 'well-'.$attributes['size'] : '';
-                    $markup = sprintf('<div class="bs-wrap bs-wrap-well well %s">', $size);
+                    $style = $this->getStylingAttributes($attributes);
+
+                    $markup = sprintf('<div class="bs-wrap bs-wrap-well well %s %s" id="%s" style="%s">',
+                      $size, $style['class'], $style['id'], $style['style']);
 
                     $renderer->doc .= $markup;
                     return true;