{"id":108158,"date":"2021-06-30T08:12:28","date_gmt":"2021-06-30T06:12:28","guid":{"rendered":"https:\/\/shop.metal-badge.ch\/product\/108158\/benuzterdefiniertes-beschriftungsschild\/"},"modified":"2022-10-14T10:56:30","modified_gmt":"2022-10-14T08:56:30","slug":"customised-velcro-label","status":"publish","type":"product","link":"https:\/\/metal-badge.ch\/en\/product\/108158\/customised-velcro-label\/","title":{"rendered":"Customised Velcro label"},"content":{"rendered":"<p><script>\n  \/* DO NOT SWITCH TO VISUAL EDITOR !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!\n     add custom functionality to fancy badge designer Beschriftungsschild \n     https:\/\/jquerydoc.fancyproductdesigner.com\/\n     https:\/\/support.fancyproductdesigner.com\/support\/solutions\/articles\/13000074839-using-api-methods-and-events\n     Ways to customize the functionality of Fancy Products Designer:\n     https:\/\/support.fancyproductdesigner.com\/support\/discussions\/topics\/13000007022\n  *\/\n  jQuery(document).ready(function($) {\n  \/\/ https:\/\/gist.github.com\/chrisjhoughton\/7890303\n  \/**\n   * Wait for the specified element to appear in the DOM. When the element appears,\n   * provide it to the callback.\n   *\n   * @param selector a jQuery selector (eg, '#delayEl')\n   * @param callback function that takes selected element (null if timeout)\n   * @param max number of times to try (return null after maxtries, false to disable, if 0 will still try once)\n   *\/\n    function waitForEl(selector, callback, maxTimes = false) {\n      console.log(\"Waiting: \" + maxTimes + \" seconds\");\n      if ( $(selector).length ) {\n        callback();\n      } else {\n        if (maxTimes === false || maxTimes > 0) {\n          (maxTimes != false) && maxTimes-- ;\n          setTimeout(function () {\n            waitForEl(selector, callback, maxTimes);\n          }, 1000);\n        } \/\/ endif \n      } \/\/ endif\n    } \/\/ function\n  \/\/ wait until fancy product designer is loaded\n  waitForEl(\".fpd-list .fpd-text-layer-item:first-child textarea\", function() {\n  \/\/ waitForEl('.fpd-element-toolbar-smart', function() {\n    $('input.wc-pao-addon-field').prop('checked', true);\n    console.log(\"Now the element is loaded...\");\n    \/\/ hide last child completly \n    \/\/ $('.fpd-list .fpd-text-layer-item:eq(1)').hide();\n    \/\/ make overflow visible because of dropdown\n    $('.fpd-list').css('overflow','visible');\n    \/*\n    \/\/ Text --------------------------------------------------------------------------------------------------------------\n    $('.mCSB_container .fpd-list .fpd-text-layer-item:first-of-type textarea').on('keyup', function() {\n      console.log(\"keyup!\");\n      $('.mCSB_container .fpd-list .fpd-text-layer-item:eq(1) textarea').val($(this).val());\n      $('.mCSB_container .fpd-list .fpd-text-layer-item:eq(1) textarea').keyup();\n    }); \/\/ keyup\n    \/\/ Schriftart --------------------------------------------------------------------------------------------------------------\n    $('.fpd-list .fpd-text-layer-item:first-of-type .fpd-text-layer-font-family .fpd-dropdown-list .fpd-item').on('click', function () {\n       dataEl = $(this).attr('data-value');\n       console.log( \"Clicked: \" + dataEl );\n       $('.fpd-list .fpd-text-layer-item:eq(1) .fpd-text-layer-font-family .fpd-dropdown-list .fpd-item[data-value=\"' + dataEl + '\"]').click();\n    });\n    \/\/ Smart Toolbar -----------------------------------------------------------------------------------------------------\n    $('.fpd-element-toolbar-smart .fpd-panel-font-family .fpd-item').on('click', function () {\n      dataEl = $(this).attr('data-value');\n      console.log( \"Clicked: \" + dataEl );\n      $('.fpd-list .fpd-text-layer-item .fpd-text-layer-font-family .fpd-dropdown-list .fpd-item[data-value=\"' + dataEl + '\"]').click();\n      \/\/ close dropbdown\n      $('.fpd-list .fpd-text-layer-item .fpd-text-layer-font-family').removeClass(\"fpd-active\");\n    });\n    \/\/ Farbe ----------------------------------------------------------------------------------------------------\n    \/\/ $('.fpd-list .fpd-text-layer-item:eq(1) .fpd-color-palette').hide();\n    $('.fpd-list .fpd-text-layer-item:first-of-type .fpd-color-palette .fpd-item').on('click', function () {\n      indexEl = $(this).index();\n      $('.fpd-list .fpd-text-layer-item:eq(1) .fpd-color-palette .fpd-item').get(indexEl).click();\n    });\n    *\/\n    \/\/ change text to EN: ihre Beschriftung -----------------------------------------------------------------------------\n    $('.fpd-text-layer-item .fpd-text-layer-content textarea').val(\"your lettering\");\n    $(\".fpd-text-layer-item .fpd-text-layer-content textarea\").trigger('keyup');\n    \/\/ clone element color selection -----------------------------------------------------------------------------\n    $colorClone = $('.fpd-main-wrapper .fpd-color-selection.fpd-inside-main').clone(true, true);\n    $colorClone.find('.fpd-tooltip').removeClass('fpd-tooltip tooltipstered');\n    $colorClone.appendTo('.fpd-product-designer-wrapper .fpd-list');\n    $('.fpd-main-wrapper .fpd-color-selection.fpd-inside-main').hide();\n    \/\/ clone element bottom tools  -------------------------------------------------------------------------------\n    \/*\n    $bottomTools = $('.fpd-element-toolbar-smart .fpd-bottom-tools .fpd-tool-text-styles').clone(true, true);\n    $bottomTools.insertAfter('.fpd-product-designer-wrapper .fpd-list .fpd-text-layer-styles');\n    *\/\n    \/\/ add custom link   -----------------------------------------------------------------------------------------\n    $('a.guided-tour').on('click', function () {\n      $('.fpd-action-btn[data-action=\"guided-tour\"]').click();\n    });\n    \/\/ replace DE labels\n    $('.fpd-text-layer-item > .fpd-title').html(\"Velcro label\");\n    $('.fpd-color-selection .fpd-title').html(\"Colour of Velcro label\"); \n    $(window).resize(function() {\n      if ( !$( '.fpd-text-layers-panel .fpd-color-selection' ).length ) {\n        console.log(\"cloned\");\n        $colorClone.appendTo('.fpd-product-designer-wrapper .fpd-list');\n      } \/\/ endif\n    });\n  }, 20); \/\/ waitForEl\n}); \n<\/script><\/p>\n<style>\n#magnetschild_designer {\n  display: none;\n}\n\/* style cloned smartbar *\/\n.fpd-text-layers-panel .fpd-tools-group .fpd-toggle {\n    padding: 4px 7px;\n    cursor: pointer;\n    margin: 0 5px 5px 0;\n    border: 1px solid rgba(0,0,0,.1);\n    float: left;\n}\n.fpd-text-layers-panel .fpd-bottom-tools {\n  padding-top: 5em;\n}\n.mobile_gallery,\n.mobile_gallery-zoom-button,\n.fpd-text-layer-item:nth-of-type(2n) {\n  display: none;\n}\n.fpd-main-wrapper .fpd-color-selection.fpd-inside-main {\n\/* visibility: hidden !important; *\/\n}\n.fpd-color-selection.fpd-inside-main .fpd-title {\n  display: block !important;\n  margin-bottom: 5px !important;\n}\n.fpd-product-designer-wrapper .fpd-main-wrapper,\n.fpd-product-designer-wrapper .lower-canvas {\n  background-color: #EFEFEF !important;\n}\n\/* DE *\/\nhtml:lang(de-DE-formal) .fpd-list .fpd-color-palette::before {\n  content: \"Schriftfarbe\";\n  display: block;\n  margin-bottom: 5px;\n  font-weight: 700;\n  opacity: .8;\n}\n\/* EN *\/\nhtml:lang(en-US) .fpd-list .fpd-color-palette::before {\n  content: \"Font color\";\n  display: block;\n  margin-bottom: 5px;\n  font-weight: 700;\n  opacity: .8;\n}\n\/* FR *\/\nhtml:lang(fr-FR) .fpd-list .fpd-color-palette::before {\n  content: \"Couleur de la police\";\n  display: block;\n  margin-bottom: 5px;\n  font-weight: 700;\n  opacity: .8;\n}\n\/* IT *\/\nhtml:lang(it-IT) .fpd-list .fpd-color-palette::before {\n  content: \"Colore del carattere\";\n  display: block;\n  margin-bottom: 5px;\n  font-weight: 700;\n  opacity: .8;\n}\n.fpd-text-layers-panel .fpd-text-layer-item .fpd-color-palette .fpd-item,\n.fpd-text-layers-panel .fpd-text-layer-item .sp-preview, .fpd-text-layers-panel .fpd-text-layer-item .sp-replacer {\n  width: 30px;\n  height: 30px;\n  margin: 0 5px 5px 0;\n  border-radius: 0 !important;\n}\n\/* one column layout for fancy product builder *\/\n.fancy-product .medium-12.large-8.columns {\n  width: 100%;\n}\n.fancy-product .product_infos.fixed {\n  position: inherit;\n  width: 100%;\n}\n\/* hide font-size\n.fancy-product .fpd-text-layers-panel .fpd-text-layer-meta .fpd-text-layer-font-size {\n  display: none;\n}\n*\/\n\/* hide relative products slider *\/\n.fancy-product .in_stock_wrapper,\n.fancy-product .product_summary_top {\n    display: none;\n}\n.fpd-product-designer-wrapper {\n    float: left;\n    width: 100%;\n    margin: 2em 0;\n}\n\/* hide Transparency Slider *\/\n.fpd-product-designer-wrapper .fpd-tool-fill-opacity {\n    display: none !important;\n}\n\/* corrections *\/\n.fpd-mainbar .mCSB_container {\n  display: table;\n  width: 100%;\n  height: 100%;\n}\n.fpd-text-layers-panel .fpd-list>div {\n  margin-bottom: 5px;\n}\n.woocommerce div.product form.cart .variations select {\n  max-width: 10em;\n  min-width: 50%;\n  margin-bottom: 2em;\n}\n\/* \u00e4hnliche Produkte ausblenden *\/\n.single_product_summary_related {\n  display: none;\n}\n#klettschild-table {\n  padding: 1em 0;\n  display: flex;\n  gap: 20px;\n  flex-direction: row;\n}\n#klettschild-table .kcolumn {\n  min-width: 120px;\n  max-width: 200px;\n  font-size: small;\n}\n#klettschild-table .klabel {\n  padding-bottom: 8px;\n}\n\/* media queries *\/\n@media screen and (min-width: 64em) {\n    .product_layout_2 .product_content_wrapper .product_infos {\n        width: 100%;\n    }\n    .product_layout_2 .product_content_wrapper .product_infos.long-description {\n      position: relative;\n      width: 100%;\n    }\n}\n@media screen and (max-width: 75em) and (min-width: 64em) {\n    .fancy-product .product_infos.fixed {\n        position: inherit;\n        width: 100% !important;\n    }\n    .fancy-product .medium-12.large-8.columns {\n        width: 100% !important;\n    }\n}\n@media screen and (min-width: 90.0625em) {\n  .product_layout_2 .product_content_wrapper .product_infos {\n      width: 100%;\n      right: 0 !important;\n  }\n}\n\/* change tidio position because of smart toolbar @ mobile *\/\n@media only screen and (max-width: 980px) {\n    #tidio-chat-iframe { bottom: 90px !important; }\n}\n<\/style>\n","protected":false},"excerpt":{"rendered":"<p>Do you need help creating your Velcro label? Design your Velcro label <a class=\"guided-tour\" title=\"guided tour\" href=\"#\">step by step<\/a>.<\/p>\n<p>You can find our existing Velcro labels <a href=\"https:\/\/metal-badge.ch\/en\/product-category\/security-factory-en\/velcro-signs-labels\/\">here<\/a>.<\/p>\n<p>The Velcro label has Velcro on the back.<br \/>\nThe Velcro labels measure 10 x 30 cm (large) and 4 x 12 cm (small).<\/p>\n<div id=\"klettschild-table\">\n<div class=\"kcolumn\">\n<div class=\"klabel\">Large and small velcro label as a set<br \/>10 x 30 cm &#038; 4 x 12 cm<\/div>\n<p>    <img decoding=\"async\" src=\"https:\/\/metal-badge.ch\/wp-content\/uploads\/2021\/06\/preview-set-1.png\" alt=\"\" width=\"752\" height=\"503\" \/>\n  <\/div>\n<div class=\"kcolumn\">\n<div class=\"klabel\">Large velcro label single<br \/>10 x 30 cm<\/div>\n<p>    <img decoding=\"async\" src=\"https:\/\/metal-badge.ch\/wp-content\/uploads\/2021\/06\/preview-large-1.png\" alt=\"\" width=\"752\" height=\"503\" \/>\n  <\/div>\n<div class=\"kcolumn\">\n<div class=\"klabel\">Small velcro label single<br \/>4 x 12 cm<\/div>\n<p>    <img decoding=\"async\" src=\"https:\/\/metal-badge.ch\/wp-content\/uploads\/2021\/06\/preview-smallt-1.png\" alt=\"\" width=\"752\" height=\"503\" \/>\n  <\/div>\n<\/div>\n","protected":false},"featured_media":108647,"comment_status":"closed","ping_status":"closed","template":"","meta":{"inline_featured_image":false},"product_brand":[],"product_cat":[1665,1605,1492,2214],"product_tag":[],"class_list":{"0":"post-108158","1":"product","2":"type-product","3":"status-publish","4":"has-post-thumbnail","6":"product_cat-velcro-signs-labels","7":"product_cat-high_visibility_and_luminous_clothing","8":"product_cat-security-factory-en","9":"product_cat-tactical_vests","11":"first","12":"instock","13":"taxable","14":"shipping-taxable","15":"purchasable","16":"product-type-variable"},"_links":{"self":[{"href":"https:\/\/metal-badge.ch\/en\/wp-json\/wp\/v2\/product\/108158","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/metal-badge.ch\/en\/wp-json\/wp\/v2\/product"}],"about":[{"href":"https:\/\/metal-badge.ch\/en\/wp-json\/wp\/v2\/types\/product"}],"replies":[{"embeddable":true,"href":"https:\/\/metal-badge.ch\/en\/wp-json\/wp\/v2\/comments?post=108158"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/metal-badge.ch\/en\/wp-json\/wp\/v2\/media\/108647"}],"wp:attachment":[{"href":"https:\/\/metal-badge.ch\/en\/wp-json\/wp\/v2\/media?parent=108158"}],"wp:term":[{"taxonomy":"product_brand","embeddable":true,"href":"https:\/\/metal-badge.ch\/en\/wp-json\/wp\/v2\/product_brand?post=108158"},{"taxonomy":"product_cat","embeddable":true,"href":"https:\/\/metal-badge.ch\/en\/wp-json\/wp\/v2\/product_cat?post=108158"},{"taxonomy":"product_tag","embeddable":true,"href":"https:\/\/metal-badge.ch\/en\/wp-json\/wp\/v2\/product_tag?post=108158"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}