diff --git a/package.json b/package.json
index 97d78e7..30d4f59 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "magico-pagebuilder",
-  "version": "0.0.6",
+  "version": "0.0.7",
   "private": true,
   "scripts": {
     "dev": "vite",
diff --git a/src/components/MagicoPagebuilder.vue b/src/components/MagicoPagebuilder.vue
index 4294707..28e1670 100644
--- a/src/components/MagicoPagebuilder.vue
+++ b/src/components/MagicoPagebuilder.vue
@@ -27,7 +27,7 @@
               <li>
                 <a
                   @click.prevent="
-                    modalLoad = !modalLoad;
+                    modalLoad = !modalLoad
                     pageType = { name: null }
                   "
                   class="dropdown-item"
@@ -38,7 +38,7 @@
               <li>
                 <a
                   @click.prevent="
-                    modalSave = !modalSave;
+                    modalSave = !modalSave
                     pageType = { name: null }
                   "
                   class="dropdown-item"
@@ -47,13 +47,7 @@
                 >
               </li>
               <li v-if="descriptionAllegro">
-                <a
-                  @click.prevent="
-                  pasteAllegro
-                  "
-                  
-                  class="dropdown-item"
-                  href="#"
+                <a @click.prevent="pasteAllegro" class="dropdown-item" href="#"
                   >Wklej opis <i>Allegro</i></a
                 >
               </li>
@@ -71,7 +65,7 @@
         @start="drag = true"
         item-key="d"
         @end="
-          drag = false;
+          drag = false
           onChange()
         "
       >
@@ -147,7 +141,7 @@
         <!-- <textarea style="display:none" :name="namex">{{ comps }}</textarea> --><button
           class="btn btn-block btn-primary mt-4"
           @click.prevent="
-            modalAddSection = !modalAddSection;
+            modalAddSection = !modalAddSection
             optionx = false
           "
         >
@@ -211,7 +205,7 @@ export default {
     }
   },
   computed: {
-    descriptionAllegro: function(){
+    descriptionAllegro: function () {
       return localStorage.getItem('description_clipboard')
     }
   },
@@ -264,43 +258,43 @@ export default {
       this.pageType.body = this.pageType.source
       this.changeBody()
     },
-    pasteAllegro: function(){
-      let sections = this.descriptionAllegro;
+    pasteAllegro: function () {
+      let sections = this.descriptionAllegro
       try {
-        sections = JSON.parse(sections);
-    } catch (e) {
+        sections = JSON.parse(sections)
+      } catch (e) {
         if (e instanceof SyntaxError) {
-            sections = [{ name: 'Tekst', cols: [{ type: 'text', value: sections, size: 12 }] }];
+          sections = [{ name: 'Tekst', cols: [{ type: 'text', value: sections, size: 12 }] }]
         }
-    }
+      }
 
-    const pagebuilder = sections.map(item => {
-        const columns = [];
+      const pagebuilder = sections.map((item) => {
+        const columns = []
 
         if (item.cols && Array.isArray(item.cols)) {
-            item.cols.forEach(col => {
-                const column = {
-                   
-                    type:"container",
-                    items: [
-                        {
-                            name: (col.type === 'img' ? 'core_section_image' : 'core_section_textarea'),
-                            text: col.value,
-                        }
-                    ]
-                };
-                if (col.type === 'img' && col.figcaption) {
-                    column.items[0]['figcaption'] = col.figcaption;
+          item.cols.forEach((col) => {
+            const column = {
+              type: 'container',
+              name: 'col-md-' + col.size,
+              items: [
+                {
+                  name: col.type === 'img' ? 'core_section_image' : 'core_section_textarea',
+                  text: col.value
                 }
-                columns.push(column);
-            });
+              ]
+            }
+            if (col.type === 'img' && col.figcaption) {
+              column.items[0]['figcaption'] = col.figcaption
+            }
+            columns.push(column)
+          })
         }
 
-        return { columns,label:'',name:'' };
-    });
+        return { columns, label: '', name: '' }
+      })
 
-     this.comps = pagebuilder;
-     this.onChange();
+      this.comps = pagebuilder
+      this.onChange()
     },
     changeBody() {
       var t = this