{"id":14627,"date":"2025-05-22T10:01:23","date_gmt":"2025-05-22T08:01:23","guid":{"rendered":"https:\/\/pullit.eu\/?page_id=14627"},"modified":"2025-10-06T19:27:01","modified_gmt":"2025-10-06T17:27:01","slug":"pullit-cargomax-farbe","status":"publish","type":"page","link":"https:\/\/pullit.eu\/en\/pullit-cargomax-farbe\/","title":{"rendered":"Pullit! CargoMax Farbe"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"14627\" class=\"elementor elementor-14627\">\n\t\t\t\t<div class=\"elementor-element elementor-element-463e948 e-flex e-con-boxed e-con e-parent\" data-id=\"463e948\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7b0bf5a elementor-widget elementor-widget-heading\" data-id=\"7b0bf5a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">W\u00e4hle Deine Wunschfarbe aus!<\/h2>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-0da6293 e-flex e-con-boxed e-con e-parent\" data-id=\"0da6293\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ad8024e elementor-widget elementor-widget-html\" data-id=\"ad8024e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n  .color-selector-container {\r\n    text-align: center;\r\n    padding: 20px;\r\n    background-color: #F0F0F0;\r\n  }\r\n\r\n  .product-image {\r\n    margin: 0 auto 25px;\r\n  }\r\n\r\n  .color-options {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    justify-content: center;\r\n    gap: 0px;\r\n    margin-bottom: 20px;\r\n  }\r\n\r\n  .color-dot {\r\n    width: 30px;\r\n    height: 30px;\r\n    border-radius: 0%;\r\n    border: 0px solid #F0F0F0;\r\n    cursor: pointer;\r\n  }\r\n\r\n  .color-dot.active {\r\n    border: 2px solid black;\r\n  }\r\n\r\n  .add-button {\r\n    padding: 10px 20px;\r\n    font-size: 16px;\r\n    background-color: #E9002D;\r\n    border: 1px solid #E9002D;\r\n    color: #fff;\r\n    cursor: pointer;\r\n  }\r\n\r\n  .add-button:hover {\r\n    background-color: #F0F0F0 !important;\r\n    border: 1px solid #1F0602 !important;\r\n    color: #1F0602;\r\n  }\r\n\r\n  .add-button:disabled {\r\n    background-color: #E9002D;\r\n    border: 1px solid #E9002D;\r\n    opacity: .5;\r\n    cursor: not-allowed;\r\n  }\r\n<\/style>\r\n\r\n<div class=\"color-selector-container\">\r\n  <img decoding=\"async\" id=\"productImage\" class=\"product-image\" src=\"https:\/\/pullit.eu\/wp-content\/uploads\/2025\/05\/default.png\" alt=\"Product preview\" \/>\r\n\r\n  <div class=\"color-options\" id=\"colorOptions\"><\/div>\r\n\r\n  <div id=\"priceDisplay\" style=\"font-size: 1.1em; font-weight: normal; margin-bottom: 15px;\">\r\n    Ihre Farbe, Ihr Stil \u2013 klicke auf eine Farbe.\r\n  <\/div>\r\n\r\n  <form class=\"variations_form\" method=\"post\" action=\"\">\r\n    <input type=\"hidden\" name=\"add-to-cart\" value=\"14592\" \/>\r\n    <input type=\"hidden\" id=\"variation_id_input\" name=\"variation_id\" \/>\r\n    <input type=\"hidden\" name=\"product_id\" value=\"14592\" \/>\r\n    <input type=\"hidden\" name=\"quantity\" value=\"1\" \/>\r\n    <button type=\"submit\" class=\"add-button\" disabled>Zum Einkaufswagen hinzuf\u00fcgen<\/button>\r\n  <\/form>\r\n<\/div>\r\n\r\n<script>\r\n  const variations = [\r\n    { name: \"Butter Yellow\", id: 14609, color: \"#fde249\" },\r\n    { name: \"Poppy Red\", id: 14610, color: \"#e54530\" },\r\n    { name: \"Geranium Red\", id: 14611, color: \"#c82d30\" },\r\n    { name: \"Burgundy\", id: 14612, color: \"#7e2930\" },\r\n    { name: \"Magenta\", id: 14613, color: \"#d4457d\" },\r\n    { name: \"Cobalt Blue\", id: 14614, color: \"#2b3044\" },\r\n    { name: \"Ultramarine Blue\", id: 14616, color: \"#2c418a\" },\r\n    { name: \"Gentian Blue\", id: 14617, color: \"#408abf\" },\r\n    { name: \"Turquoise\", id: 14618, color: \"#328399\" },\r\n    { name: \"Mint\", id: 14619, color: \"#80d1be\" },\r\n    { name: \"Cactus Green\", id: 14620, color: \"#287c58\" },\r\n    { name: \"Lime\", id: 14621, color: \"#82d058\" },\r\n    { name: \"White\", id: 14622, color: \"#f9f9f9\" },\r\n    { name: \"Light Grey\", id: 14623, color: \"#9fa7b2\" },\r\n    { name: \"Dark Grey\", id: 14624, color: \"#596466\" },\r\n    { name: \"Black\", id: 14625, color: \"#171817\" },\r\n  ];\r\n\r\n  const slugMap = {\r\n    14609: \"butter-yellow\",\r\n    14610: \"poppy-red\",\r\n    14611: \"geranium-red\",\r\n    14612: \"burgundy\",\r\n    14613: \"magenta\",\r\n    14614: \"cobalt-blue\",\r\n    14616: \"ultramarine-blue\",\r\n    14617: \"gentian-blue\",\r\n    14618: \"turquoise\",\r\n    14619: \"mint\",\r\n    14620: \"cactus-green\",\r\n    14621: \"lime\",\r\n    14622: \"white\",\r\n    14623: \"light-grey\",\r\n    14624: \"dark-grey\",\r\n    14625: \"black\",\r\n  };\r\n\r\n  const colorOptions = document.getElementById(\"colorOptions\");\r\n  const productImage = document.getElementById(\"productImage\");\r\n  const variationInput = document.getElementById(\"variation_id_input\");\r\n  const addButton = document.querySelector(\".add-button\");\r\n\r\n  variations.forEach(v => {\r\n    const dot = document.createElement(\"div\");\r\n    dot.className = \"color-dot\";\r\n    dot.style.backgroundColor = v.color;\r\n    dot.title = v.name;\r\n    dot.dataset.variationId = v.id;\r\n\r\n    dot.addEventListener(\"click\", () => {\r\n      document.querySelectorAll(\".color-dot\").forEach(d => d.classList.remove(\"active\"));\r\n      dot.classList.add(\"active\");\r\n      variationInput.value = v.id;\r\n      productImage.src = `https:\/\/pullit.eu\/wp-content\/uploads\/2025\/05\/${v.id}.png`;\r\n      addButton.disabled = false;\r\n\r\n      let attrInput = document.querySelector(\"input[name='attributes[pa_farbe-comfort]']\");\r\n      if (!attrInput) {\r\n        attrInput = document.createElement(\"input\");\r\n        attrInput.type = \"hidden\";\r\n        attrInput.name = \"attributes[pa_farbe-comfort]\";\r\n        document.querySelector(\"form.variations_form\").appendChild(attrInput);\r\n      }\r\n      attrInput.value = slugMap[v.id];\r\n\r\n      document.getElementById(\"priceDisplay\").textContent = v.name;\r\n    });\r\n\r\n    colorOptions.appendChild(dot);\r\n  });\r\n\r\n  document.querySelector(\"form.variations_form\").addEventListener(\"submit\", function () {\r\n    const button = this.querySelector('button.add-button');\r\n    button.disabled = true;\r\n    button.textContent = \"Adding...\";\r\n  });\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c362277 e-flex e-con-boxed e-con e-parent\" data-id=\"c362277\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7510acd elementor-widget elementor-widget-spacer\" data-id=\"7510acd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>W\u00e4hle Deine Wunschfarbe aus! Ihre Farbe, Ihr Stil \u2013 klicke auf eine Farbe. Zum Einkaufswagen hinzuf\u00fcgen<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-14627","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/pullit.eu\/en\/wp-json\/wp\/v2\/pages\/14627","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pullit.eu\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/pullit.eu\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/pullit.eu\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pullit.eu\/en\/wp-json\/wp\/v2\/comments?post=14627"}],"version-history":[{"count":0,"href":"https:\/\/pullit.eu\/en\/wp-json\/wp\/v2\/pages\/14627\/revisions"}],"wp:attachment":[{"href":"https:\/\/pullit.eu\/en\/wp-json\/wp\/v2\/media?parent=14627"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}