CINXE.COM
How To Customize WooCommerce Registration Form (2024 Ultimate Guide)
<!DOCTYPE html> <html lang="en-US"> <head> <!-- Google Tag Manager --> <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-WNPHLR');</script> <!-- End Google Tag Manager --> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="icon" href="data:image/gif;base64,R0lGODlhCgAKAIAAAPNFagAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxMzggNzkuMTU5ODI0LCAyMDE2LzA5LzE0LTAxOjA5OjAxICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxNyAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OUM2OTY4MUVDNkZFMTFFOEEzQkFFNDY5RTk0NTY4MjAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OUM2OTY4MUZDNkZFMTFFOEEzQkFFNDY5RTk0NTY4MjAiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo5QzY5NjgxQ0M2RkUxMUU4QTNCQUU0NjlFOTQ1NjgyMCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo5QzY5NjgxREM2RkUxMUU4QTNCQUU0NjlFOTQ1NjgyMCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PgH//v38+/r5+Pf29fTz8vHw7+7t7Ovq6ejn5uXk4+Lh4N/e3dzb2tnY19bV1NPS0dDPzs3My8rJyMfGxcTDwsHAv769vLu6ubi3trW0s7KxsK+urayrqqmop6alpKOioaCfnp2cm5qZmJeWlZSTkpGQj46NjIuKiYiHhoWEg4KBgH9+fXx7enl4d3Z1dHNycXBvbm1sa2ppaGdmZWRjYmFgX15dXFtaWVhXVlVUU1JRUE9OTUxLSklIR0ZFRENCQUA/Pj08Ozo5ODc2NTQzMjEwLy4tLCsqKSgnJiUkIyIhIB8eHRwbGhkYFxYVFBMSERAPDg0MCwoJCAcGBQQDAgEAACH5BAAAAAAALAAAAAAKAAoAAAIIhI+py+0PYysAOw=="> <link rel="profile" href="http://gmpg.org/xfn/11"> <link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon.png"> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> <!-- <link rel="manifest" href="/site.webmanifest"> <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5"> <meta name="msapplication-TileColor" content="#da532c"> <meta name="theme-color" content="#ffffff"> --> <meta name='robots' content='index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1' /> <meta name="dlm-version" content="4.9.11"> <!-- This site is optimized with the Yoast SEO plugin v23.9 - https://yoast.com/wordpress/plugins/seo/ --> <title>How To Customize WooCommerce Registration Form (2024 Ultimate Guide)</title> <meta name="description" content="Do you want to customize the WooCommerce registration form? Profile Builder Pro gives you full control over what forms look like!" /> <link rel="canonical" href="https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/" /> <meta property="og:locale" content="en_US" /> <meta property="og:type" content="article" /> <meta property="og:title" content="How To Customize WooCommerce Registration Form (2024 Ultimate Guide)" /> <meta property="og:description" content="Do you want to customize the WooCommerce registration form? Profile Builder Pro gives you full control over what forms look like!" /> <meta property="og:url" content="https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/" /> <meta property="og:site_name" content="Cozmoslabs" /> <meta property="article:published_time" content="2020-04-15T11:54:32+00:00" /> <meta property="article:modified_time" content="2024-07-09T16:36:12+00:00" /> <meta property="og:image" content="https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920.png" /> <meta property="og:image:width" content="1200" /> <meta property="og:image:height" content="500" /> <meta property="og:image:type" content="image/png" /> <meta name="author" content="Alex Denning" /> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:label1" content="Written by" /> <meta name="twitter:data1" content="Alex Denning" /> <meta name="twitter:label2" content="Est. reading time" /> <meta name="twitter:data2" content="24 minutes" /> <script type="application/ld+json" class="yoast-schema-graph">{"@context":"https://schema.org","@graph":[{"@type":"Article","@id":"https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/#article","isPartOf":{"@id":"https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/"},"author":{"name":"Alex Denning","@id":"https://www.cozmoslabs.com/#/schema/person/aa3a4315a33387cbe8a4e1735c993457"},"headline":"How To Customize WooCommerce Registration Form (2024 Ultimate Guide)","datePublished":"2020-04-15T11:54:32+00:00","dateModified":"2024-07-09T16:36:12+00:00","mainEntityOfPage":{"@id":"https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/"},"wordCount":3821,"commentCount":2,"publisher":{"@id":"https://www.cozmoslabs.com/#organization"},"image":{"@id":"https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/#primaryimage"},"thumbnailUrl":"https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920.png","articleSection":["Profile Builder","Tutorials","WooCommerce"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/#respond"]}]},{"@type":"WebPage","@id":"https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/","url":"https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/","name":"How To Customize WooCommerce Registration Form (2024 Ultimate Guide)","isPartOf":{"@id":"https://www.cozmoslabs.com/#website"},"primaryImageOfPage":{"@id":"https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/#primaryimage"},"image":{"@id":"https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/#primaryimage"},"thumbnailUrl":"https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920.png","datePublished":"2020-04-15T11:54:32+00:00","dateModified":"2024-07-09T16:36:12+00:00","description":"Do you want to customize the WooCommerce registration form? Profile Builder Pro gives you full control over what forms look like!","breadcrumb":{"@id":"https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/#primaryimage","url":"https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920.png","contentUrl":"https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920.png","width":1200,"height":500,"caption":"WooCommerce Registration Form Cozmoslabs"},{"@type":"BreadcrumbList","@id":"https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog","item":"https://www.cozmoslabs.com/blog/"},{"@type":"ListItem","position":2,"name":"Profile Builder","item":"https://www.cozmoslabs.com/category/profile-builder-2/"},{"@type":"ListItem","position":3,"name":"How To Customize WooCommerce Registration Form (2024 Ultimate Guide)"}]},{"@type":"WebSite","@id":"https://www.cozmoslabs.com/#website","url":"https://www.cozmoslabs.com/","name":"Cozmoslabs","description":"Premium WordPress Plugins & Solutions","publisher":{"@id":"https://www.cozmoslabs.com/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://www.cozmoslabs.com/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https://www.cozmoslabs.com/#organization","name":"Cozmoslabs","url":"https://www.cozmoslabs.com/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https://www.cozmoslabs.com/#/schema/logo/image/","url":"https://www.cozmoslabs.com/wp-content/uploads/2016/06/logo_footer.png","contentUrl":"https://www.cozmoslabs.com/wp-content/uploads/2016/06/logo_footer.png","width":100,"height":62,"caption":"Cozmoslabs"},"image":{"@id":"https://www.cozmoslabs.com/#/schema/logo/image/"}},{"@type":"Person","@id":"https://www.cozmoslabs.com/#/schema/person/aa3a4315a33387cbe8a4e1735c993457","name":"Alex Denning","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https://www.cozmoslabs.com/#/schema/person/image/","url":"https://secure.gravatar.com/avatar/f1350a0704e5201c9b475a0367ca8508?s=96&d=mm&r=g","contentUrl":"https://secure.gravatar.com/avatar/f1350a0704e5201c9b475a0367ca8508?s=96&d=mm&r=g","caption":"Alex Denning"},"url":"https://www.cozmoslabs.com/author/alex-denning/"}]}</script> <!-- / Yoast SEO plugin. --> <!-- This site uses the Google Analytics by MonsterInsights plugin v8.28.0 - Using Analytics tracking - https://www.monsterinsights.com/ --> <script src="//www.googletagmanager.com/gtag/js?id=G-K7MZJ57R03" data-cfasync="false" data-wpfc-render="false" type="text/javascript" async></script> <script data-cfasync="false" data-wpfc-render="false" type="text/javascript"> var mi_version = '8.28.0'; var mi_track_user = true; var mi_no_track_reason = ''; var MonsterInsightsDefaultLocations = {"page_location":"https:\/\/www.cozmoslabs.com\/201727-customize-woocommerce-registration-form\/"}; if ( typeof MonsterInsightsPrivacyGuardFilter === 'function' ) { var MonsterInsightsLocations = (typeof MonsterInsightsExcludeQuery === 'object') ? MonsterInsightsPrivacyGuardFilter( MonsterInsightsExcludeQuery ) : MonsterInsightsPrivacyGuardFilter( MonsterInsightsDefaultLocations ); } else { var MonsterInsightsLocations = (typeof MonsterInsightsExcludeQuery === 'object') ? MonsterInsightsExcludeQuery : MonsterInsightsDefaultLocations; } var disableStrs = [ 'ga-disable-G-K7MZJ57R03', ]; /* Function to detect opted out users */ function __gtagTrackerIsOptedOut() { for (var index = 0; index < disableStrs.length; index++) { if (document.cookie.indexOf(disableStrs[index] + '=true') > -1) { return true; } } return false; } /* Disable tracking if the opt-out cookie exists. */ if (__gtagTrackerIsOptedOut()) { for (var index = 0; index < disableStrs.length; index++) { window[disableStrs[index]] = true; } } /* Opt-out function */ function __gtagTrackerOptout() { for (var index = 0; index < disableStrs.length; index++) { document.cookie = disableStrs[index] + '=true; expires=Thu, 31 Dec 2099 23:59:59 UTC; path=/'; window[disableStrs[index]] = true; } } if ('undefined' === typeof gaOptout) { function gaOptout() { __gtagTrackerOptout(); } } window.dataLayer = window.dataLayer || []; window.MonsterInsightsDualTracker = { helpers: {}, trackers: {}, }; if (mi_track_user) { function __gtagDataLayer() { dataLayer.push(arguments); } function __gtagTracker(type, name, parameters) { if (!parameters) { parameters = {}; } if (parameters.send_to) { __gtagDataLayer.apply(null, arguments); return; } if (type === 'event') { parameters.send_to = monsterinsights_frontend.v4_id; var hookName = name; if (typeof parameters['event_category'] !== 'undefined') { hookName = parameters['event_category'] + ':' + name; } if (typeof MonsterInsightsDualTracker.trackers[hookName] !== 'undefined') { MonsterInsightsDualTracker.trackers[hookName](parameters); } else { __gtagDataLayer('event', name, parameters); } } else { __gtagDataLayer.apply(null, arguments); } } __gtagTracker('js', new Date()); __gtagTracker('set', { 'developer_id.dZGIzZG': true, }); if ( MonsterInsightsLocations.page_location ) { __gtagTracker('set', MonsterInsightsLocations); } __gtagTracker('config', 'G-K7MZJ57R03', {"forceSSL":"true","link_attribution":"true"} ); window.gtag = __gtagTracker; (function () { /* https://developers.google.com/analytics/devguides/collection/analyticsjs/ */ /* ga and __gaTracker compatibility shim. */ var noopfn = function () { return null; }; var newtracker = function () { return new Tracker(); }; var Tracker = function () { return null; }; var p = Tracker.prototype; p.get = noopfn; p.set = noopfn; p.send = function () { var args = Array.prototype.slice.call(arguments); args.unshift('send'); __gaTracker.apply(null, args); }; var __gaTracker = function () { var len = arguments.length; if (len === 0) { return; } var f = arguments[len - 1]; if (typeof f !== 'object' || f === null || typeof f.hitCallback !== 'function') { if ('send' === arguments[0]) { var hitConverted, hitObject = false, action; if ('event' === arguments[1]) { if ('undefined' !== typeof arguments[3]) { hitObject = { 'eventAction': arguments[3], 'eventCategory': arguments[2], 'eventLabel': arguments[4], 'value': arguments[5] ? arguments[5] : 1, } } } if ('pageview' === arguments[1]) { if ('undefined' !== typeof arguments[2]) { hitObject = { 'eventAction': 'page_view', 'page_path': arguments[2], } } } if (typeof arguments[2] === 'object') { hitObject = arguments[2]; } if (typeof arguments[5] === 'object') { Object.assign(hitObject, arguments[5]); } if ('undefined' !== typeof arguments[1].hitType) { hitObject = arguments[1]; if ('pageview' === hitObject.hitType) { hitObject.eventAction = 'page_view'; } } if (hitObject) { action = 'timing' === arguments[1].hitType ? 'timing_complete' : hitObject.eventAction; hitConverted = mapArgs(hitObject); __gtagTracker('event', action, hitConverted); } } return; } function mapArgs(args) { var arg, hit = {}; var gaMap = { 'eventCategory': 'event_category', 'eventAction': 'event_action', 'eventLabel': 'event_label', 'eventValue': 'event_value', 'nonInteraction': 'non_interaction', 'timingCategory': 'event_category', 'timingVar': 'name', 'timingValue': 'value', 'timingLabel': 'event_label', 'page': 'page_path', 'location': 'page_location', 'title': 'page_title', 'referrer' : 'page_referrer', }; for (arg in args) { if (!(!args.hasOwnProperty(arg) || !gaMap.hasOwnProperty(arg))) { hit[gaMap[arg]] = args[arg]; } else { hit[arg] = args[arg]; } } return hit; } try { f.hitCallback(); } catch (ex) { } }; __gaTracker.create = newtracker; __gaTracker.getByName = newtracker; __gaTracker.getAll = function () { return []; }; __gaTracker.remove = noopfn; __gaTracker.loaded = true; window['__gaTracker'] = __gaTracker; })(); } else { console.log(""); (function () { function __gtagTracker() { return null; } window['__gtagTracker'] = __gtagTracker; window['gtag'] = __gtagTracker; })(); } </script> <!-- / Google Analytics by MonsterInsights --> <script data-cfasync="false" data-wpfc-render="false" type="text/javascript"> window.MonsterInsightsDualTracker.helpers.mapProductItem = function (uaItem) { var prefixIndex, prefixKey, mapIndex; var toBePrefixed = ['id', 'name', 'list_name', 'brand', 'category', 'variant']; var item = {}; var fieldMap = { 'price': 'price', 'list_position': 'index', 'quantity': 'quantity', 'position': 'index', }; for (mapIndex in fieldMap) { if (uaItem.hasOwnProperty(mapIndex)) { item[fieldMap[mapIndex]] = uaItem[mapIndex]; } } for (prefixIndex = 0; prefixIndex < toBePrefixed.length; prefixIndex++) { prefixKey = toBePrefixed[prefixIndex]; if (typeof uaItem[prefixKey] !== 'undefined') { item['item_' + prefixKey] = uaItem[prefixKey]; } } return item; }; MonsterInsightsDualTracker.trackers['view_item_list'] = function (parameters) { var items = parameters.items; var listName, itemIndex, item, itemListName; var lists = { '_': {items: [], 'send_to': monsterinsights_frontend.v4_id}, }; for (itemIndex = 0; itemIndex < items.length; itemIndex++) { item = MonsterInsightsDualTracker.helpers.mapProductItem(items[itemIndex]); if (typeof item['item_list_name'] === 'undefined') { lists['_'].items.push(item); } else { itemListName = item['item_list_name']; if (typeof lists[itemListName] === 'undefined') { lists[itemListName] = { 'items': [], 'item_list_name': itemListName, 'send_to': monsterinsights_frontend.v4_id, }; } lists[itemListName].items.push(item); } } for (listName in lists) { __gtagDataLayer('event', 'view_item_list', lists[listName]); } }; MonsterInsightsDualTracker.trackers['select_content'] = function (parameters) { const items = parameters.items.map(MonsterInsightsDualTracker.helpers.mapProductItem); __gtagDataLayer('event', 'select_item', {items: items, send_to: parameters.send_to}); }; MonsterInsightsDualTracker.trackers['view_item'] = function (parameters) { const items = parameters.items.map(MonsterInsightsDualTracker.helpers.mapProductItem); __gtagDataLayer('event', 'view_item', {items: items, send_to: parameters.send_to}); }; </script> <link rel='stylesheet' id='prismatic-blocks-css' href='https://www.cozmoslabs.com/wp-content/plugins/prismatic/css/styles-blocks.css?ver=6.5.5' type='text/css' media='all' /> <style id='wppb-content-restriction-start-style-inline-css' type='text/css'> </style> <style id='wppb-content-restriction-end-style-inline-css' type='text/css'> </style> <link rel='stylesheet' id='edd-blocks-css' href='https://www.cozmoslabs.com/wp-content/plugins/easy-digital-downloads-pro/includes/blocks/assets/css/edd-blocks.css?ver=3.3.4' type='text/css' media='all' /> <style id='classic-theme-styles-inline-css' type='text/css'> /*! This file is auto-generated */ .wp-block-button__link{color:#fff;background-color:#32373c;border-radius:9999px;box-shadow:none;text-decoration:none;padding:calc(.667em + 2px) calc(1.333em + 2px);font-size:1.125em}.wp-block-file__button{background:#32373c;color:#fff;text-decoration:none} </style> <style id='global-styles-inline-css' type='text/css'> body{--wp--preset--color--black: #000000;--wp--preset--color--cyan-bluish-gray: #abb8c3;--wp--preset--color--white: #ffffff;--wp--preset--color--pale-pink: #f78da7;--wp--preset--color--vivid-red: #cf2e2e;--wp--preset--color--luminous-vivid-orange: #ff6900;--wp--preset--color--luminous-vivid-amber: #fcb900;--wp--preset--color--light-green-cyan: #7bdcb5;--wp--preset--color--vivid-green-cyan: #00d084;--wp--preset--color--pale-cyan-blue: #8ed1fc;--wp--preset--color--vivid-cyan-blue: #0693e3;--wp--preset--color--vivid-purple: #9b51e0;--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%);--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%);--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg,rgba(252,185,0,1) 0%,rgba(255,105,0,1) 100%);--wp--preset--gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg,rgba(255,105,0,1) 0%,rgb(207,46,46) 100%);--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg,rgb(238,238,238) 0%,rgb(169,184,195) 100%);--wp--preset--gradient--cool-to-warm-spectrum: linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%);--wp--preset--gradient--blush-light-purple: linear-gradient(135deg,rgb(255,206,236) 0%,rgb(152,150,240) 100%);--wp--preset--gradient--blush-bordeaux: linear-gradient(135deg,rgb(254,205,165) 0%,rgb(254,45,45) 50%,rgb(107,0,62) 100%);--wp--preset--gradient--luminous-dusk: linear-gradient(135deg,rgb(255,203,112) 0%,rgb(199,81,192) 50%,rgb(65,88,208) 100%);--wp--preset--gradient--pale-ocean: linear-gradient(135deg,rgb(255,245,203) 0%,rgb(182,227,212) 50%,rgb(51,167,181) 100%);--wp--preset--gradient--electric-grass: linear-gradient(135deg,rgb(202,248,128) 0%,rgb(113,206,126) 100%);--wp--preset--gradient--midnight: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);--wp--preset--font-size--small: 13px;--wp--preset--font-size--medium: 20px;--wp--preset--font-size--large: 36px;--wp--preset--font-size--x-large: 42px;--wp--preset--spacing--20: 0.44rem;--wp--preset--spacing--30: 0.67rem;--wp--preset--spacing--40: 1rem;--wp--preset--spacing--50: 1.5rem;--wp--preset--spacing--60: 2.25rem;--wp--preset--spacing--70: 3.38rem;--wp--preset--spacing--80: 5.06rem;--wp--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);--wp--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);--wp--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);--wp--preset--shadow--outlined: 6px 6px 0px -3px rgba(255, 255, 255, 1), 6px 6px rgba(0, 0, 0, 1);--wp--preset--shadow--crisp: 6px 6px 0px rgba(0, 0, 0, 1);}:where(.is-layout-flex){gap: 0.5em;}:where(.is-layout-grid){gap: 0.5em;}body .is-layout-flex{display: flex;}body .is-layout-flex{flex-wrap: wrap;align-items: center;}body .is-layout-flex > *{margin: 0;}body .is-layout-grid{display: grid;}body .is-layout-grid > *{margin: 0;}:where(.wp-block-columns.is-layout-flex){gap: 2em;}:where(.wp-block-columns.is-layout-grid){gap: 2em;}:where(.wp-block-post-template.is-layout-flex){gap: 1.25em;}:where(.wp-block-post-template.is-layout-grid){gap: 1.25em;}.has-black-color{color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-color{color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-color{color: var(--wp--preset--color--white) !important;}.has-pale-pink-color{color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-color{color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-color{color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-color{color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-color{color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-color{color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-color{color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-color{color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-color{color: var(--wp--preset--color--vivid-purple) !important;}.has-black-background-color{background-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-background-color{background-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-background-color{background-color: var(--wp--preset--color--white) !important;}.has-pale-pink-background-color{background-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-background-color{background-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-background-color{background-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-background-color{background-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-background-color{background-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-background-color{background-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-background-color{background-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-background-color{background-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-background-color{background-color: var(--wp--preset--color--vivid-purple) !important;}.has-black-border-color{border-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-border-color{border-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-border-color{border-color: var(--wp--preset--color--white) !important;}.has-pale-pink-border-color{border-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-border-color{border-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-border-color{border-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-border-color{border-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-border-color{border-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-border-color{border-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-border-color{border-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-border-color{border-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-border-color{border-color: var(--wp--preset--color--vivid-purple) !important;}.has-vivid-cyan-blue-to-vivid-purple-gradient-background{background: var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple) !important;}.has-light-green-cyan-to-vivid-green-cyan-gradient-background{background: var(--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan) !important;}.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;}.has-luminous-vivid-orange-to-vivid-red-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-orange-to-vivid-red) !important;}.has-very-light-gray-to-cyan-bluish-gray-gradient-background{background: var(--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray) !important;}.has-cool-to-warm-spectrum-gradient-background{background: var(--wp--preset--gradient--cool-to-warm-spectrum) !important;}.has-blush-light-purple-gradient-background{background: var(--wp--preset--gradient--blush-light-purple) !important;}.has-blush-bordeaux-gradient-background{background: var(--wp--preset--gradient--blush-bordeaux) !important;}.has-luminous-dusk-gradient-background{background: var(--wp--preset--gradient--luminous-dusk) !important;}.has-pale-ocean-gradient-background{background: var(--wp--preset--gradient--pale-ocean) !important;}.has-electric-grass-gradient-background{background: var(--wp--preset--gradient--electric-grass) !important;}.has-midnight-gradient-background{background: var(--wp--preset--gradient--midnight) !important;}.has-small-font-size{font-size: var(--wp--preset--font-size--small) !important;}.has-medium-font-size{font-size: var(--wp--preset--font-size--medium) !important;}.has-large-font-size{font-size: var(--wp--preset--font-size--large) !important;}.has-x-large-font-size{font-size: var(--wp--preset--font-size--x-large) !important;} .wp-block-navigation a:where(:not(.wp-element-button)){color: inherit;} :where(.wp-block-post-template.is-layout-flex){gap: 1.25em;}:where(.wp-block-post-template.is-layout-grid){gap: 1.25em;} :where(.wp-block-columns.is-layout-flex){gap: 2em;}:where(.wp-block-columns.is-layout-grid){gap: 2em;} .wp-block-pullquote{font-size: 1.5em;line-height: 1.6;} </style> <link rel='stylesheet' id='cozmoslabs-css' href='https://www.cozmoslabs.com/wp-content/themes/cozmoslabs/assets/dist/css/main.css?ver=1732007493' type='text/css' media='all' /> <link rel='stylesheet' id='searchwp-forms-css' href='https://www.cozmoslabs.com/wp-content/plugins/searchwp/assets/css/frontend/search-forms.css?ver=4.3.17' type='text/css' media='all' /> <style id='rocket-lazyload-inline-css' type='text/css'> .rll-youtube-player{position:relative;padding-bottom:56.23%;height:0;overflow:hidden;max-width:100%;}.rll-youtube-player:focus-within{outline: 2px solid currentColor;outline-offset: 5px;}.rll-youtube-player iframe{position:absolute;top:0;left:0;width:100%;height:100%;z-index:100;background:0 0}.rll-youtube-player img{bottom:0;display:block;left:0;margin:auto;max-width:100%;width:100%;position:absolute;right:0;top:0;border:none;height:auto;-webkit-transition:.4s all;-moz-transition:.4s all;transition:.4s all}.rll-youtube-player img:hover{-webkit-filter:brightness(75%)}.rll-youtube-player .play{height:100%;width:100%;left:0;top:0;position:absolute;background:url(https://www.cozmoslabs.com/wp-content/plugins/wp-rocket/assets/img/youtube.png) no-repeat center;background-color: transparent !important;cursor:pointer;border:none;} </style> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-content/plugins/google-analytics-premium/assets/js/frontend-gtag.min.js?ver=8.28.0" id="monsterinsights-frontend-script-js" defer></script> <script data-cfasync="false" data-wpfc-render="false" type="text/javascript" id='monsterinsights-frontend-script-js-extra'>/* <![CDATA[ */ var monsterinsights_frontend = {"js_events_tracking":"true","download_extensions":"doc,pdf,ppt,zip,xls,docx,pptx,xlsx","inbound_paths":"[]","home_url":"https:\/\/www.cozmoslabs.com","hash_tracking":"false","v4_id":"G-K7MZJ57R03"};/* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/jquery/jquery.min.js?ver=3.7.1" id="jquery-core-js"></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=3.4.1" id="jquery-migrate-js" defer></script> <script type="text/javascript"> var AFFWP = AFFWP || {}; AFFWP.referral_var = 'ref'; AFFWP.expiration = 1; AFFWP.debug = 0; AFFWP.referral_credit_last = 0; </script> <meta name="generator" content="Easy Digital Downloads v3.3.4" /> <link rel="icon" href="https://www.cozmoslabs.com/wp-content/uploads/2023/08/android-chrome-96x96-1.png.webp" sizes="32x32" /> <link rel="icon" href="https://www.cozmoslabs.com/wp-content/uploads/2023/08/android-chrome-96x96-1.png.webp" sizes="192x192" /> <link rel="apple-touch-icon" href="https://www.cozmoslabs.com/wp-content/uploads/2023/08/android-chrome-96x96-1.png.webp" /> <meta name="msapplication-TileImage" content="https://www.cozmoslabs.com/wp-content/uploads/2023/08/android-chrome-96x96-1.png" /> <noscript><style id="rocket-lazyload-nojs-css">.rll-youtube-player, [data-lazy-src]{display:none !important;}</style></noscript></head> <body class="post-template-default single single-post postid-201727 single-format-standard edd-js-none"> <!-- Google Tag Manager (noscript) --> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-WNPHLR" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> <!-- End Google Tag Manager (noscript) --> <a class="skip-link" href="#content">Skip to content</a> <div class="body__before"></div> <div class="cozmoslabs-promotion-banner"> <div class="cozmoslabs-promotion-banner__holder wrapper"> <div class="cozmoslabs-promotion-banner__countdown"> <div class="cozmoslabs-promotion-banner__countdown__item"> <div class="value" id="days">0</div> <div class="label"> Days </div> </div> <div class="cozmoslabs-promotion-banner__countdown__item"> <div class="value" id="hours">0</div> <div class="label"> Hours </div> </div> <div class="cozmoslabs-promotion-banner__countdown__item"> <div class="value" id="minutes">0</div> <div class="label"> Minutes </div> </div> <div class="cozmoslabs-promotion-banner__countdown__item"> <div class="value" id="seconds">0</div> <div class="label"> Seconds </div> </div> </div> <div class="cozmoslabs-promotion-banner__content"> <h3> Black Friday Sale - <span>Get 30% OFF</span>. Grab our only sale of the year! </h3> <h4> Use discount code <span>BF2024</span> at checkout. </h4> </div> </div> </div> <header class="header"> <div class="wrapper header__wrap"> <a class="header__logo" href="https://www.cozmoslabs.com/"> <span class="vh">Cozmoslabs home page</span> <svg width="214" height="40" viewBox="0 0 214 40" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M57.84 19.6C57.84 17.952 58.208 16.48 58.944 15.184C59.696 13.872 60.712 12.856 61.992 12.136C63.288 11.4 64.736 11.032 66.336 11.032C68.208 11.032 69.848 11.512 71.256 12.472C72.664 13.432 73.648 14.76 74.208 16.456H70.344C69.96 15.656 69.416 15.056 68.712 14.656C68.024 14.256 67.224 14.056 66.312 14.056C65.336 14.056 64.464 14.288 63.696 14.752C62.944 15.2 62.352 15.84 61.92 16.672C61.504 17.504 61.296 18.48 61.296 19.6C61.296 20.704 61.504 21.68 61.92 22.528C62.352 23.36 62.944 24.008 63.696 24.472C64.464 24.92 65.336 25.144 66.312 25.144C67.224 25.144 68.024 24.944 68.712 24.544C69.416 24.128 69.96 23.52 70.344 22.72H74.208C73.648 24.432 72.664 25.768 71.256 26.728C69.864 27.672 68.224 28.144 66.336 28.144C64.736 28.144 63.288 27.784 61.992 27.064C60.712 26.328 59.696 25.312 58.944 24.016C58.208 22.72 57.84 21.248 57.84 19.6ZM82.2619 28.216C80.9819 28.216 79.8299 27.936 78.8059 27.376C77.7819 26.8 76.9739 25.992 76.3819 24.952C75.8059 23.912 75.5179 22.712 75.5179 21.352C75.5179 19.992 75.8139 18.792 76.4059 17.752C77.0139 16.712 77.8379 15.912 78.8779 15.352C79.9179 14.776 81.0779 14.488 82.3579 14.488C83.6379 14.488 84.7979 14.776 85.8379 15.352C86.8779 15.912 87.6939 16.712 88.2859 17.752C88.8939 18.792 89.1979 19.992 89.1979 21.352C89.1979 22.712 88.8859 23.912 88.2619 24.952C87.6539 25.992 86.8219 26.8 85.7659 27.376C84.7259 27.936 83.5579 28.216 82.2619 28.216ZM82.2619 25.288C82.8699 25.288 83.4379 25.144 83.9659 24.856C84.5099 24.552 84.9419 24.104 85.2619 23.512C85.5819 22.92 85.7419 22.2 85.7419 21.352C85.7419 20.088 85.4059 19.12 84.7339 18.448C84.0779 17.76 83.2699 17.416 82.3099 17.416C81.3499 17.416 80.5419 17.76 79.8859 18.448C79.2459 19.12 78.9259 20.088 78.9259 21.352C78.9259 22.616 79.2379 23.592 79.8619 24.28C80.5019 24.952 81.3019 25.288 82.2619 25.288ZM94.0146 25.24H99.9426V28H90.1986V25.288L96.0066 17.464H90.2226V14.704H99.8706V17.416L94.0146 25.24ZM118.336 14.512C119.968 14.512 121.28 15.016 122.272 16.024C123.28 17.016 123.784 18.408 123.784 20.2V28H120.424V20.656C120.424 19.616 120.16 18.824 119.632 18.28C119.104 17.72 118.384 17.44 117.472 17.44C116.56 17.44 115.832 17.72 115.288 18.28C114.76 18.824 114.496 19.616 114.496 20.656V28H111.136V20.656C111.136 19.616 110.872 18.824 110.344 18.28C109.816 17.72 109.096 17.44 108.184 17.44C107.256 17.44 106.52 17.72 105.976 18.28C105.448 18.824 105.184 19.616 105.184 20.656V28H101.824V14.704H105.184V16.312C105.616 15.752 106.168 15.312 106.84 14.992C107.528 14.672 108.28 14.512 109.096 14.512C110.136 14.512 111.064 14.736 111.88 15.184C112.696 15.616 113.328 16.24 113.776 17.056C114.208 16.288 114.832 15.672 115.648 15.208C116.48 14.744 117.376 14.512 118.336 14.512ZM132.157 28.216C130.877 28.216 129.725 27.936 128.701 27.376C127.677 26.8 126.869 25.992 126.277 24.952C125.701 23.912 125.413 22.712 125.413 21.352C125.413 19.992 125.709 18.792 126.301 17.752C126.909 16.712 127.733 15.912 128.773 15.352C129.813 14.776 130.973 14.488 132.253 14.488C133.533 14.488 134.693 14.776 135.733 15.352C136.773 15.912 137.589 16.712 138.181 17.752C138.789 18.792 139.093 19.992 139.093 21.352C139.093 22.712 138.781 23.912 138.157 24.952C137.549 25.992 136.717 26.8 135.661 27.376C134.621 27.936 133.453 28.216 132.157 28.216ZM132.157 25.288C132.765 25.288 133.333 25.144 133.861 24.856C134.405 24.552 134.837 24.104 135.157 23.512C135.477 22.92 135.637 22.2 135.637 21.352C135.637 20.088 135.301 19.12 134.629 18.448C133.973 17.76 133.165 17.416 132.205 17.416C131.245 17.416 130.437 17.76 129.781 18.448C129.141 19.12 128.821 20.088 128.821 21.352C128.821 22.616 129.133 23.592 129.757 24.28C130.397 24.952 131.197 25.288 132.157 25.288ZM145.925 28.216C144.837 28.216 143.861 28.024 142.997 27.64C142.133 27.24 141.445 26.704 140.933 26.032C140.437 25.36 140.165 24.616 140.117 23.8H143.501C143.565 24.312 143.813 24.736 144.245 25.072C144.693 25.408 145.245 25.576 145.901 25.576C146.541 25.576 147.037 25.448 147.389 25.192C147.757 24.936 147.941 24.608 147.941 24.208C147.941 23.776 147.717 23.456 147.269 23.248C146.837 23.024 146.141 22.784 145.181 22.528C144.189 22.288 143.373 22.04 142.733 21.784C142.109 21.528 141.565 21.136 141.101 20.608C140.653 20.08 140.429 19.368 140.429 18.472C140.429 17.736 140.637 17.064 141.053 16.456C141.485 15.848 142.093 15.368 142.877 15.016C143.677 14.664 144.613 14.488 145.685 14.488C147.269 14.488 148.533 14.888 149.477 15.688C150.421 16.472 150.941 17.536 151.037 18.88H147.821C147.773 18.352 147.549 17.936 147.149 17.632C146.765 17.312 146.245 17.152 145.589 17.152C144.981 17.152 144.509 17.264 144.173 17.488C143.853 17.712 143.693 18.024 143.693 18.424C143.693 18.872 143.917 19.216 144.365 19.456C144.813 19.68 145.509 19.912 146.453 20.152C147.413 20.392 148.205 20.64 148.829 20.896C149.453 21.152 149.989 21.552 150.437 22.096C150.901 22.624 151.141 23.328 151.157 24.208C151.157 24.976 150.941 25.664 150.509 26.272C150.093 26.88 149.485 27.36 148.685 27.712C147.901 28.048 146.981 28.216 145.925 28.216ZM156.555 10.24V28H153.195V10.24H156.555ZM158.291 21.304C158.291 19.96 158.555 18.768 159.083 17.728C159.627 16.688 160.355 15.888 161.267 15.328C162.195 14.768 163.227 14.488 164.363 14.488C165.355 14.488 166.219 14.688 166.955 15.088C167.707 15.488 168.307 15.992 168.755 16.6V14.704H172.139V28H168.755V26.056C168.323 26.68 167.723 27.2 166.955 27.616C166.203 28.016 165.331 28.216 164.339 28.216C163.219 28.216 162.195 27.928 161.267 27.352C160.355 26.776 159.627 25.968 159.083 24.928C158.555 23.872 158.291 22.664 158.291 21.304ZM168.755 21.352C168.755 20.536 168.595 19.84 168.275 19.264C167.955 18.672 167.523 18.224 166.979 17.92C166.435 17.6 165.851 17.44 165.227 17.44C164.603 17.44 164.027 17.592 163.499 17.896C162.971 18.2 162.539 18.648 162.203 19.24C161.883 19.816 161.723 20.504 161.723 21.304C161.723 22.104 161.883 22.808 162.203 23.416C162.539 24.008 162.971 24.464 163.499 24.784C164.043 25.104 164.619 25.264 165.227 25.264C165.851 25.264 166.435 25.112 166.979 24.808C167.523 24.488 167.955 24.04 168.275 23.464C168.595 22.872 168.755 22.168 168.755 21.352ZM178.061 16.648C178.493 16.008 179.085 15.488 179.837 15.088C180.605 14.688 181.477 14.488 182.453 14.488C183.589 14.488 184.613 14.768 185.525 15.328C186.453 15.888 187.181 16.688 187.709 17.728C188.253 18.752 188.525 19.944 188.525 21.304C188.525 22.664 188.253 23.872 187.709 24.928C187.181 25.968 186.453 26.776 185.525 27.352C184.613 27.928 183.589 28.216 182.453 28.216C181.461 28.216 180.589 28.024 179.837 27.64C179.101 27.24 178.509 26.728 178.061 26.104V28H174.701V10.24H178.061V16.648ZM185.093 21.304C185.093 20.504 184.925 19.816 184.589 19.24C184.269 18.648 183.837 18.2 183.293 17.896C182.765 17.592 182.189 17.44 181.565 17.44C180.957 17.44 180.381 17.6 179.837 17.92C179.309 18.224 178.877 18.672 178.541 19.264C178.221 19.856 178.061 20.552 178.061 21.352C178.061 22.152 178.221 22.848 178.541 23.44C178.877 24.032 179.309 24.488 179.837 24.808C180.381 25.112 180.957 25.264 181.565 25.264C182.189 25.264 182.765 25.104 183.293 24.784C183.837 24.464 184.269 24.008 184.589 23.416C184.925 22.824 185.093 22.12 185.093 21.304ZM195.334 28.216C194.246 28.216 193.27 28.024 192.406 27.64C191.542 27.24 190.854 26.704 190.342 26.032C189.846 25.36 189.574 24.616 189.526 23.8H192.91C192.974 24.312 193.222 24.736 193.654 25.072C194.102 25.408 194.654 25.576 195.31 25.576C195.95 25.576 196.446 25.448 196.798 25.192C197.166 24.936 197.35 24.608 197.35 24.208C197.35 23.776 197.126 23.456 196.678 23.248C196.246 23.024 195.55 22.784 194.59 22.528C193.598 22.288 192.782 22.04 192.142 21.784C191.518 21.528 190.974 21.136 190.51 20.608C190.062 20.08 189.838 19.368 189.838 18.472C189.838 17.736 190.046 17.064 190.462 16.456C190.894 15.848 191.502 15.368 192.286 15.016C193.086 14.664 194.022 14.488 195.094 14.488C196.678 14.488 197.942 14.888 198.886 15.688C199.83 16.472 200.35 17.536 200.446 18.88H197.23C197.182 18.352 196.958 17.936 196.558 17.632C196.174 17.312 195.654 17.152 194.998 17.152C194.39 17.152 193.918 17.264 193.582 17.488C193.262 17.712 193.102 18.024 193.102 18.424C193.102 18.872 193.326 19.216 193.774 19.456C194.222 19.68 194.918 19.912 195.862 20.152C196.822 20.392 197.614 20.64 198.238 20.896C198.862 21.152 199.398 21.552 199.846 22.096C200.31 22.624 200.55 23.328 200.566 24.208C200.566 24.976 200.35 25.664 199.918 26.272C199.502 26.88 198.894 27.36 198.094 27.712C197.31 28.048 196.39 28.216 195.334 28.216Z" fill="#212121"/><g filter="url(#filter0_i_3251_37255)"><g filter="url(#filter1_i_3251_37255)"><path fill-rule="evenodd" clip-rule="evenodd" d="M12.1604 25.0374L12.0723 23.2852C11.8131 22.462 11.8387 20.7045 14.0136 20.2594C15.5588 19.9432 15.8577 18.3302 16.1334 16.8426C16.3427 15.7129 16.5387 14.6556 17.2568 14.2935C18.5878 13.6224 20.1053 15.5536 20.6978 16.6031C21.6418 17.7468 23.883 19.3683 25.2957 16.7045C27.0615 13.3748 32.5188 9.94287 33.0931 10.2302C35.9576 11.6631 37.6598 14.6729 37.5151 15.4049L38.2141 21.8104L20.6486 30.9792L14.9829 28.9605C13.8189 27.8227 12.8651 26.4925 12.1604 25.0374Z" fill="url(#paint0_linear_3251_37255)"/></g><g filter="url(#filter2_i_3251_37255)"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.3478 24.4521C10.4114 21.8669 10.2294 18.9821 10.9939 16.1288C12.9869 8.69079 20.6572 4.28349 28.1261 6.28476C35.595 8.28604 40.034 15.9381 38.041 23.376C36.2972 29.8842 30.2066 34.0721 23.7076 33.6767C22.7792 33.6202 21.8424 33.4702 20.9088 33.22C20.442 33.0949 19.987 32.9478 19.5448 32.78C18.5496 32.4025 17.6186 31.9204 16.7611 31.3502C14.2412 29.6745 12.3567 27.2371 11.3478 24.4521ZM12.0637 20.9995C12.2609 22.9117 13.0666 25.5484 14.9715 25.2909V25.2909C16.3461 25.1052 17.3653 23.3644 17.3653 23.3644C18.2629 22.1002 18.0667 17.352 20.6696 19.2848C22.1223 21.3511 22.9645 21.8581 23.2041 21.8532C23.6567 22.0392 24.5574 22.0787 24.5396 20.7488C24.5217 19.4189 23.9348 17.1619 23.5309 15.654C23.2845 14.3403 23.9165 12.5679 25.8761 13.5207C26.3356 13.7887 27.1645 14.1545 29.3436 15.9415C31.5226 17.7285 33.0623 16.6014 34.2353 14.9759V14.9759C34.8743 14.0904 34.9131 13.0124 34.3908 12.0534C33.0516 9.59429 31.1567 8.6242 27.7443 7.70983C21.0657 5.92032 14.207 9.86127 12.4249 16.5122C12.0213 18.0185 11.9127 19.5345 12.0637 20.9995Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M11.3478 24.4521C10.4114 21.8669 10.2294 18.9821 10.9939 16.1288C12.9869 8.69079 20.6572 4.28349 28.1261 6.28476C35.595 8.28604 40.034 15.9381 38.041 23.376C36.2972 29.8842 30.2066 34.0721 23.7076 33.6767C22.7792 33.6202 21.8424 33.4702 20.9088 33.22C20.442 33.0949 19.987 32.9478 19.5448 32.78C18.5496 32.4025 17.6186 31.9204 16.7611 31.3502C14.2412 29.6745 12.3567 27.2371 11.3478 24.4521ZM12.0637 20.9995C12.2609 22.9117 13.0666 25.5484 14.9715 25.2909V25.2909C16.3461 25.1052 17.3653 23.3644 17.3653 23.3644C18.2629 22.1002 18.0667 17.352 20.6696 19.2848C22.1223 21.3511 22.9645 21.8581 23.2041 21.8532C23.6567 22.0392 24.5574 22.0787 24.5396 20.7488C24.5217 19.4189 23.9348 17.1619 23.5309 15.654C23.2845 14.3403 23.9165 12.5679 25.8761 13.5207C26.3356 13.7887 27.1645 14.1545 29.3436 15.9415C31.5226 17.7285 33.0623 16.6014 34.2353 14.9759V14.9759C34.8743 14.0904 34.9131 13.0124 34.3908 12.0534C33.0516 9.59429 31.1567 8.6242 27.7443 7.70983C21.0657 5.92032 14.207 9.86127 12.4249 16.5122C12.0213 18.0185 11.9127 19.5345 12.0637 20.9995Z" fill="url(#paint1_linear_3251_37255)"/></g><g filter="url(#filter3_di_3251_37255)"><path fill-rule="evenodd" clip-rule="evenodd" d="M46.7183 6.42859C46.7186 6.42726 46.7187 6.42663 46.7186 6.42667C46.7184 6.42676 46.7174 6.43052 46.7159 6.43764C46.7172 6.43336 46.7179 6.43036 46.7183 6.42859ZM46.0418 7.51951L46.0508 7.51827L46.0452 7.52543C45.2409 8.5544 43.8596 9.90727 41.937 11.499C38.1168 14.6615 32.4559 18.5249 25.8632 22.313C19.2704 26.1012 13.078 29.0485 8.41605 30.7598C6.06963 31.621 4.20175 32.1351 2.9042 32.3139L2.89517 32.3151L2.90076 32.3079C3.70508 31.279 5.08637 29.9261 7.00905 28.3344C8.3098 27.2576 9.82397 26.0995 11.5157 24.8908C11.2542 24.2368 11.0436 23.5663 10.8846 22.8851C3.76467 27.9073 -0.553824 32.2067 0.355597 33.7743C1.67763 36.0532 13.5471 31.6964 26.8668 24.043C40.1864 16.3897 49.9125 8.33797 48.5904 6.05906C47.6897 4.50641 41.8931 6.03397 34.0775 9.58568C34.59 10.0643 35.0673 10.582 35.5047 11.1352C37.3171 10.325 39.0054 9.63323 40.53 9.07361C42.8764 8.21232 44.7443 7.69825 46.0418 7.51951ZM1.6114 32.3448C1.61158 32.3447 1.61538 32.3457 1.62228 32.348C1.61468 32.3461 1.61123 32.3449 1.6114 32.3448ZM2.23007 33.3957C2.22794 33.4032 2.22724 33.4068 2.22741 33.4067C2.22752 33.4066 2.22798 33.4051 2.22866 33.4023C2.22906 33.4006 2.22954 33.3984 2.23007 33.3957ZM47.3237 7.48534C47.3313 7.48727 47.3348 7.48844 47.3346 7.48854C47.3344 7.48864 47.3306 7.48768 47.3237 7.48534Z" fill="url(#paint2_linear_3251_37255)"/><path fill-rule="evenodd" clip-rule="evenodd" d="M46.7183 6.42859C46.7186 6.42726 46.7187 6.42663 46.7186 6.42667C46.7184 6.42676 46.7174 6.43052 46.7159 6.43764C46.7172 6.43336 46.7179 6.43036 46.7183 6.42859ZM46.0418 7.51951L46.0508 7.51827L46.0452 7.52543C45.2409 8.5544 43.8596 9.90727 41.937 11.499C38.1168 14.6615 32.4559 18.5249 25.8632 22.313C19.2704 26.1012 13.078 29.0485 8.41605 30.7598C6.06963 31.621 4.20175 32.1351 2.9042 32.3139L2.89517 32.3151L2.90076 32.3079C3.70508 31.279 5.08637 29.9261 7.00905 28.3344C8.3098 27.2576 9.82397 26.0995 11.5157 24.8908C11.2542 24.2368 11.0436 23.5663 10.8846 22.8851C3.76467 27.9073 -0.553824 32.2067 0.355597 33.7743C1.67763 36.0532 13.5471 31.6964 26.8668 24.043C40.1864 16.3897 49.9125 8.33797 48.5904 6.05906C47.6897 4.50641 41.8931 6.03397 34.0775 9.58568C34.59 10.0643 35.0673 10.582 35.5047 11.1352C37.3171 10.325 39.0054 9.63323 40.53 9.07361C42.8764 8.21232 44.7443 7.69825 46.0418 7.51951ZM1.6114 32.3448C1.61158 32.3447 1.61538 32.3457 1.62228 32.348C1.61468 32.3461 1.61123 32.3449 1.6114 32.3448ZM2.23007 33.3957C2.22794 33.4032 2.22724 33.4068 2.22741 33.4067C2.22752 33.4066 2.22798 33.4051 2.22866 33.4023C2.22906 33.4006 2.22954 33.3984 2.23007 33.3957ZM47.3237 7.48534C47.3313 7.48727 47.3348 7.48844 47.3346 7.48854C47.3344 7.48864 47.3306 7.48768 47.3237 7.48534Z" fill="url(#paint3_linear_3251_37255)"/></g><g filter="url(#filter4_i_3251_37255)"><circle cx="22.7931" cy="10.6108" r="1.42688" transform="rotate(15 22.7931 10.6108)" fill="#F9CE21"/></g><g filter="url(#filter5_i_3251_37255)"><circle cx="18.5138" cy="17.1888" r="1.00415" transform="rotate(15 18.5138 17.1888)" fill="#F9CE21"/></g></g><defs><filter id="filter0_i_3251_37255" x="0" y="-4.99805" width="49.4463" height="49.3301" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dx="0.5" dy="-0.5"/><feGaussianBlur stdDeviation="0.75"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.16 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><filter id="filter1_i_3251_37255" x="11.96" y="10.2129" width="26.2539" height="20.7666" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><filter id="filter2_i_3251_37255" x="10.5176" y="5.80273" width="28" height="27.8994" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><filter id="filter3_di_3251_37255" x="-0.764648" y="5.4541" width="50.4756" height="30.9258" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="1"/><feGaussianBlur stdDeviation="0.5"/><feComposite in2="hardAlpha" operator="out"/><feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0"/><feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_3251_37255"/><feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_3251_37255" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect2_innerShadow_3251_37255"/></filter><filter id="filter4_i_3251_37255" x="21.3662" y="9.18359" width="2.85449" height="2.85449" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><filter id="filter5_i_3251_37255" x="17.5098" y="16.1846" width="2.00879" height="2.00879" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><linearGradient id="paint0_linear_3251_37255" x1="28.5675" y1="9.01488" x2="22.5459" y2="31.4876" gradientUnits="userSpaceOnUse"><stop stop-color="#B1261A"/><stop offset="0.0001" stop-color="#C4341D"/><stop offset="1" stop-color="#EE5225"/></linearGradient><linearGradient id="paint1_linear_3251_37255" x1="17.5061" y1="2.22488" x2="26.3834" y2="29.2746" gradientUnits="userSpaceOnUse"><stop stop-color="#FFF301"/><stop offset="1" stop-color="#F58C1D"/></linearGradient><linearGradient id="paint2_linear_3251_37255" x1="29.6281" y1="0.678335" x2="19.3182" y2="39.1555" gradientUnits="userSpaceOnUse"><stop stop-color="#EF1926"/><stop offset="1" stop-color="#F26520"/></linearGradient><linearGradient id="paint3_linear_3251_37255" x1="29.6281" y1="0.678335" x2="19.3182" y2="39.1555" gradientUnits="userSpaceOnUse"><stop stop-color="#B1261A"/><stop offset="0.0001" stop-color="#C4341D"/><stop offset="1" stop-color="#EE5225"/></linearGradient></defs></svg> </a> <div class="header__menu"> <menu> <ul id="menu-2023-main-menu" class="menu"><li id="menu-item-1974401" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1974401"><a href="https://www.cozmoslabs.com/wordpress-profile-builder/">Profile Builder</a></li> <li id="menu-item-1974402" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1974402"><a href="https://www.cozmoslabs.com/wordpress-paid-member-subscriptions/">Paid Member Subscriptions</a></li> <li id="menu-item-1974399" class="menu-item menu-item-type-post_type menu-item-object-page current_page_parent menu-item-1974399"><a href="https://www.cozmoslabs.com/blog/">Blog</a></li> <li id="menu-item-1974400" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1974400"><a href="https://www.cozmoslabs.com/support/">Support</a></li> </ul> </menu> <div class="header__bundle"> <a class="cz-button cz-button--bundle header__action__bundle" href="/ultimate-membership-bundle/" target="">Ultimate Membership Bundle </a> <div class="header__bundle__decoration"> <img width="109" height="64" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20109%2064'%3E%3C/svg%3E" data-lazy-src="https://www.cozmoslabs.com/wp-content/themes/cozmoslabs/assets/dist/img/header-bundle-decoration.png"><noscript><img width="109" height="64" src="https://www.cozmoslabs.com/wp-content/themes/cozmoslabs/assets/dist/img/header-bundle-decoration.png"></noscript> </div> </div> <a class="cz-button header__action__profile" href="https://www.cozmoslabs.com/account/">Login</a> </div> <div class="hamburger-toggle"> <button class="hamburger hamburger--spin" type="button"> <span class="hamburger-box"> <span class="hamburger-inner"></span> </span> <span class="vh">Toggle Drawer Menu</span> </button> </div> </div> </header> <div class="drawer" tabindex="-1"> <div class="drawer__main"> <div class="drawer__header"> <a class="drawer__logo" href="https://www.cozmoslabs.com/"> <span class="vh">Cozmoslabs home page</span> <svg width="214" height="40" viewBox="0 0 214 40" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M57.84 19.6C57.84 17.952 58.208 16.48 58.944 15.184C59.696 13.872 60.712 12.856 61.992 12.136C63.288 11.4 64.736 11.032 66.336 11.032C68.208 11.032 69.848 11.512 71.256 12.472C72.664 13.432 73.648 14.76 74.208 16.456H70.344C69.96 15.656 69.416 15.056 68.712 14.656C68.024 14.256 67.224 14.056 66.312 14.056C65.336 14.056 64.464 14.288 63.696 14.752C62.944 15.2 62.352 15.84 61.92 16.672C61.504 17.504 61.296 18.48 61.296 19.6C61.296 20.704 61.504 21.68 61.92 22.528C62.352 23.36 62.944 24.008 63.696 24.472C64.464 24.92 65.336 25.144 66.312 25.144C67.224 25.144 68.024 24.944 68.712 24.544C69.416 24.128 69.96 23.52 70.344 22.72H74.208C73.648 24.432 72.664 25.768 71.256 26.728C69.864 27.672 68.224 28.144 66.336 28.144C64.736 28.144 63.288 27.784 61.992 27.064C60.712 26.328 59.696 25.312 58.944 24.016C58.208 22.72 57.84 21.248 57.84 19.6ZM82.2619 28.216C80.9819 28.216 79.8299 27.936 78.8059 27.376C77.7819 26.8 76.9739 25.992 76.3819 24.952C75.8059 23.912 75.5179 22.712 75.5179 21.352C75.5179 19.992 75.8139 18.792 76.4059 17.752C77.0139 16.712 77.8379 15.912 78.8779 15.352C79.9179 14.776 81.0779 14.488 82.3579 14.488C83.6379 14.488 84.7979 14.776 85.8379 15.352C86.8779 15.912 87.6939 16.712 88.2859 17.752C88.8939 18.792 89.1979 19.992 89.1979 21.352C89.1979 22.712 88.8859 23.912 88.2619 24.952C87.6539 25.992 86.8219 26.8 85.7659 27.376C84.7259 27.936 83.5579 28.216 82.2619 28.216ZM82.2619 25.288C82.8699 25.288 83.4379 25.144 83.9659 24.856C84.5099 24.552 84.9419 24.104 85.2619 23.512C85.5819 22.92 85.7419 22.2 85.7419 21.352C85.7419 20.088 85.4059 19.12 84.7339 18.448C84.0779 17.76 83.2699 17.416 82.3099 17.416C81.3499 17.416 80.5419 17.76 79.8859 18.448C79.2459 19.12 78.9259 20.088 78.9259 21.352C78.9259 22.616 79.2379 23.592 79.8619 24.28C80.5019 24.952 81.3019 25.288 82.2619 25.288ZM94.0146 25.24H99.9426V28H90.1986V25.288L96.0066 17.464H90.2226V14.704H99.8706V17.416L94.0146 25.24ZM118.336 14.512C119.968 14.512 121.28 15.016 122.272 16.024C123.28 17.016 123.784 18.408 123.784 20.2V28H120.424V20.656C120.424 19.616 120.16 18.824 119.632 18.28C119.104 17.72 118.384 17.44 117.472 17.44C116.56 17.44 115.832 17.72 115.288 18.28C114.76 18.824 114.496 19.616 114.496 20.656V28H111.136V20.656C111.136 19.616 110.872 18.824 110.344 18.28C109.816 17.72 109.096 17.44 108.184 17.44C107.256 17.44 106.52 17.72 105.976 18.28C105.448 18.824 105.184 19.616 105.184 20.656V28H101.824V14.704H105.184V16.312C105.616 15.752 106.168 15.312 106.84 14.992C107.528 14.672 108.28 14.512 109.096 14.512C110.136 14.512 111.064 14.736 111.88 15.184C112.696 15.616 113.328 16.24 113.776 17.056C114.208 16.288 114.832 15.672 115.648 15.208C116.48 14.744 117.376 14.512 118.336 14.512ZM132.157 28.216C130.877 28.216 129.725 27.936 128.701 27.376C127.677 26.8 126.869 25.992 126.277 24.952C125.701 23.912 125.413 22.712 125.413 21.352C125.413 19.992 125.709 18.792 126.301 17.752C126.909 16.712 127.733 15.912 128.773 15.352C129.813 14.776 130.973 14.488 132.253 14.488C133.533 14.488 134.693 14.776 135.733 15.352C136.773 15.912 137.589 16.712 138.181 17.752C138.789 18.792 139.093 19.992 139.093 21.352C139.093 22.712 138.781 23.912 138.157 24.952C137.549 25.992 136.717 26.8 135.661 27.376C134.621 27.936 133.453 28.216 132.157 28.216ZM132.157 25.288C132.765 25.288 133.333 25.144 133.861 24.856C134.405 24.552 134.837 24.104 135.157 23.512C135.477 22.92 135.637 22.2 135.637 21.352C135.637 20.088 135.301 19.12 134.629 18.448C133.973 17.76 133.165 17.416 132.205 17.416C131.245 17.416 130.437 17.76 129.781 18.448C129.141 19.12 128.821 20.088 128.821 21.352C128.821 22.616 129.133 23.592 129.757 24.28C130.397 24.952 131.197 25.288 132.157 25.288ZM145.925 28.216C144.837 28.216 143.861 28.024 142.997 27.64C142.133 27.24 141.445 26.704 140.933 26.032C140.437 25.36 140.165 24.616 140.117 23.8H143.501C143.565 24.312 143.813 24.736 144.245 25.072C144.693 25.408 145.245 25.576 145.901 25.576C146.541 25.576 147.037 25.448 147.389 25.192C147.757 24.936 147.941 24.608 147.941 24.208C147.941 23.776 147.717 23.456 147.269 23.248C146.837 23.024 146.141 22.784 145.181 22.528C144.189 22.288 143.373 22.04 142.733 21.784C142.109 21.528 141.565 21.136 141.101 20.608C140.653 20.08 140.429 19.368 140.429 18.472C140.429 17.736 140.637 17.064 141.053 16.456C141.485 15.848 142.093 15.368 142.877 15.016C143.677 14.664 144.613 14.488 145.685 14.488C147.269 14.488 148.533 14.888 149.477 15.688C150.421 16.472 150.941 17.536 151.037 18.88H147.821C147.773 18.352 147.549 17.936 147.149 17.632C146.765 17.312 146.245 17.152 145.589 17.152C144.981 17.152 144.509 17.264 144.173 17.488C143.853 17.712 143.693 18.024 143.693 18.424C143.693 18.872 143.917 19.216 144.365 19.456C144.813 19.68 145.509 19.912 146.453 20.152C147.413 20.392 148.205 20.64 148.829 20.896C149.453 21.152 149.989 21.552 150.437 22.096C150.901 22.624 151.141 23.328 151.157 24.208C151.157 24.976 150.941 25.664 150.509 26.272C150.093 26.88 149.485 27.36 148.685 27.712C147.901 28.048 146.981 28.216 145.925 28.216ZM156.555 10.24V28H153.195V10.24H156.555ZM158.291 21.304C158.291 19.96 158.555 18.768 159.083 17.728C159.627 16.688 160.355 15.888 161.267 15.328C162.195 14.768 163.227 14.488 164.363 14.488C165.355 14.488 166.219 14.688 166.955 15.088C167.707 15.488 168.307 15.992 168.755 16.6V14.704H172.139V28H168.755V26.056C168.323 26.68 167.723 27.2 166.955 27.616C166.203 28.016 165.331 28.216 164.339 28.216C163.219 28.216 162.195 27.928 161.267 27.352C160.355 26.776 159.627 25.968 159.083 24.928C158.555 23.872 158.291 22.664 158.291 21.304ZM168.755 21.352C168.755 20.536 168.595 19.84 168.275 19.264C167.955 18.672 167.523 18.224 166.979 17.92C166.435 17.6 165.851 17.44 165.227 17.44C164.603 17.44 164.027 17.592 163.499 17.896C162.971 18.2 162.539 18.648 162.203 19.24C161.883 19.816 161.723 20.504 161.723 21.304C161.723 22.104 161.883 22.808 162.203 23.416C162.539 24.008 162.971 24.464 163.499 24.784C164.043 25.104 164.619 25.264 165.227 25.264C165.851 25.264 166.435 25.112 166.979 24.808C167.523 24.488 167.955 24.04 168.275 23.464C168.595 22.872 168.755 22.168 168.755 21.352ZM178.061 16.648C178.493 16.008 179.085 15.488 179.837 15.088C180.605 14.688 181.477 14.488 182.453 14.488C183.589 14.488 184.613 14.768 185.525 15.328C186.453 15.888 187.181 16.688 187.709 17.728C188.253 18.752 188.525 19.944 188.525 21.304C188.525 22.664 188.253 23.872 187.709 24.928C187.181 25.968 186.453 26.776 185.525 27.352C184.613 27.928 183.589 28.216 182.453 28.216C181.461 28.216 180.589 28.024 179.837 27.64C179.101 27.24 178.509 26.728 178.061 26.104V28H174.701V10.24H178.061V16.648ZM185.093 21.304C185.093 20.504 184.925 19.816 184.589 19.24C184.269 18.648 183.837 18.2 183.293 17.896C182.765 17.592 182.189 17.44 181.565 17.44C180.957 17.44 180.381 17.6 179.837 17.92C179.309 18.224 178.877 18.672 178.541 19.264C178.221 19.856 178.061 20.552 178.061 21.352C178.061 22.152 178.221 22.848 178.541 23.44C178.877 24.032 179.309 24.488 179.837 24.808C180.381 25.112 180.957 25.264 181.565 25.264C182.189 25.264 182.765 25.104 183.293 24.784C183.837 24.464 184.269 24.008 184.589 23.416C184.925 22.824 185.093 22.12 185.093 21.304ZM195.334 28.216C194.246 28.216 193.27 28.024 192.406 27.64C191.542 27.24 190.854 26.704 190.342 26.032C189.846 25.36 189.574 24.616 189.526 23.8H192.91C192.974 24.312 193.222 24.736 193.654 25.072C194.102 25.408 194.654 25.576 195.31 25.576C195.95 25.576 196.446 25.448 196.798 25.192C197.166 24.936 197.35 24.608 197.35 24.208C197.35 23.776 197.126 23.456 196.678 23.248C196.246 23.024 195.55 22.784 194.59 22.528C193.598 22.288 192.782 22.04 192.142 21.784C191.518 21.528 190.974 21.136 190.51 20.608C190.062 20.08 189.838 19.368 189.838 18.472C189.838 17.736 190.046 17.064 190.462 16.456C190.894 15.848 191.502 15.368 192.286 15.016C193.086 14.664 194.022 14.488 195.094 14.488C196.678 14.488 197.942 14.888 198.886 15.688C199.83 16.472 200.35 17.536 200.446 18.88H197.23C197.182 18.352 196.958 17.936 196.558 17.632C196.174 17.312 195.654 17.152 194.998 17.152C194.39 17.152 193.918 17.264 193.582 17.488C193.262 17.712 193.102 18.024 193.102 18.424C193.102 18.872 193.326 19.216 193.774 19.456C194.222 19.68 194.918 19.912 195.862 20.152C196.822 20.392 197.614 20.64 198.238 20.896C198.862 21.152 199.398 21.552 199.846 22.096C200.31 22.624 200.55 23.328 200.566 24.208C200.566 24.976 200.35 25.664 199.918 26.272C199.502 26.88 198.894 27.36 198.094 27.712C197.31 28.048 196.39 28.216 195.334 28.216Z" fill="#212121"/><g filter="url(#filter0_i_3251_37255)"><g filter="url(#filter1_i_3251_37255)"><path fill-rule="evenodd" clip-rule="evenodd" d="M12.1604 25.0374L12.0723 23.2852C11.8131 22.462 11.8387 20.7045 14.0136 20.2594C15.5588 19.9432 15.8577 18.3302 16.1334 16.8426C16.3427 15.7129 16.5387 14.6556 17.2568 14.2935C18.5878 13.6224 20.1053 15.5536 20.6978 16.6031C21.6418 17.7468 23.883 19.3683 25.2957 16.7045C27.0615 13.3748 32.5188 9.94287 33.0931 10.2302C35.9576 11.6631 37.6598 14.6729 37.5151 15.4049L38.2141 21.8104L20.6486 30.9792L14.9829 28.9605C13.8189 27.8227 12.8651 26.4925 12.1604 25.0374Z" fill="url(#paint0_linear_3251_37255)"/></g><g filter="url(#filter2_i_3251_37255)"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.3478 24.4521C10.4114 21.8669 10.2294 18.9821 10.9939 16.1288C12.9869 8.69079 20.6572 4.28349 28.1261 6.28476C35.595 8.28604 40.034 15.9381 38.041 23.376C36.2972 29.8842 30.2066 34.0721 23.7076 33.6767C22.7792 33.6202 21.8424 33.4702 20.9088 33.22C20.442 33.0949 19.987 32.9478 19.5448 32.78C18.5496 32.4025 17.6186 31.9204 16.7611 31.3502C14.2412 29.6745 12.3567 27.2371 11.3478 24.4521ZM12.0637 20.9995C12.2609 22.9117 13.0666 25.5484 14.9715 25.2909V25.2909C16.3461 25.1052 17.3653 23.3644 17.3653 23.3644C18.2629 22.1002 18.0667 17.352 20.6696 19.2848C22.1223 21.3511 22.9645 21.8581 23.2041 21.8532C23.6567 22.0392 24.5574 22.0787 24.5396 20.7488C24.5217 19.4189 23.9348 17.1619 23.5309 15.654C23.2845 14.3403 23.9165 12.5679 25.8761 13.5207C26.3356 13.7887 27.1645 14.1545 29.3436 15.9415C31.5226 17.7285 33.0623 16.6014 34.2353 14.9759V14.9759C34.8743 14.0904 34.9131 13.0124 34.3908 12.0534C33.0516 9.59429 31.1567 8.6242 27.7443 7.70983C21.0657 5.92032 14.207 9.86127 12.4249 16.5122C12.0213 18.0185 11.9127 19.5345 12.0637 20.9995Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M11.3478 24.4521C10.4114 21.8669 10.2294 18.9821 10.9939 16.1288C12.9869 8.69079 20.6572 4.28349 28.1261 6.28476C35.595 8.28604 40.034 15.9381 38.041 23.376C36.2972 29.8842 30.2066 34.0721 23.7076 33.6767C22.7792 33.6202 21.8424 33.4702 20.9088 33.22C20.442 33.0949 19.987 32.9478 19.5448 32.78C18.5496 32.4025 17.6186 31.9204 16.7611 31.3502C14.2412 29.6745 12.3567 27.2371 11.3478 24.4521ZM12.0637 20.9995C12.2609 22.9117 13.0666 25.5484 14.9715 25.2909V25.2909C16.3461 25.1052 17.3653 23.3644 17.3653 23.3644C18.2629 22.1002 18.0667 17.352 20.6696 19.2848C22.1223 21.3511 22.9645 21.8581 23.2041 21.8532C23.6567 22.0392 24.5574 22.0787 24.5396 20.7488C24.5217 19.4189 23.9348 17.1619 23.5309 15.654C23.2845 14.3403 23.9165 12.5679 25.8761 13.5207C26.3356 13.7887 27.1645 14.1545 29.3436 15.9415C31.5226 17.7285 33.0623 16.6014 34.2353 14.9759V14.9759C34.8743 14.0904 34.9131 13.0124 34.3908 12.0534C33.0516 9.59429 31.1567 8.6242 27.7443 7.70983C21.0657 5.92032 14.207 9.86127 12.4249 16.5122C12.0213 18.0185 11.9127 19.5345 12.0637 20.9995Z" fill="url(#paint1_linear_3251_37255)"/></g><g filter="url(#filter3_di_3251_37255)"><path fill-rule="evenodd" clip-rule="evenodd" d="M46.7183 6.42859C46.7186 6.42726 46.7187 6.42663 46.7186 6.42667C46.7184 6.42676 46.7174 6.43052 46.7159 6.43764C46.7172 6.43336 46.7179 6.43036 46.7183 6.42859ZM46.0418 7.51951L46.0508 7.51827L46.0452 7.52543C45.2409 8.5544 43.8596 9.90727 41.937 11.499C38.1168 14.6615 32.4559 18.5249 25.8632 22.313C19.2704 26.1012 13.078 29.0485 8.41605 30.7598C6.06963 31.621 4.20175 32.1351 2.9042 32.3139L2.89517 32.3151L2.90076 32.3079C3.70508 31.279 5.08637 29.9261 7.00905 28.3344C8.3098 27.2576 9.82397 26.0995 11.5157 24.8908C11.2542 24.2368 11.0436 23.5663 10.8846 22.8851C3.76467 27.9073 -0.553824 32.2067 0.355597 33.7743C1.67763 36.0532 13.5471 31.6964 26.8668 24.043C40.1864 16.3897 49.9125 8.33797 48.5904 6.05906C47.6897 4.50641 41.8931 6.03397 34.0775 9.58568C34.59 10.0643 35.0673 10.582 35.5047 11.1352C37.3171 10.325 39.0054 9.63323 40.53 9.07361C42.8764 8.21232 44.7443 7.69825 46.0418 7.51951ZM1.6114 32.3448C1.61158 32.3447 1.61538 32.3457 1.62228 32.348C1.61468 32.3461 1.61123 32.3449 1.6114 32.3448ZM2.23007 33.3957C2.22794 33.4032 2.22724 33.4068 2.22741 33.4067C2.22752 33.4066 2.22798 33.4051 2.22866 33.4023C2.22906 33.4006 2.22954 33.3984 2.23007 33.3957ZM47.3237 7.48534C47.3313 7.48727 47.3348 7.48844 47.3346 7.48854C47.3344 7.48864 47.3306 7.48768 47.3237 7.48534Z" fill="url(#paint2_linear_3251_37255)"/><path fill-rule="evenodd" clip-rule="evenodd" d="M46.7183 6.42859C46.7186 6.42726 46.7187 6.42663 46.7186 6.42667C46.7184 6.42676 46.7174 6.43052 46.7159 6.43764C46.7172 6.43336 46.7179 6.43036 46.7183 6.42859ZM46.0418 7.51951L46.0508 7.51827L46.0452 7.52543C45.2409 8.5544 43.8596 9.90727 41.937 11.499C38.1168 14.6615 32.4559 18.5249 25.8632 22.313C19.2704 26.1012 13.078 29.0485 8.41605 30.7598C6.06963 31.621 4.20175 32.1351 2.9042 32.3139L2.89517 32.3151L2.90076 32.3079C3.70508 31.279 5.08637 29.9261 7.00905 28.3344C8.3098 27.2576 9.82397 26.0995 11.5157 24.8908C11.2542 24.2368 11.0436 23.5663 10.8846 22.8851C3.76467 27.9073 -0.553824 32.2067 0.355597 33.7743C1.67763 36.0532 13.5471 31.6964 26.8668 24.043C40.1864 16.3897 49.9125 8.33797 48.5904 6.05906C47.6897 4.50641 41.8931 6.03397 34.0775 9.58568C34.59 10.0643 35.0673 10.582 35.5047 11.1352C37.3171 10.325 39.0054 9.63323 40.53 9.07361C42.8764 8.21232 44.7443 7.69825 46.0418 7.51951ZM1.6114 32.3448C1.61158 32.3447 1.61538 32.3457 1.62228 32.348C1.61468 32.3461 1.61123 32.3449 1.6114 32.3448ZM2.23007 33.3957C2.22794 33.4032 2.22724 33.4068 2.22741 33.4067C2.22752 33.4066 2.22798 33.4051 2.22866 33.4023C2.22906 33.4006 2.22954 33.3984 2.23007 33.3957ZM47.3237 7.48534C47.3313 7.48727 47.3348 7.48844 47.3346 7.48854C47.3344 7.48864 47.3306 7.48768 47.3237 7.48534Z" fill="url(#paint3_linear_3251_37255)"/></g><g filter="url(#filter4_i_3251_37255)"><circle cx="22.7931" cy="10.6108" r="1.42688" transform="rotate(15 22.7931 10.6108)" fill="#F9CE21"/></g><g filter="url(#filter5_i_3251_37255)"><circle cx="18.5138" cy="17.1888" r="1.00415" transform="rotate(15 18.5138 17.1888)" fill="#F9CE21"/></g></g><defs><filter id="filter0_i_3251_37255" x="0" y="-4.99805" width="49.4463" height="49.3301" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dx="0.5" dy="-0.5"/><feGaussianBlur stdDeviation="0.75"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.16 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><filter id="filter1_i_3251_37255" x="11.96" y="10.2129" width="26.2539" height="20.7666" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><filter id="filter2_i_3251_37255" x="10.5176" y="5.80273" width="28" height="27.8994" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><filter id="filter3_di_3251_37255" x="-0.764648" y="5.4541" width="50.4756" height="30.9258" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="1"/><feGaussianBlur stdDeviation="0.5"/><feComposite in2="hardAlpha" operator="out"/><feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0"/><feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_3251_37255"/><feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_3251_37255" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect2_innerShadow_3251_37255"/></filter><filter id="filter4_i_3251_37255" x="21.3662" y="9.18359" width="2.85449" height="2.85449" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><filter id="filter5_i_3251_37255" x="17.5098" y="16.1846" width="2.00879" height="2.00879" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><linearGradient id="paint0_linear_3251_37255" x1="28.5675" y1="9.01488" x2="22.5459" y2="31.4876" gradientUnits="userSpaceOnUse"><stop stop-color="#B1261A"/><stop offset="0.0001" stop-color="#C4341D"/><stop offset="1" stop-color="#EE5225"/></linearGradient><linearGradient id="paint1_linear_3251_37255" x1="17.5061" y1="2.22488" x2="26.3834" y2="29.2746" gradientUnits="userSpaceOnUse"><stop stop-color="#FFF301"/><stop offset="1" stop-color="#F58C1D"/></linearGradient><linearGradient id="paint2_linear_3251_37255" x1="29.6281" y1="0.678335" x2="19.3182" y2="39.1555" gradientUnits="userSpaceOnUse"><stop stop-color="#EF1926"/><stop offset="1" stop-color="#F26520"/></linearGradient><linearGradient id="paint3_linear_3251_37255" x1="29.6281" y1="0.678335" x2="19.3182" y2="39.1555" gradientUnits="userSpaceOnUse"><stop stop-color="#B1261A"/><stop offset="0.0001" stop-color="#C4341D"/><stop offset="1" stop-color="#EE5225"/></linearGradient></defs></svg> </a> <div class="hamburger-toggle"> <button class="hamburger hamburger--spin" type="button"> <span class="hamburger-box"> <span class="hamburger-inner"></span> </span> <span class="vh">Toggle Drawer Menu</span> </button> </div> </div> <div class="drawer__actions__wrapper"> <div class="drawer__actions"> <a class="cz-button cz-button--bundle header__action__bundle" href="/ultimate-membership-bundle/" target="">Ultimate Membership Bundle </a> <a class="cz-button header__action__profile" href="https://www.cozmoslabs.com/account/">Login</a> </div> </div> <div class="drawer__nav"> <ul id="menu-2023-drawer" class="menu"><li id="menu-item-2627334" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2627334"><a href="https://www.cozmoslabs.com/wordpress-profile-builder/">Profile Builder</a></li> <li id="menu-item-2627329" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2627329"><a href="https://www.cozmoslabs.com/wordpress-paid-member-subscriptions/">Paid Member Subscriptions</a></li> <li id="menu-item-2627332" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2627332"><a href="https://www.cozmoslabs.com/account/">Account</a></li> <li id="menu-item-2627330" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2627330"><a href="https://www.cozmoslabs.com/support/">Support</a></li> <li id="menu-item-2627331" class="menu-item menu-item-type-post_type menu-item-object-page current_page_parent menu-item-2627331"><a href="https://www.cozmoslabs.com/blog/">Blog</a></li> </ul> <div class="social"> <ul id="menu-2023-social-networks" class="menu"><li id="menu-item-1974427" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974427"><a target="_blank" rel="noopener" href="https://twitter.com/cozmoslabs"><span class="menu-item__ico menu-item__ico--twitter"><svg width="21" height="23" viewBox="0 0 21 23" fill="none" xmlns="http://www.w3.org/2000/svg"> <g id="Social Icons"> <path id="Vector" d="M16.0355 2.33984H18.9873L12.5385 10.0614L20.125 20.5686H14.1848L9.53228 14.196L4.2087 20.5686H1.25513L8.15275 12.3096L0.875 2.33984H6.96597L11.1715 8.16465L16.0355 2.33984ZM14.9995 18.7177H16.6351L6.07722 4.09355H4.32203L14.9995 18.7177Z" fill="white"/> </g> </svg> </span><span class="menu-item__title menu-item__title--twitter">twitter</span></a></li> <li id="menu-item-1974428" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974428"><a target="_blank" rel="noopener" href="https://www.facebook.com/cozmoslabs/"><span class="menu-item__ico menu-item__ico--facebook"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!-- Font Awesome Pro 5.15.4 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) --><path d="M400 32H48A48 48 0 0 0 0 80v352a48 48 0 0 0 48 48h137.25V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.27c-30.81 0-40.42 19.12-40.42 38.73V256h68.78l-11 71.69h-57.78V480H400a48 48 0 0 0 48-48V80a48 48 0 0 0-48-48z"/></svg></span><span class="menu-item__title menu-item__title--facebook">facebook</span></a></li> <li id="menu-item-1974429" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974429"><a target="_blank" rel="noopener" href="https://www.linkedin.com/company/cozmoslabs/"><span class="menu-item__ico menu-item__ico--linkedin"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!-- Font Awesome Pro 5.15.4 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) --><path d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"/></svg></span><span class="menu-item__title menu-item__title--linkedin">linkedin</span></a></li> </ul> </div> </div> </div> </div> <section class="cover wrapper-margin-small small"> <div class="wrapper cover__wrap cover__wrap--bottom"> <div class="cover__left"> <div class="cover__breadcrumbs"><span><span><a href="https://www.cozmoslabs.com/blog/">Blog</a></span> / <span><a href="https://www.cozmoslabs.com/category/profile-builder-2/">Profile Builder</a></span> / <span class="breadcrumb_last" aria-current="page">How To Customize WooCommerce Registration Form (2024 Ultimate Guide)</span></span></div> <h1> How To Customize WooCommerce Registration Form (2024 Ultimate Guide) </h1> </div> </div> </section> <article id="post-201727" class="blog-single wrapper post-201727 post type-post status-publish format-standard has-post-thumbnail hentry category-profile-builder-2 category-tutorials category-woocommerce"> <div class="blog-single__figure"> <img width="1200" height="500" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201200%20500'%3E%3C/svg%3E" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="WooCommerce Registration Form Cozmoslabs" decoding="async" fetchpriority="high" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920.png.webp 1200w,https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920-300x125.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920-768x320.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920-1024x427.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920-600x250.png.webp 600w" data-lazy-sizes="(max-width: 1200px) 100vw, 1200px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920.png.webp" /><noscript><img width="1200" height="500" src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920.png.webp" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="WooCommerce Registration Form Cozmoslabs" decoding="async" fetchpriority="high" srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920.png.webp 1200w,https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920-300x125.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920-768x320.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920-1024x427.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/03/679770_Cozmoslabs_WoocomRegForm_Op1_031920-600x250.png.webp 600w" sizes="(max-width: 1200px) 100vw, 1200px" /></noscript> </div> <div class="blog-single__author-box"> <div class="blog-single__author-avatar"> <img alt='' src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2048%2048'%3E%3C/svg%3E" data-lazy-srcset='https://secure.gravatar.com/avatar/f1350a0704e5201c9b475a0367ca8508?s=96&d=mm&r=g 2x' class='avatar avatar-48 photo' height='48' width='48' decoding='async' data-lazy-src="https://secure.gravatar.com/avatar/f1350a0704e5201c9b475a0367ca8508?s=48&d=mm&r=g"/><noscript><img alt='' src='https://secure.gravatar.com/avatar/f1350a0704e5201c9b475a0367ca8508?s=48&d=mm&r=g' srcset='https://secure.gravatar.com/avatar/f1350a0704e5201c9b475a0367ca8508?s=96&d=mm&r=g 2x' class='avatar avatar-48 photo' height='48' width='48' decoding='async'/></noscript> </div> <div class="blog-single__author-name__wrap"> <div class="blog-single__author-name"> Alex Denning </div> <div class="blog-single__last-updated"> <span class="label">Last Updated: </span> 09/07/24 </div> </div> </div> <div class="blog-single__content"> <div class="content"> <div id="toc_container" class="have_bullets"><p class="toc_title">Table of Contents</p><ul class="toc_list"><li><a href="#Why_You_Should_Customize_the_WooCommerce_Registration_Form_Plus_Examples_of_How_to_Do_It"><span class="toc_number toc_depth_1">1</span> Why You Should Customize the WooCommerce Registration Form (Plus Examples of How to Do It)</a></li><li><a href="#How_Profile_Builder_Pro_Can_Improve_Your_WooCommerce_Registration_and_Profile_Forms"><span class="toc_number toc_depth_1">2</span> How Profile Builder Pro Can Improve Your WooCommerce Registration and Profile Forms</a></li><li><a href="#Installing_and_Configuring_Profile_Builder_Pro_and_the_WooCommerce_Add-on"><span class="toc_number toc_depth_1">3</span> Installing and Configuring Profile Builder Pro and the WooCommerce Add-on</a></li><li><a href="#Configuring_Profile_Builder_Pro_to_Create_Custom_WooCommerce_Registration_Forms"><span class="toc_number toc_depth_1">4</span> Configuring Profile Builder Pro to Create Custom WooCommerce Registration Forms</a></li><li><a href="#Creating_Registration_and_Profile_Forms_with_Profile_Builder"><span class="toc_number toc_depth_1">5</span> Creating Registration and Profile Forms with Profile Builder</a><ul><li><a href="#Creating_a_New_Registration_Form"><span class="toc_number toc_depth_2">5.1</span> Creating a New Registration Form</a><ul><li><a href="#Creating_New_Fields_Select_Box_and_reCAPTCHA"><span class="toc_number toc_depth_3">5.1.1</span> Creating New Fields: Select Box and reCAPTCHA</a></li><li><a href="#Adding_Your_New_Fields_to_the_Form"><span class="toc_number toc_depth_3">5.1.2</span> Adding Your New Fields to the Form</a></li><li><a href="#Adding_a_Redirect_to_the_Form"><span class="toc_number toc_depth_3">5.1.3</span> Adding a Redirect to the Form</a></li></ul></li><li><a href="#Creating_a_New_Edit_Profile_Form"><span class="toc_number toc_depth_2">5.2</span> Creating a New Edit Profile Form</a><ul><li><a href="#Creating_the_Form"><span class="toc_number toc_depth_3">5.2.1</span> Creating the Form</a></li><li><a href="#Creating_a_New_Field_for_Adding_a_Phone_Number"><span class="toc_number toc_depth_3">5.2.2</span> Creating a New Field for Adding a Phone Number</a></li><li><a href="#Adding_Conditional_Logic_to_Fields"><span class="toc_number toc_depth_3">5.2.3</span> Adding Conditional Logic to Fields</a></li></ul></li></ul></li><li><a href="#Adding_Your_Forms_to_the_WooCommerce_Screens"><span class="toc_number toc_depth_1">6</span> Adding Your Forms to the WooCommerce Screens</a></li><li><a href="#Customizing_Other_Parts_of_the_WooCommerce_Registration_Process"><span class="toc_number toc_depth_1">7</span> Customizing Other Parts of the WooCommerce Registration Process</a><ul><li><a href="#Adding_Fields_to_the_Registration_Form_at_WooCommerce_Checkout"><span class="toc_number toc_depth_2">7.1</span> Adding Fields to the Registration Form at WooCommerce Checkout</a></li><li><a href="#Creating_a_Custom_WooCommerce_Registration_Page"><span class="toc_number toc_depth_2">7.2</span> Creating a Custom WooCommerce Registration Page</a></li></ul></li><li><a href="#Create_Your_Custom_WooCommerce_Registration_Form_Today"><span class="toc_number toc_depth_1">8</span> Create Your Custom WooCommerce Registration Form Today</a><ul><li><a href="#Profile_Builder_Pro"><span class="toc_number toc_depth_2">8.1</span> Profile Builder Pro</a></li></ul></li></ul></div> <p>Customizing the WooCommerce registration form in WordPress is something you should consider doing if you want to get more from your WooCommerce store and from the customer registration process. However, the WooCommerce plugin only allows you to collect basic information about your new users.</p> <p>If you customize it using <a href="https://www.cozmoslabs.com/wordpress-profile-builder/?utm_source=blog&utm_content=woocommerce-registration-form" target="_blank" rel="noopener noreferrer">Profile Builder Pro</a>, you can collect the exact information you need and make the registration process a better experience for your customers. For instance, you can allow users to add an avatar to their profile or implement a reCAPTCHA feature to keep out spammers.</p> <p>In this post, we’ll start by discussing the benefits of customizing the WooCommerce registration form. Then, we’ll show you how to do it with Profile Builder Pro. Let’s get started!</p> <h2 class="wp-block-heading"><span id="Why_You_Should_Customize_the_WooCommerce_Registration_Form_Plus_Examples_of_How_to_Do_It">Why You Should Customize the WooCommerce Registration Form (Plus Examples of How to Do It)</span></h2> <p>The benefits of customizing the WooCommerce registration form include capturing user data that helps you upsell to customers, creating custom forms for individual user groups, reordering fields in your forms to make them more user-friendly, redirecting users to a custom page after registration – and lots more.</p> <p>There are plenty of ways you can improve the WooCommerce registration and profile forms, but in this post, we’re going to look at some specific examples you’re likely to find the most useful. These are:</p> <ul> <li>Adding custom fields to the WooCommerce registration form so you can collect additional information about your customers</li> <li>Enabling avatar uploads so users can customize their profiles</li> <li>Integrating reCAPTCHA to keep out spammers</li> <li><a href="https://www.cozmoslabs.com/113343-add-conditional-logic-fields-woocommerce-checkout-page/">Using conditional logic</a> so that fields are only displayed if they’re needed. This way, you don’t force people to fill out fields that aren’t relevant</li> </ul> <p>These are just a few examples of ways you can improve your WooCommerce registration form.</p> <h2 class="wp-block-heading"><span id="How_Profile_Builder_Pro_Can_Improve_Your_WooCommerce_Registration_and_Profile_Forms">How Profile Builder Pro Can Improve Your WooCommerce Registration and Profile Forms</span></h2> <p>If you’ve decided that the benefits of creating a WooCommerce registration form are worth it, you’ll need a robust form tool to help you get the job done. That’s where Profile Builder Pro comes in.</p> <p>Profile Builder Pro is a form builder that uses blocks (and shortcodes) to add custom registration forms to your WordPress site. You can use it for user login forms and registration forms on membership sites, but also for WooCommerce sites. With WooCommerce the plugin makes it even easier – it taps into WooCommerce’s own API to add custom forms that you create.</p> <p>What’s more, the plugin gives you endless flexibility when it comes to <a href="https://www.cozmoslabs.com/196021-custom-wordpress-registration-form/?utm_source=blog&utm_content=woocommerce-registration-form">customizing WordPress registration forms</a>, including WooCommerce forms. </p> <p>In this tutorial, I’ll show you how to remove some unnecessary fields and add some useful fields to two forms: the registration form and the profile editing form.</p> <p>Here’s an example of the default WooCommerce registration form:</p> <div class="wp-block-image border"> <figure class="aligncenter"><img width="1200" height="750" decoding="async" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201200%20750'%3E%3C/svg%3E" alt="default WooCommerce registration form" class="wp-image-190435" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/default-WooCommerce-registration-form-1.jpg.webp" /><noscript><img width="1200" height="750" decoding="async" src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/default-WooCommerce-registration-form-1.jpg.webp" alt="default WooCommerce registration form" class="wp-image-190435" /></noscript></figure></div> <p>And here’s a custom registration form enhanced using the Profile Builder Pro plugin:</p> <div class="wp-block-image border"> <figure class="aligncenter size-large"><img decoding="async" width="940" height="1024" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20940%201024'%3E%3C/svg%3E" alt="Creating a new registration form" class="wp-image-3420047" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-940x1024.png.webp 940w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-275x300.png.webp 275w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-768x836.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-487x530.png.webp 487w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-424x462.png.webp 424w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-550x599.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-354x386.png.webp 354w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-257x280.png.webp 257w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-618x673.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-278x303.png.webp 278w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-219x238.png.webp 219w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form.png.webp 944w" data-lazy-sizes="(max-width: 940px) 100vw, 940px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-940x1024.png.webp" /><noscript><img decoding="async" width="940" height="1024" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-940x1024.png.webp" alt="Creating a new registration form" class="wp-image-3420047" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-940x1024.png.webp 940w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-275x300.png.webp 275w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-768x836.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-487x530.png.webp 487w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-424x462.png.webp 424w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-550x599.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-354x386.png.webp 354w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-257x280.png.webp 257w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-618x673.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-278x303.png.webp 278w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form-219x238.png.webp 219w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/registration-form.png.webp 944w" sizes="(max-width: 940px) 100vw, 940px" /></noscript></figure></div> <p>You can also create enhanced customer profile forms. The default profile form includes fields that aren’t needed for a store. It also leaves out some fields that would be quite helpful:</p> <div class="wp-block-image border"> <figure class="aligncenter"><img width="1442" height="1470" decoding="async" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201442%201470'%3E%3C/svg%3E" alt="The default WooCommerce edit profile form" class="wp-image-190435" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/default-WooCommerce-edit-profile-form.jpg.webp" /><noscript><img width="1442" height="1470" decoding="async" src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/default-WooCommerce-edit-profile-form.jpg.webp" alt="The default WooCommerce edit profile form" class="wp-image-190435" /></noscript></figure></div> <p>But with the Profile Builder plugin, you can customize this and add extra fields that will help you communicate better and sell more to your customers. Here’s the form with customization:</p> <div class="wp-block-image border"> <figure class="aligncenter size-large"><img decoding="async" width="798" height="1024" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20798%201024'%3E%3C/svg%3E" alt="A custom profile edit form" class="wp-image-3420051" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-798x1024.png.webp 798w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-234x300.png.webp 234w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-768x986.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-413x530.png.webp 413w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-360x462.png.webp 360w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-550x706.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-301x386.png.webp 301w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-218x280.png.webp 218w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-618x793.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-236x303.png.webp 236w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-185x238.png.webp 185w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile.png.webp 953w" data-lazy-sizes="(max-width: 798px) 100vw, 798px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-798x1024.png.webp" /><noscript><img decoding="async" width="798" height="1024" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-798x1024.png.webp" alt="A custom profile edit form" class="wp-image-3420051" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-798x1024.png.webp 798w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-234x300.png.webp 234w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-768x986.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-413x530.png.webp 413w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-360x462.png.webp 360w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-550x706.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-301x386.png.webp 301w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-218x280.png.webp 218w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-618x793.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-236x303.png.webp 236w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile-185x238.png.webp 185w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/edit-user-profile.png.webp 953w" sizes="(max-width: 798px) 100vw, 798px" /></noscript></figure></div> <p>There’s a <a href="https://wordpress.org/plugins/profile-builder/" target="_blank" rel="noopener noreferrer">free version</a> of the plugin plus a <a href="https://www.cozmoslabs.com/wordpress-profile-builder/">premium version</a> with more features, so you can choose the one that’s right for you and your store. You can also use a wide variety of <a href="https://www.cozmoslabs.com/profile-builder-add-ons/">free and advanced add-ons</a> to get access to extra functionality and integrations with other services or plugins.</p> <p>So let’s take a look at how you can use Profile Builder to customize your WooCommerce registration form.</p> <h2 class="wp-block-heading"><span id="Installing_and_Configuring_Profile_Builder_Pro_and_the_WooCommerce_Add-on">Installing and Configuring Profile Builder Pro and the WooCommerce Add-on</span></h2> <p>To customize your WooCommerce registration form, you’ll first need to have the free<a href="https://en-gb.wordpress.org/plugins/woocommerce/" target="_blank" rel="noopener noreferrer"> WooCommerce</a> plugin installed, activated, and configured on your site.</p> <p>Once you’ve done that, you’re ready to install and configure the<a href="https://www.cozmoslabs.com/wordpress-profile-builder/?utm_source=blog&utm_content=woocommerce-registration-form" target="_blank" rel="noopener noreferrer"> Profile Builder Pro</a> plugin and the <a href="https://www.cozmoslabs.com/add-ons/woocommerce-sync/?utm_source=blog&utm_content=woocommerce-registration-form">WooCommerce Sync</a> add-on.</p> <p>Follow these steps for each of those two plugins to install and activate them, starting with the Profile Builder Pro plugin.</p> <p>When you purchase a Profile Builder Pro license, you’ll be sent a download link. Use this to download the plugin as a zip file and save it to your computer. Now go to <b>Plugins → Add New</b> and click the <b>Upload Plugin</b> button:</p> <div class="wp-block-image"> <figure class="aligncenter"><img width="3014" height="1270" decoding="async" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%203014%201270'%3E%3C/svg%3E" alt="upload plugin screen in WordPress" class="wp-image-190435" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/upload-plugin-screen.jpg.webp" /><noscript><img width="3014" height="1270" decoding="async" src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/upload-plugin-screen.jpg.webp" alt="upload plugin screen in WordPress" class="wp-image-190435" /></noscript></figure></div> <p>Upload the zip file you just downloaded and click on the <b>Install Now</b> button. You’ll be prompted to activate the plugin – click the <b>Activate Plugin</b> button to do this.</p> <p>Once you’ve installed the plugin in WordPress, you’ll need to register it. If you aren’t automatically taken to the registration page, go to <b>Profile Builder → Register Version</b>:</p> <div class="wp-block-image"> <figure class="aligncenter size-full"><img decoding="async" width="957" height="444" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20957%20444'%3E%3C/svg%3E" alt="Profile Builder license registration page" class="wp-image-3420066" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key.png.webp 957w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-300x139.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-768x356.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-550x255.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-642x298.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-668x310.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-440x204.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-618x287.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-485x225.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-270x125.png.webp 270w" data-lazy-sizes="(max-width: 957px) 100vw, 957px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key.png.webp" /><noscript><img decoding="async" width="957" height="444" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key.png.webp" alt="Profile Builder license registration page" class="wp-image-3420066" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key.png.webp 957w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-300x139.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-768x356.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-550x255.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-642x298.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-668x310.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-440x204.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-618x287.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-485x225.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/register-key-270x125.png.webp 270w" sizes="(max-width: 957px) 100vw, 957px" /></noscript></figure></div> <p>Find your license key in the email you were sent to confirm your purchase, or by logging in to<a href="https://www.cozmoslabs.com/account/?utm_source=blog&utm_content=woocommerce-registration-form" target="_blank" rel="noopener noreferrer"> your account</a>. Paste that into the <b>License key</b> field and click the <strong>Activate License</strong> button.</p> <p>Now, navigate to <b>Profile Builder → Add-Ons </b>and look for the <strong>WooCommerce Sync </strong>option. Note that this add-on will only show up if you have at least a <em>Basic </em>Profile Builder Pro license and WooCommerce active on your site:</p> <div class="wp-block-image"> <figure class="aligncenter size-full"><img decoding="async" width="957" height="546" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20957%20546'%3E%3C/svg%3E" alt="The WooCommerce Sync add-on for Profile Builder Pro" class="wp-image-3420070" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons.png.webp 957w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-300x171.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-768x438.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-550x314.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-642x366.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-668x381.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-440x251.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-618x353.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-485x277.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-270x154.png.webp 270w" data-lazy-sizes="(max-width: 957px) 100vw, 957px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons.png.webp" /><noscript><img decoding="async" width="957" height="546" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons.png.webp" alt="The WooCommerce Sync add-on for Profile Builder Pro" class="wp-image-3420070" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons.png.webp 957w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-300x171.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-768x438.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-550x314.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-642x366.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-668x381.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-440x251.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-618x353.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-485x277.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/basic-add-ons-270x154.png.webp 270w" sizes="(max-width: 957px) 100vw, 957px" /></noscript></figure></div> <p>Click on <strong>Activate </strong>under <strong>WooCommerce Sync </strong>and you’re ready to start customizing your WooCommerce registration pages!</p> <h2 class="wp-block-heading"><span id="Configuring_Profile_Builder_Pro_to_Create_Custom_WooCommerce_Registration_Forms">Configuring Profile Builder Pro to Create Custom WooCommerce Registration Forms</span></h2> <p>WooCommerce has two types of forms you can customize using Profile Builder Pro:</p> <ul> <li>Registration forms</li> <li>User profile edit forms</li> </ul> <p>Before you can add those forms to your pages in WooCommerce, you’ll need to configure the plugin to create them.</p> <p>In the WordPress admin dashboard, go to <b>Profile Builder → Add-Ons</b>. Locate the <b>Multiple Registration Forms</b> and <b>Multiple Edit-Profile Forms</b> add-ons and click <strong>Activate</strong> for both of them. These add-ons are only available with Profile Builder Pro <em>Agency </em>and <em>Pro </em>licenses:</p> <div class="wp-block-image border"> <figure class="aligncenter"><img decoding="async" width="1024" height="666" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201024%20666'%3E%3C/svg%3E" alt="Profile Builder Pro Add-ons Page" class="wp-image-2192833" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-1024x666.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-300x195.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-768x500.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-550x358.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-642x418.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-593x386.png.webp 593w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-430x280.png.webp 430w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-618x402.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-466x303.png.webp 466w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-270x176.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page.png.webp 1237w" data-lazy-sizes="(max-width: 1024px) 100vw, 1024px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-1024x666.png.webp" /><noscript><img decoding="async" width="1024" height="666" src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-1024x666.png.webp" alt="Profile Builder Pro Add-ons Page" class="wp-image-2192833" srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-1024x666.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-300x195.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-768x500.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-550x358.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-642x418.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-593x386.png.webp 593w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-430x280.png.webp 430w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-618x402.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-466x303.png.webp 466w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page-270x176.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-Pro-Add-ons-Page.png.webp 1237w" sizes="(max-width: 1024px) 100vw, 1024px" /></noscript></figure></div> <p>Click the <b>Save Changes</b> button. You’ll see that more options are added to the <b>Profile Builder</b> admin menu, which you can use to create your custom forms.</p> <h2 class="wp-block-heading"><span id="Creating_Registration_and_Profile_Forms_with_Profile_Builder">Creating Registration and Profile Forms with Profile Builder</span></h2> <p>The next step is to create the two forms we’ll be adding to the WooCommerce pages. Start with the user registration form.</p> <p>Now, as we’ve shown you before, the default WooCommerce registration form looks like this:</p> <div class="wp-block-image border"> <figure class="aligncenter"><img width="1200" height="750" decoding="async" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201200%20750'%3E%3C/svg%3E" alt="default WooCommerce registration form" class="wp-image-190435" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/default-WooCommerce-registration-form-1.jpg.webp" /><noscript><img width="1200" height="750" decoding="async" src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/default-WooCommerce-registration-form-1.jpg.webp" alt="default WooCommerce registration form" class="wp-image-190435" /></noscript></figure></div> <p>It’s pretty sparse, with only an email field and a registration button. It gets the job done, but it’s a missed opportunity to collect more valuable user information.</p> <p>There is a case for keeping any form on your WordPress site as lean as possible. This is especially true for ecommerce stores that require a user profile to make a purchase. In fact, a long or complicated checkout process is one of the <a href="https://www.statista.com/statistics/1228452/reasons-for-abandonments-during-checkout-united-states/" target="_blank">top reasons for cart abandonment</a> in the United States.</p> <p>So, you won’t want to ask too much of your customers. That said, with an ecommerce site, you arguably need more information about customers, such as their billing and shipping addresses, interests, and other important data points.</p> <p>With that in mind, let’s create a form that includes four fields:</p> <ul> <li> Name</li> <li> Email address</li> <li> Interests (from a selection)</li> <li> reCAPTCHA</li> </ul> <p>You’ll create a form with these options and then tell Profile Builder Pro to display it on the WooCommerce registration page.</p> <h3 class="wp-block-heading"><span id="Creating_a_New_Registration_Form">Creating a New Registration Form</span></h3> <p>To create a new form, open up the WordPress admin and go to <b>Profile Builder Pro → Registration Forms → Add New</b>:</p> <div class="wp-block-image"> <figure class="aligncenter"><img decoding="async" width="1024" height="577" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201024%20577'%3E%3C/svg%3E" alt="Add new registration form" class="wp-image-2192856" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-1024x577.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-300x169.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-768x432.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-1536x865.png.webp 1536w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-550x310.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-642x362.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-668x376.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-440x248.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-618x348.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-485x273.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-270x152.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form.png.webp 1696w" data-lazy-sizes="(max-width: 1024px) 100vw, 1024px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-1024x577.png.webp" /><noscript><img decoding="async" width="1024" height="577" src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-1024x577.png.webp" alt="Add new registration form" class="wp-image-2192856" srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-1024x577.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-300x169.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-768x432.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-1536x865.png.webp 1536w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-550x310.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-642x362.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-668x376.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-440x248.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-618x348.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-485x273.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form-270x152.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Registration-form.png.webp 1696w" sizes="(max-width: 1024px) 100vw, 1024px" /></noscript></figure></div> <p>Give it a name and then select the user role a person will have after completing it. <b>Customer</b> is a good choice. Next, select whether you want the user to be automatically logged in or not and whether you want to redirect them to a special page. If you do, you’ll need to create a thank you page – or you could redirect them to the <em>My Account</em> page. You’ll learn how to do this in more detail shortly.</p> <p>By default, the form will include the list of fields that you can see here below. This is a lot of fields, so if you want to remove any, you can do so by clicking the <b>Delete</b> link next to each option:</p> <div class="wp-block-image"> <figure class="aligncenter size-full"><img decoding="async" width="1007" height="999" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201007%20999'%3E%3C/svg%3E" alt="Customizing a WooCommerce registration form" class="wp-image-3420087" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form.png.webp 1007w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-300x298.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-150x150.png.webp 150w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-768x762.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-534x530.png.webp 534w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-466x462.png.webp 466w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-550x546.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-389x386.png.webp 389w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-282x280.png.webp 282w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-618x613.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-305x303.png.webp 305w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-240x238.png.webp 240w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-128x128.png.webp 128w" data-lazy-sizes="(max-width: 1007px) 100vw, 1007px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form.png.webp" /><noscript><img decoding="async" width="1007" height="999" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form.png.webp" alt="Customizing a WooCommerce registration form" class="wp-image-3420087" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form.png.webp 1007w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-300x298.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-150x150.png.webp 150w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-768x762.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-534x530.png.webp 534w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-466x462.png.webp 466w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-550x546.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-389x386.png.webp 389w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-282x280.png.webp 282w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-618x613.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-305x303.png.webp 305w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-240x238.png.webp 240w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/customize-registration-form-128x128.png.webp 128w" sizes="(max-width: 1007px) 100vw, 1007px" /></noscript></figure></div> <p>As we’re creating a very simple form here with just a few fields, go ahead and delete every field <b>except</b> for these:</p> <ul> <li><strong>Username (Default – Username)</strong> (you can’t delete this one as it’s essential to create a user account)</li> <li> <strong>First Name (Default – First Name)</strong></li> <li><strong> Last Name (Default – Last Name)</strong></li> <li><strong> E-mail (Default – Email)</strong></li> <li><strong> Password (Default – Password)</strong> (you can’t delete this either)</li> <li> <strong>Repeat Password (Default – Repeat Password)</strong></li> </ul> <p>The remaining fields for the registration form should look like this:</p> <div class="wp-block-image"> <figure class="aligncenter size-full"><img decoding="async" width="1002" height="800" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201002%20800'%3E%3C/svg%3E" alt="A WordPress registration form with custom fields" class="wp-image-3420096" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form.png.webp 1002w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-300x240.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-768x613.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-550x439.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-579x462.png.webp 579w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-483x386.png.webp 483w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-351x280.png.webp 351w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-618x493.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-380x303.png.webp 380w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-270x216.png.webp 270w" data-lazy-sizes="(max-width: 1002px) 100vw, 1002px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form.png.webp" /><noscript><img decoding="async" width="1002" height="800" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form.png.webp" alt="A WordPress registration form with custom fields" class="wp-image-3420096" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form.png.webp 1002w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-300x240.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-768x613.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-550x439.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-579x462.png.webp 579w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-483x386.png.webp 483w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-351x280.png.webp 351w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-618x493.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-380x303.png.webp 380w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-registration-form-270x216.png.webp 270w" sizes="(max-width: 1002px) 100vw, 1002px" /></noscript></figure></div> <p>Now, hit the <b>Publish</b> button at the top right to save your changes and to set the form to live.</p> <h4 class="wp-block-heading"><span id="Creating_New_Fields_Select_Box_and_reCAPTCHA">Creating New Fields: Select Box and reCAPTCHA</span></h4> <p>At this point, we’re missing a couple of the custom fields we mentioned earlier. We still want to add an <em>Interests </em>field to learn more about potential customers, and a reCAPTCHA to deter spammers. We can do both using the form field manager in Profile Builder Pro.</p> <p>Go to <b>Profile Builder → Form Fields</b>. Here, you’ll find a list of the available fields for use in custom forms. Profile Builder Pro also includes additional fields you can enable, such as an option for a CAPTCHA:</p> <div class="wp-block-image"> <figure class="aligncenter"><img decoding="async" width="1024" height="589" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201024%20589'%3E%3C/svg%3E" alt="form fields screen" class="wp-image-2192889" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-1024x589.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-300x173.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-768x442.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-550x316.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-642x369.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-668x384.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-440x253.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-618x356.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-485x279.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-270x155.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen.png.webp 1406w" data-lazy-sizes="(max-width: 1024px) 100vw, 1024px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-1024x589.png.webp" /><noscript><img decoding="async" width="1024" height="589" src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-1024x589.png.webp" alt="form fields screen" class="wp-image-2192889" srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-1024x589.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-300x173.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-768x442.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-550x316.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-642x369.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-668x384.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-440x253.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-618x356.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-485x279.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen-270x155.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/form-fields-screen.png.webp 1406w" sizes="(max-width: 1024px) 100vw, 1024px" /></noscript></figure></div> <p>First, let’s take care of the <em>Interests </em>field. Click the <b>Select an option</b> field at the top, then choose the <strong>Select (Multiple)</strong> option. The screen will change to show the settings for a multiple select box:</p> <div class="wp-block-image"> <figure class="aligncenter"><img decoding="async" width="898" height="1024" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20898%201024'%3E%3C/svg%3E" alt="Creating the select box field" class="wp-image-2192915" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-898x1024.png.webp 898w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-263x300.png.webp 263w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-768x875.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-1347x1536.png.webp 1347w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-465x530.png.webp 465w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-405x462.png.webp 405w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-550x627.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-339x386.png.webp 339w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-246x280.png.webp 246w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-618x704.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-266x303.png.webp 266w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-209x238.png.webp 209w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field.png.webp 1672w" data-lazy-sizes="(max-width: 898px) 100vw, 898px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-898x1024.png.webp" /><noscript><img decoding="async" width="898" height="1024" src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-898x1024.png.webp" alt="Creating the select box field" class="wp-image-2192915" srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-898x1024.png.webp 898w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-263x300.png.webp 263w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-768x875.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-1347x1536.png.webp 1347w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-465x530.png.webp 465w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-405x462.png.webp 405w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-550x627.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-339x386.png.webp 339w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-246x280.png.webp 246w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-618x704.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-266x303.png.webp 266w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field-209x238.png.webp 209w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Creating-the-select-box-field.png.webp 1672w" sizes="(max-width: 898px) 100vw, 898px" /></noscript></figure></div> <p>Give the new field a title and fill out other options as follows:</p> <ul> <li><strong>Meta-name:</strong> This is for internal identification purposes only. We set the field to <em>Interests </em>to keep track of what its purpose is.</li> <li><strong>Description:</strong> Type in a description such as <em>Select the products you’d like to know more about</em>.</li> <li><strong>Options:</strong> Type in the options for your store, separated by commas. For example, in a clothing store, you might type <em>clothes, shoes, accessories</em>.</li> <li><strong>Labels:</strong> These are the labels for the options the user will see, again separated by commas. So the above would be <em>Women’s clothing, Shoes, Accessories</em>.</li> <li><strong>Default option:</strong> Type in one of your options which will be checked by default, if you want.</li> <li><strong>Required:</strong> Select whether this field is required or not.</li> <li><strong>Overwrite existing:</strong> Select <em>No</em>.</li> <li><strong>Display on WooCommerce Checkout:</strong> Select <em>Yes </em>if you want to collect this data from customers when they check out.</li> </ul> <p>Click the <b>Add Field</b> button to save it.</p> <p>Now let’s create the reCaptcha field. Still on the same screen, click the <b>Select an option</b> field and type <strong>reCAPTCHA</strong>. The corresponding option will appear in the drop-down menu:</p> <div class="wp-block-image"> <figure class="aligncenter size-full"><img decoding="async" width="1025" height="610" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201025%20610'%3E%3C/svg%3E" alt="Adding a CAPTCHA using Profile Builder Pro" class="wp-image-3420112" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha.png.webp 1025w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-300x179.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-768x457.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-550x327.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-642x382.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-649x386.png.webp 649w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-440x262.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-618x368.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-485x289.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-270x161.png.webp 270w" data-lazy-sizes="(max-width: 1025px) 100vw, 1025px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha.png.webp" /><noscript><img decoding="async" width="1025" height="610" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha.png.webp" alt="Adding a CAPTCHA using Profile Builder Pro" class="wp-image-3420112" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha.png.webp 1025w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-300x179.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-768x457.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-550x327.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-642x382.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-649x386.png.webp 649w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-440x262.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-618x368.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-485x289.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-captcha-270x161.png.webp 270w" sizes="(max-width: 1025px) 100vw, 1025px" /></noscript></figure></div> <p>Give it a name and then, in the <b>ReCAPTCHA Type</b> drop-down, choose whether you want to use reCAPTCHA type 2 or invisible reCAPTCHA: </p> <div class="wp-block-image border"> <figure class="aligncenter size-full"><img decoding="async" width="1016" height="681" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201016%20681'%3E%3C/svg%3E" alt="Configuring a CAPTCHA using Profile Builder Pro" class="wp-image-3420114" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha.png.webp 1016w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-300x201.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-768x515.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-550x369.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-642x430.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-576x386.png.webp 576w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-418x280.png.webp 418w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-618x414.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-452x303.png.webp 452w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-270x181.png.webp 270w" data-lazy-sizes="(max-width: 1016px) 100vw, 1016px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha.png.webp" /><noscript><img decoding="async" width="1016" height="681" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha.png.webp" alt="Configuring a CAPTCHA using Profile Builder Pro" class="wp-image-3420114" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha.png.webp 1016w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-300x201.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-768x515.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-550x369.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-642x430.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-576x386.png.webp 576w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-418x280.png.webp 418w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-618x414.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-452x303.png.webp 452w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-captcha-270x181.png.webp 270w" sizes="(max-width: 1016px) 100vw, 1016px" /></noscript></figure></div> <p>The invisible version is less intrusive for visitors, but version 2 might give them some peace of mind. The choice is up to you.</p> <p>Next, click the link under the <b>Site Key</b> field to be taken to the Google reCAPTCHA settings where you will need to set up a key for using reCAPTCHA:</p> <div class="wp-block-image border"> <figure class="aligncenter size-full"><img decoding="async" width="1013" height="245" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201013%20245'%3E%3C/svg%3E" alt="Adding the site and secret keys you need to integrate CAPTCHA" class="wp-image-3420118" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys.png.webp 1013w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-300x73.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-768x186.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-550x133.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-642x155.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-668x162.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-440x106.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-618x149.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-485x117.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-270x65.png.webp 270w" data-lazy-sizes="(max-width: 1013px) 100vw, 1013px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys.png.webp" /><noscript><img decoding="async" width="1013" height="245" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys.png.webp" alt="Adding the site and secret keys you need to integrate CAPTCHA" class="wp-image-3420118" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys.png.webp 1013w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-300x73.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-768x186.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-550x133.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-642x155.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-668x162.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-440x106.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-618x149.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-485x117.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/captcha-keys-270x65.png.webp 270w" sizes="(max-width: 1013px) 100vw, 1013px" /></noscript></figure></div> <p>You should be taken to the Google reCAPTCHA submission form:</p> <div class="wp-block-image border"> <figure class="aligncenter"><img width="1200" height="818" decoding="async" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201200%20818'%3E%3C/svg%3E" alt="creating a reCAPTCHA key" class="wp-image-190435" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/creating-a-reCAPTCHA-key.jpg.webp" /><noscript><img width="1200" height="818" decoding="async" src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/creating-a-reCAPTCHA-key.jpg.webp" alt="creating a reCAPTCHA key" class="wp-image-190435" /></noscript></figure></div> <p>If you don’t see this, you may need to set up a Google account – see the<a href="https://www.cozmoslabs.com/docs/profile-builder-2/manage-user-fields/recaptcha-field/?utm_source=blog&utm_content=woocommerce-registration-form" target="_blank" rel="noopener noreferrer"> documentation on reCAPTCHA fields</a> or <a href="https://www.cozmoslabs.com/382102-add-recaptcha-to-wordpress/">this complete reCAPTCHA guide</a> for more information.</p> <p>Complete the form to create your key and click the <b>Submit</b> button.</p> <p>You’ll be taken to a screen with two keys: your site key and your secret key. Copy them into the relevant fields back in the screen for creating your field with the plugin and click the <b>Add Field</b> button.</p> <h4 class="wp-block-heading"><span id="Adding_Your_New_Fields_to_the_Form">Adding Your New Fields to the Form</span></h4> <p>Now go back to your registration form in WordPress. Go to <b>Profile Builder → Registration Forms</b> and select your new custom form.</p> <p>In the <b>Add New Field to the List</b> section, click on the <b>Field</b> dropdown box and select the <em>Interests</em> field (or whatever you called your new field). Click the <b>Add Field</b> button:</p> <div class="wp-block-image"> <figure class="aligncenter size-full"><img decoding="async" width="1009" height="302" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201009%20302'%3E%3C/svg%3E" alt="Adding a custom field to a registration form" class="wp-image-3420135" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form.png.webp 1009w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-300x90.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-768x230.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-550x165.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-642x192.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-668x200.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-440x132.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-618x185.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-485x145.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-270x81.png.webp 270w" data-lazy-sizes="(max-width: 1009px) 100vw, 1009px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form.png.webp" /><noscript><img decoding="async" width="1009" height="302" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form.png.webp" alt="Adding a custom field to a registration form" class="wp-image-3420135" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form.png.webp 1009w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-300x90.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-768x230.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-550x165.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-642x192.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-668x200.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-440x132.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-618x185.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-485x145.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/add-new-field-form-270x81.png.webp 270w" sizes="(max-width: 1009px) 100vw, 1009px" /></noscript></figure></div> <p>It will now be added to your form. Don’t forget to click the <b>Update</b> button to save the changes you’ve made. Repeat that for the reCAPTCHA field, putting that field at the end of your form:</p> <div class="wp-block-image"> <figure class="aligncenter size-full"><img decoding="async" width="1010" height="939" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201010%20939'%3E%3C/svg%3E" alt="Customizing the order of the fields for a registration form " class="wp-image-3420132" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form.png.webp 1010w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-300x279.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-768x714.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-550x511.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-497x462.png.webp 497w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-415x386.png.webp 415w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-301x280.png.webp 301w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-618x575.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-326x303.png.webp 326w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-256x238.png.webp 256w" data-lazy-sizes="(max-width: 1010px) 100vw, 1010px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form.png.webp" /><noscript><img decoding="async" width="1010" height="939" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form.png.webp" alt="Customizing the order of the fields for a registration form " class="wp-image-3420132" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form.png.webp 1010w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-300x279.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-768x714.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-550x511.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-497x462.png.webp 497w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-415x386.png.webp 415w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-301x280.png.webp 301w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-618x575.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-326x303.png.webp 326w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/adding-fields-registration-form-256x238.png.webp 256w" sizes="(max-width: 1010px) 100vw, 1010px" /></noscript></figure></div> <p>Note the field editor includes drag-and-drop functionality. You can click on any field in the list at the bottom and modify its position by dragging it up or down. When you’re ready, save the changes to the custom form.</p> <h4 class="wp-block-heading"><span id="Adding_a_Redirect_to_the_Form">Adding a Redirect to the Form</span></h4> <p>After people have registered for the site, you may want to redirect them to a <em>Thank you</em> page. You can opt for a simple message or encourage users to visit other products or pages on your site.</p> <p>Start by creating your thank you page. Go to <b>Pages → Add New</b>. Create your new page and publish it:</p> <div class="wp-block-image border"> <figure class="aligncenter"><img decoding="async" width="1024" height="303" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201024%20303'%3E%3C/svg%3E" alt="thank you page" class="wp-image-2193225" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-1024x303.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-300x89.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-768x227.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-1536x454.png.webp 1536w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-550x163.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-642x190.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-668x198.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-440x130.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-618x183.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-485x143.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-270x80.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page.png.webp 1596w" data-lazy-sizes="(max-width: 1024px) 100vw, 1024px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-1024x303.png.webp" /><noscript><img decoding="async" width="1024" height="303" src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-1024x303.png.webp" alt="thank you page" class="wp-image-2193225" srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-1024x303.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-300x89.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-768x227.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-1536x454.png.webp 1536w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-550x163.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-642x190.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-668x198.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-440x130.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-618x183.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-485x143.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-270x80.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page.png.webp 1596w" sizes="(max-width: 1024px) 100vw, 1024px" /></noscript></figure></div> <p>Make a note of the page’s URL – you’ll need that later. Now go to <b>Profile Builder → Registration Forms</b> and click on your form. In the <b>Redirect</b> dropdown box, select <b>Yes</b>. A <b>URL</b> field will appear. Copy the URL of your new page into it:</p> <div class="wp-block-image"> <figure class="aligncenter"><img decoding="async" width="974" height="965" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20974%20965'%3E%3C/svg%3E" alt="redirect setup" class="wp-image-2192956" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup.png.webp 974w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-300x297.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-150x150.png.webp 150w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-768x761.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-535x530.png.webp 535w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-466x462.png.webp 466w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-550x545.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-390x386.png.webp 390w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-283x280.png.webp 283w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-618x612.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-306x303.png.webp 306w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-240x238.png.webp 240w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-128x128.png.webp 128w" data-lazy-sizes="(max-width: 974px) 100vw, 974px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup.png.webp" /><noscript><img decoding="async" width="974" height="965" src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup.png.webp" alt="redirect setup" class="wp-image-2192956" srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup.png.webp 974w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-300x297.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-150x150.png.webp 150w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-768x761.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-535x530.png.webp 535w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-466x462.png.webp 466w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-550x545.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-390x386.png.webp 390w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-283x280.png.webp 283w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-618x612.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-306x303.png.webp 306w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-240x238.png.webp 240w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/redirect-setup-128x128.png.webp 128w" sizes="(max-width: 974px) 100vw, 974px" /></noscript></figure></div> <p>Finally, click the <b>Update</b> button to save your changes. Now it’s time to create another form – the edit profile form.</p> <h3 class="wp-block-heading"><span id="Creating_a_New_Edit_Profile_Form">Creating a New Edit Profile Form</span></h3> <p>You can also edit the form that your users access to edit their WooCommerce user account. Go to <b>Profile Builder → Edit-profile Forms</b>. Click the <b>Add New</b> button.</p> <p>You’ll see a very similar screen to the one you used to create the custom WooCommerce user registration form.</p> <h4 class="wp-block-heading"><span id="Creating_the_Form">Creating the Form</span></h4> <p>The default edit profile form in WooCommerce has just a few fields again: name, display name, password, and email address:</p> <div class="wp-block-image border"> <figure class="aligncenter"><img width="1177" height="1200" decoding="async" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201177%201200'%3E%3C/svg%3E" alt="Default WooCommerce edit profile form" class="wp-image-190435" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/default-WooCommerce-edit-profile-form-1.jpg.webp" /><noscript><img width="1177" height="1200" decoding="async" src="https://www.cozmoslabs.com/wp-content/uploads/2020/03/default-WooCommerce-edit-profile-form-1.jpg.webp" alt="Default WooCommerce edit profile form" class="wp-image-190435" /></noscript></figure></div> <p>Let’s create a new form with some extra profile fields. This form is going to include:</p> <ul> <li> Name</li> <li> Username</li> <li> Email address</li> <li> Avatar</li> <li> Interests</li> <li> Password</li> <li> Phone number</li> <li> Billing Address</li> <li> Shipping Address</li> </ul> <p>So, go to <strong>Profile Builder → Edit-profile Forms</strong> and click the <strong>Add New</strong> button. Name your new form and delete the fields you don’t intend on using. We’ve also gone ahead and added some of the fields mentioned above, which you can see in the example below:</p> <div class="wp-block-image"> <figure class="aligncenter size-full"><img decoding="async" width="1007" height="1009" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201007%201009'%3E%3C/svg%3E" alt="Customizing the fields in a form to edit a profile" class="wp-image-3420167" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit.png.webp 1007w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-300x300.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-150x150.png.webp 150w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-768x770.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-529x530.png.webp 529w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-461x462.png.webp 461w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-550x551.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-385x386.png.webp 385w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-279x280.png.webp 279w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-618x619.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-302x303.png.webp 302w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-580x580.png.webp 580w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-271x271.png.webp 271w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-238x238.png.webp 238w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-128x128.png.webp 128w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-256x256.png.webp 256w" data-lazy-sizes="(max-width: 1007px) 100vw, 1007px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit.png.webp" /><noscript><img decoding="async" width="1007" height="1009" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit.png.webp" alt="Customizing the fields in a form to edit a profile" class="wp-image-3420167" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit.png.webp 1007w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-300x300.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-150x150.png.webp 150w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-768x770.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-529x530.png.webp 529w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-461x462.png.webp 461w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-550x551.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-385x386.png.webp 385w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-279x280.png.webp 279w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-618x619.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-302x303.png.webp 302w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-580x580.png.webp 580w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-271x271.png.webp 271w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-238x238.png.webp 238w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-128x128.png.webp 128w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-256x256.png.webp 256w" sizes="(max-width: 1007px) 100vw, 1007px" /></noscript></figure></div> <p>Most of these fields already exist in the Profile Builder Pro library, so all you have to do is select them from the <strong>Field </strong>drop-down menu and add them. The only field we need to set up from scratch is an option for including a phone number.</p> <h4 class="wp-block-heading"><span id="Creating_a_New_Field_for_Adding_a_Phone_Number">Creating a New Field for Adding a Phone Number</span></h4> <p>Now let’s add the phone number field. We’ll use this to keep a phone on file in case there are problems with customer orders or you need to reach them under other extraordinary circumstances.</p> <p>Go to <strong>Profile Builder → Form Fields</strong> and click the <b>Select an option</b> field. Select the <strong>Phone</strong> option and fill out the details for this field, giving it a name and ID. Add a description and choose whether to make it optional by configuring the <strong>Required </strong>field (if you select <strong>Yes</strong>, users will need to add a phone number to complete the registration):</p> <div class="wp-block-image"> <figure class="aligncenter size-full"><img decoding="async" width="1004" height="953" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201004%20953'%3E%3C/svg%3E" alt="Creating a field for adding a phone number" class="wp-image-3420187" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field.png.webp 1004w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-300x285.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-768x729.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-550x522.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-487x462.png.webp 487w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-407x386.png.webp 407w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-295x280.png.webp 295w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-618x587.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-319x303.png.webp 319w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-251x238.png.webp 251w" data-lazy-sizes="(max-width: 1004px) 100vw, 1004px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field.png.webp" /><noscript><img decoding="async" width="1004" height="953" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field.png.webp" alt="Creating a field for adding a phone number" class="wp-image-3420187" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field.png.webp 1004w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-300x285.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-768x729.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-550x522.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-487x462.png.webp 487w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-407x386.png.webp 407w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-295x280.png.webp 295w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-618x587.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-319x303.png.webp 319w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/configure-phone-field-251x238.png.webp 251w" sizes="(max-width: 1004px) 100vw, 1004px" /></noscript></figure></div> <p>Click the <b>Add Field</b> button to add it to the available fields. Now let’s move on to talking about conditional logic or how to show different form options depending on who’s seeing the page.</p> <h4 class="wp-block-heading"><span id="Adding_Conditional_Logic_to_Fields">Adding Conditional Logic to Fields</span></h4> <p>When you added the phone number field, you may have noticed that it includes formatting for USA-specific phone numers. But what if your customer is outside the USA?</p> <p>You have two options for how to tackle this problem, both of which use conditional logic:</p> <ul> <li>Create a second phone number field, which will only be displayed to customers outside the USA while the existing field is only displayed to customers in the USA.</li> <li>Add conditional logic to the existing phone number field so it’s only shown to customers inside the USA.</li> </ul> <p>If your business is in the USA and you won’t be able to call customers elsewhere in the world without significant costs, there isn’t much point in collecting that information. So we’re going to show you how to implement the second option, which is to only show the phone number field to customers in a specific country.</p> <p>In the <strong>Manage Form Fields</strong> screen, click the <b>Edit</b> button next to your new phone number field.</p> <p>Just above the <b>Save Changes</b> button, check the <b>Enable conditional logic</b> checkbox. In the <strong>Choose…</strong> field, select <strong>Location</strong>, then <strong>is</strong>, and type in <em>United States</em>:</p> <div class="wp-block-image"> <figure class="aligncenter size-full"><img decoding="async" width="1015" height="318" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201015%20318'%3E%3C/svg%3E" alt="Configuring a form to use conditional logic" class="wp-image-3420200" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic.png.webp 1015w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-300x94.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-768x241.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-550x172.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-642x201.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-668x209.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-440x138.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-618x194.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-485x152.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-270x85.png.webp 270w" data-lazy-sizes="(max-width: 1015px) 100vw, 1015px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic.png.webp" /><noscript><img decoding="async" width="1015" height="318" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic.png.webp" alt="Configuring a form to use conditional logic" class="wp-image-3420200" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic.png.webp 1015w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-300x94.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-768x241.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-550x172.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-642x201.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-668x209.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-440x138.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-618x194.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-485x152.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/conditionla-logic-270x85.png.webp 270w" sizes="(max-width: 1015px) 100vw, 1015px" /></noscript></figure></div> <p>Click the <b>Save Changes</b> button. The field for phone numbers will now only be displayed to people who selected the United States as their country.</p> <p>Now you can add this new field to the custom profile edit form. We show you how to do this in the previous section, so check it out if you’re having problems finding the corresponding options. Here’s an example of the custom profile edit form with these new fields:</p> <div class="wp-block-image border"> <figure class="aligncenter size-large"><img decoding="async" width="845" height="1024" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20845%201024'%3E%3C/svg%3E" alt="A custom profile edit form in WordPress" class="wp-image-3420207" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-845x1024.png.webp 845w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-247x300.png.webp 247w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-768x931.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-437x530.png.webp 437w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-381x462.png.webp 381w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-550x667.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-318x386.png.webp 318w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-231x280.png.webp 231w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-618x749.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-250x303.png.webp 250w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-196x238.png.webp 196w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields.png.webp 998w" data-lazy-sizes="(max-width: 845px) 100vw, 845px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-845x1024.png.webp" /><noscript><img decoding="async" width="845" height="1024" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-845x1024.png.webp" alt="A custom profile edit form in WordPress" class="wp-image-3420207" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-845x1024.png.webp 845w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-247x300.png.webp 247w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-768x931.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-437x530.png.webp 437w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-381x462.png.webp 381w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-550x667.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-318x386.png.webp 318w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-231x280.png.webp 231w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-618x749.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-250x303.png.webp 250w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields-196x238.png.webp 196w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/custom-profile-edit-new-fields.png.webp 998w" sizes="(max-width: 845px) 100vw, 845px" /></noscript></figure></div> <p>Remember you can re-arrange the fields in any custom Profile Builder Pro form by using the drag-and-drop functionality in form editor. When you’re happy with how the form looks, click on the <strong>Update </strong>button.</p> <h2 class="wp-block-heading"><span id="Adding_Your_Forms_to_the_WooCommerce_Screens">Adding Your Forms to the WooCommerce Screens</span></h2> <p>You now have your forms set up but they aren’t showing up on your site yet. That’s because you need to tell Profile Builder Pro which forms to use on which WooCommerce pages on the front-end of your site.</p> <p>Go to <b>Profile Builder → Add-Ons</b> and activate the<b> WooCommerce Sync Add-on</b>. Next, navigate to the newly added menu item, like so: <b>Profile Builder → WooCommerce Sync</b>.</p> <div class="wp-block-image"> <figure class="aligncenter"><img decoding="async" width="1024" height="601" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201024%20601'%3E%3C/svg%3E" alt="Profile Builder WooCommerce sync screen" class="wp-image-2193081" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-1024x601.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-300x176.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-768x451.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-550x323.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-642x377.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-657x386.png.webp 657w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-440x258.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-618x363.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-485x285.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-270x159.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen.png.webp 1265w" data-lazy-sizes="(max-width: 1024px) 100vw, 1024px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-1024x601.png.webp" /><noscript><img decoding="async" width="1024" height="601" src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-1024x601.png.webp" alt="Profile Builder WooCommerce sync screen" class="wp-image-2193081" srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-1024x601.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-300x176.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-768x451.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-550x323.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-642x377.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-657x386.png.webp 657w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-440x258.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-618x363.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-485x285.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen-270x159.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Profile-Builder-WooCommerce-sync-screen.png.webp 1265w" sizes="(max-width: 1024px) 100vw, 1024px" /></noscript></figure></div> <p>In the <b>Choose Register form to display on My Account page</b> dropdown box, select your newly created custom registration form.</p> <p>In the <b>Choose Edit Profile form to display on My Account page</b> dropdown box, select your newly created custom edit profile form.</p> <p>Click on the <b>Save Changes</b> button. Your forms will now display on the relevant WooCommerce pages.</p> <p>On your live site, go to the <a href="https://www.cozmoslabs.com/33671-manage-woocommerce-customer-fields-profile-builder/">WooCommerce My Account page</a>. When you aren’t logged in, you’ll see the new custom registration form. When a new user completes the form, they’ll be redirected to your thank you page:</p> <div class="wp-block-image"> <figure class="aligncenter"><img decoding="async" width="1024" height="434" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201024%20434'%3E%3C/svg%3E" alt="thank you page front end" class="wp-image-2193236" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-1024x434.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-300x127.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-768x326.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-550x233.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-642x272.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-668x283.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-440x187.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-618x262.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-485x206.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-270x114.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end.png.webp 1111w" data-lazy-sizes="(max-width: 1024px) 100vw, 1024px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-1024x434.png.webp" /><noscript><img decoding="async" width="1024" height="434" src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-1024x434.png.webp" alt="thank you page front end" class="wp-image-2193236" srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-1024x434.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-300x127.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-768x326.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-550x233.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-642x272.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-668x283.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-440x187.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-618x262.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-485x206.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end-270x114.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/thank-you-page-front-end.png.webp 1111w" sizes="(max-width: 1024px) 100vw, 1024px" /></noscript></figure></div> <p>Now if someone has already registered, when the user logs in and navigates to the My Account page, they’ll be able to access their custom profile page.</p> <p>You now have two new forms, with fields that will be more useful for you and your customers than the default forms. Well done!</p> <h2 class="wp-block-heading"><span id="Customizing_Other_Parts_of_the_WooCommerce_Registration_Process">Customizing Other Parts of the WooCommerce Registration Process</span></h2> <p>So far, we’ve given you a detailed look at how you can customize the registration and edit profile forms that appear on the <em>My Account</em> page of your WooCommerce store. Beyond that, Profile Builder Pro can also help you customize other aspects of the WooCommerce registration process. Let’s go through them.</p> <h3 class="wp-block-heading"><span id="Adding_Fields_to_the_Registration_Form_at_WooCommerce_Checkout">Adding Fields to the Registration Form at WooCommerce Checkout</span></h3> <p>If you enable public registration, WooCommerce includes a feature that lets you give anonymous guests an option to create an account on the <a href="https://www.cozmoslabs.com/2152447-woocommerce-checkout-not-working/">checkout page</a>. You can enable this feature by going to <strong>WooCommerce → Settings → Accounts & Privacy → Account creation</strong>:</p> <div class="wp-block-image"> <figure class="aligncenter size-large"><img decoding="async" width="1024" height="233" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201024%20233'%3E%3C/svg%3E" alt="The account creation settings in WooCommerce" class="wp-image-3420217" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-1024x233.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-300x68.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-768x174.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-550x125.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-642x146.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-668x152.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-440x100.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-618x140.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-485x110.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-270x61.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings.png.webp 1030w" data-lazy-sizes="(max-width: 1024px) 100vw, 1024px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-1024x233.png.webp" /><noscript><img decoding="async" width="1024" height="233" src="https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-1024x233.png.webp" alt="The account creation settings in WooCommerce" class="wp-image-3420217" srcset="https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-1024x233.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-300x68.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-768x174.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-550x125.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-642x146.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-668x152.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-440x100.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-618x140.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-485x110.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings-270x61.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2024/06/account-creation-settings.png.webp 1030w" sizes="(max-width: 1024px) 100vw, 1024px" /></noscript></figure></div> <p>The default checkout registration form will look something like this if you choose to enable the <strong>Allow customers to create an account during checkout</strong> setting:</p> <div class="wp-block-image"> <figure class="aligncenter"><img decoding="async" width="1250" height="1156" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201250%201156'%3E%3C/svg%3E" alt="WooCommerce register checkout" class="wp-image-351312" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-8.jpg.webp 1250w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-8-300x277.jpg.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-8-1024x947.jpg.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-8-768x710.jpg.webp 768w" data-lazy-sizes="(max-width: 1250px) 100vw, 1250px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-8.jpg.webp" /><noscript><img decoding="async" width="1250" height="1156" src="https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-8.jpg.webp" alt="WooCommerce register checkout" class="wp-image-351312" srcset="https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-8.jpg.webp 1250w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-8-300x277.jpg.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-8-1024x947.jpg.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-8-768x710.jpg.webp 768w" sizes="(max-width: 1250px) 100vw, 1250px" /></noscript></figure></div> <p>With Profile Builder Pro, you also have the option of <a href="https://www.cozmoslabs.com/237382-woocommerce-custom-fields-checkout/">adding custom fields</a> to the form at checkout. This can make the checkout form a bit unwieldy, but it can help you capture more user registrations.</p> <p>To set this up, go back to <strong>Profile Builder → Form Fields</strong>. Then, edit a field that you want to include on the checkout registration form and set the <strong>Display on WooCommerce Checkout</strong> drop-down equal to <strong>Yes</strong>:</p> <div class="wp-block-image"> <figure class="aligncenter"><img decoding="async" width="1024" height="333" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201024%20333'%3E%3C/svg%3E" alt="Show field on WooCommerce checkout" class="wp-image-2193133" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-1024x333.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-300x98.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-768x250.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-1536x500.png.webp 1536w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-550x179.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-642x209.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-668x218.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-440x143.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-618x201.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-485x158.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-270x88.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout.png.webp 1554w" data-lazy-sizes="(max-width: 1024px) 100vw, 1024px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-1024x333.png.webp" /><noscript><img decoding="async" width="1024" height="333" src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-1024x333.png.webp" alt="Show field on WooCommerce checkout" class="wp-image-2193133" srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-1024x333.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-300x98.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-768x250.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-1536x500.png.webp 1536w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-550x179.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-642x209.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-668x218.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-440x143.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-618x201.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-485x158.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout-270x88.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Show-field-on-WooCommerce-checkout.png.webp 1554w" sizes="(max-width: 1024px) 100vw, 1024px" /></noscript></figure></div> <p>To include additional fields on the checkout registration page, repeat the process to enable each field you want users to fill out.</p> <p>When you’re finished, all of the fields that you’ve enabled will appear on the registration form at checkout – here’s an example:</p> <div class="wp-block-image"> <figure class="aligncenter"><img decoding="async" width="1250" height="1144" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201250%201144'%3E%3C/svg%3E" alt="New fields on WooCommerce checkout page for registration" class="wp-image-351315" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-10.jpg.webp 1250w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-10-300x275.jpg.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-10-1024x937.jpg.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-10-768x703.jpg.webp 768w" data-lazy-sizes="(max-width: 1250px) 100vw, 1250px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-10.jpg.webp" /><noscript><img decoding="async" width="1250" height="1144" src="https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-10.jpg.webp" alt="New fields on WooCommerce checkout page for registration" class="wp-image-351315" srcset="https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-10.jpg.webp 1250w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-10-300x275.jpg.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-10-1024x937.jpg.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/woocommerce-register-page-10-768x703.jpg.webp 768w" sizes="(max-width: 1250px) 100vw, 1250px" /></noscript></figure></div> <h3 class="wp-block-heading"><span id="Creating_a_Custom_WooCommerce_Registration_Page">Creating a Custom WooCommerce Registration Page</span></h3> <p>So far, we’ve focused on customizing the default WooCommerce registration forms, either in the <em>My Account</em> area or on the checkout form. Another thing that Profile Builder Pro lets you do is create one or more completely custom registration forms that you can display on any page on your store.</p> <p>For example, you could create a custom registration page at <strong>yourstore.com/register</strong> instead of relying on the default form.</p> <p>You can also create <em>multiple </em>unique registration forms, which is useful if your store has <a href="https://www.cozmoslabs.com/285910-woocommerce-user-roles/">multiple WooCommerce user roles</a>. For example, if you have a wholesale store, you might have one user role for wholesale customers and another for retail customers so that you can <a href="https://www.cozmoslabs.com/290821-woocommerce-role-based-pricing-tutorial/">enable role-based pricing</a>.</p> <p>With Profile Builder Pro, you could create two separate registration forms and automatically assign users to the proper user role based on the form that they use.</p> <p>First off, you can always embed the primary registration form anywhere on your site using the <strong>Register</strong><em> </em>block which lets you create a dedicated page for your registration form:</p> <div class="wp-block-image"> <figure class="aligncenter"><img decoding="async" width="1024" height="219" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201024%20219'%3E%3C/svg%3E" alt="Profile Builder Register block" class="wp-image-2188626" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-1024x219.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-300x64.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-768x165.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-1536x329.png.webp 1536w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-550x118.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-642x138.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-668x143.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-440x94.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-618x132.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-485x104.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-270x58.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block.png.webp 1573w" data-lazy-sizes="(max-width: 1024px) 100vw, 1024px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-1024x219.png.webp" /><noscript><img decoding="async" width="1024" height="219" src="https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-1024x219.png.webp" alt="Profile Builder Register block" class="wp-image-2188626" srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-1024x219.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-300x64.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-768x165.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-1536x329.png.webp 1536w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-550x118.png.webp 550w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-642x138.png.webp 642w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-668x143.png.webp 668w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-440x94.png.webp 440w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-618x132.png.webp 618w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-485x104.png.webp 485w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block-270x58.png.webp 270w,https://www.cozmoslabs.com/wp-content/uploads/2020/05/Profile-Builder-Register-block.png.webp 1573w" sizes="(max-width: 1024px) 100vw, 1024px" /></noscript></figure></div> <p>By “primary” registration form, we mean the form that you previously created and set as your main WooCommerce registration form. You can also specificy which form the block should load by using the <strong>FORM </strong>option under the block settings menu to the right of the screen (which appears while selecting the <strong>Register </strong>block):</p> <div class="wp-block-image"> <figure class="aligncenter"><img decoding="async" width="468" height="689" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20468%20689'%3E%3C/svg%3E" alt="Choosing a custom registration form" class="wp-image-2193186" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form.png.webp 468w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-204x300.png.webp 204w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-360x530.png.webp 360w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-314x462.png.webp 314w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-262x386.png.webp 262w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-190x280.png.webp 190w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-206x303.png.webp 206w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-162x238.png.webp 162w" data-lazy-sizes="(max-width: 468px) 100vw, 468px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form.png.webp" /><noscript><img decoding="async" width="468" height="689" src="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form.png.webp" alt="Choosing a custom registration form" class="wp-image-2193186" srcset="https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form.png.webp 468w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-204x300.png.webp 204w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-360x530.png.webp 360w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-314x462.png.webp 314w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-262x386.png.webp 262w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-190x280.png.webp 190w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-206x303.png.webp 206w,https://www.cozmoslabs.com/wp-content/uploads/2020/04/Choosing-a-custom-registration-form-162x238.png.webp 162w" sizes="(max-width: 468px) 100vw, 468px" /></noscript></figure></div> <p>If you want to create another unique registration form, you can do that by going to <strong>Profile Builder → Registration Forms</strong>. For each form that you create, you’ll be able to use the same drag-and-drop form builder to set up all the form fields.</p> <p>Note that each form will get its own unique shortcode that you can use anywhere on your site. You can load forms using either shortcodes or blocks, depending on your preferrence.</p> <h2 class="wp-block-heading"><span id="Create_Your_Custom_WooCommerce_Registration_Form_Today">Create Your Custom WooCommerce Registration Form Today</span></h2> <p>Using the Profile Builder Pro WordPress plugin, you can easily create custom WooCommerce registration and edit-profile forms that will help you collect valuable customer information and boost your sales.</p> <p>In this tutorial, you’ve learned how to use the form builder to create a range of fields with this great plugin, including avatars, selects, and CAPTCHAs, but there are plenty more options. Try exploring the available field types, finding out which ones would work for your store.</p> <div class="cl-cta-box flex-container pb"><div class="cta-box-image"><a href="https://www.cozmoslabs.com/wordpress-profile-builder/?utm_source=blog&utm_content=woocommerce-registration-form" ><img width="138" height="138" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20138%20138'%3E%3C/svg%3E" data-lazy-src="https://www.cozmoslabs.com/wp-content/plugins/blog-cta-box/images/pb_logo.png"/><noscript><img width="138" height="138" src = "https://www.cozmoslabs.com/wp-content/plugins/blog-cta-box/images/pb_logo.png"/></noscript></a></div><div class="cta-box-content"><h3 class="cta-box-title"><span id="Profile_Builder_Pro">Profile Builder Pro</span></h3><p class="cta-box-description">Get the Profile Builder Pro plugin today and customize your WooCommerce Registration Forms on your WordPress site!</p><a href="https://www.cozmoslabs.com/wordpress-profile-builder/?utm_source=blog&utm_content=woocommerce-registration-form" class="cz-button cz-button--orange big" >Get Profile Builder</a></div></div> <p><strong>Still have questions about creating custom WooCommerce registration forms? Ask them in the comments section below!</strong></p> <div class="blog-single__share"> <div class="label"> Share: </div> <div class="social"> <ul class="social__list"> <li class="social__el social__el--facebook"> <a class="jaotama__window-opener" href="https://www.facebook.com/sharer.php?u=https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/" target="_self"> <span class="social__label"> facebook </span> <span class="social__ico"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!-- Font Awesome Pro 5.15.4 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) --><path d="M400 32H48A48 48 0 0 0 0 80v352a48 48 0 0 0 48 48h137.25V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.27c-30.81 0-40.42 19.12-40.42 38.73V256h68.78l-11 71.69h-57.78V480H400a48 48 0 0 0 48-48V80a48 48 0 0 0-48-48z"/></svg> </span> </a> </li> <li class="social__el social__el--twitter"> <a class="jaotama__window-opener" href="https://x.com/intent/tweet?url=https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/&text=How To Customize WooCommerce Registration Form (2024 Ultimate Guide)" target="_self"> <span class="social__label"> x </span> <span class="social__ico"> <svg width="21" height="23" viewBox="0 0 21 23" fill="none" xmlns="http://www.w3.org/2000/svg"> <g id="Social Icons"> <path id="Vector" d="M16.0355 2.33984H18.9873L12.5385 10.0614L20.125 20.5686H14.1848L9.53228 14.196L4.2087 20.5686H1.25513L8.15275 12.3096L0.875 2.33984H6.96597L11.1715 8.16465L16.0355 2.33984ZM14.9995 18.7177H16.6351L6.07722 4.09355H4.32203L14.9995 18.7177Z" fill="white"/> </g> </svg> </span> </a> </li> <li class="social__el social__el--linkedin"> <a class="jaotama__window-opener" href="https://www.linkedin.com/sharing/share-offsite?url=https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/&text=How To Customize WooCommerce Registration Form (2024 Ultimate Guide)" target="_self"> <span class="social__label"> linkedin </span> <span class="social__ico"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!-- Font Awesome Pro 5.15.4 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) --><path d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"/></svg> </span> </a> </li> </ul> </div> </div> </div> <div class="fp-news"> <div class="cz-pretitle">From the blog</div> <h2>Related Articles</h2> <div class="fp-news__holder"> <div class="block"> <a class="block__figure" href="https://www.cozmoslabs.com/318663-woocommerce-login-page/"> <img width="1200" height="500" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201200%20500'%3E%3C/svg%3E" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="WooCommerce Login Page - How to Customize" decoding="async" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2021/04/WooCommerce_Login_Page_customizations.png.webp 1200w,https://www.cozmoslabs.com/wp-content/uploads/2021/04/WooCommerce_Login_Page_customizations-300x125.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2021/04/WooCommerce_Login_Page_customizations-1024x427.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2021/04/WooCommerce_Login_Page_customizations-768x320.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2021/04/WooCommerce_Login_Page_customizations-600x250.png.webp 600w" data-lazy-sizes="(max-width: 1200px) 100vw, 1200px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2021/04/WooCommerce_Login_Page_customizations-1200x500.png.webp" /><noscript><img width="1200" height="500" src="https://www.cozmoslabs.com/wp-content/uploads/2021/04/WooCommerce_Login_Page_customizations-1200x500.png.webp" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="WooCommerce Login Page - How to Customize" decoding="async" srcset="https://www.cozmoslabs.com/wp-content/uploads/2021/04/WooCommerce_Login_Page_customizations.png.webp 1200w,https://www.cozmoslabs.com/wp-content/uploads/2021/04/WooCommerce_Login_Page_customizations-300x125.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2021/04/WooCommerce_Login_Page_customizations-1024x427.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2021/04/WooCommerce_Login_Page_customizations-768x320.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2021/04/WooCommerce_Login_Page_customizations-600x250.png.webp 600w" sizes="(max-width: 1200px) 100vw, 1200px" /></noscript> </a> <div class="block__content"> <a href="https://www.cozmoslabs.com/318663-woocommerce-login-page/"> <h3> How to Customize the WooCommerce Login Page (No Code Needed) </h3> </a> <div class="block__author-line"> <a class="block__author" href="https://www.cozmoslabs.com/author/cnewcomer/"> <span class="label">Author: </span> Colin Newcomer </a> <div class="block__last-updated"> <span class="label">Last Updated: </span> March 4th, 2024 </div> </div> <p> Searching for a solution to customize the WooCommerce login page and otherwise control login behavior on your WooCommerce store? If you allow (or force) registration on your store, you'll want to create a user-friendly login experience so that your shoppers can easily log in to their accounts and access other key features. In this post, […] </p> <a class="cz-button cz-button--background medium block__action" href="https://www.cozmoslabs.com/318663-woocommerce-login-page/" target="">Continue Reading </a> </div> </div><div class="block"> <a class="block__figure" href="https://www.cozmoslabs.com/351301-woocommerce-register-page/"> <img width="1200" height="500" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201200%20500'%3E%3C/svg%3E" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="WooCommerce Register Page Customize with Custom Fields" decoding="async" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2021/06/WooCommerce-Register-Page.png.webp 1200w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/WooCommerce-Register-Page-300x125.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/WooCommerce-Register-Page-1024x427.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/WooCommerce-Register-Page-768x320.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/WooCommerce-Register-Page-600x250.png.webp 600w" data-lazy-sizes="(max-width: 1200px) 100vw, 1200px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2021/06/WooCommerce-Register-Page-1200x500.png.webp" /><noscript><img width="1200" height="500" src="https://www.cozmoslabs.com/wp-content/uploads/2021/06/WooCommerce-Register-Page-1200x500.png.webp" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="WooCommerce Register Page Customize with Custom Fields" decoding="async" srcset="https://www.cozmoslabs.com/wp-content/uploads/2021/06/WooCommerce-Register-Page.png.webp 1200w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/WooCommerce-Register-Page-300x125.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/WooCommerce-Register-Page-1024x427.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/WooCommerce-Register-Page-768x320.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2021/06/WooCommerce-Register-Page-600x250.png.webp 600w" sizes="(max-width: 1200px) 100vw, 1200px" /></noscript> </a> <div class="block__content"> <a href="https://www.cozmoslabs.com/351301-woocommerce-register-page/"> <h3> How to Customize the WooCommerce Register Page (Add Custom Fields) </h3> </a> <div class="block__author-line"> <a class="block__author" href="https://www.cozmoslabs.com/author/cnewcomer/"> <span class="label">Author: </span> Colin Newcomer </a> <div class="block__last-updated"> <span class="label">Last Updated: </span> July 13th, 2023 </div> </div> <p> Looking to create a custom WooCommerce register page for your store? Whether you want to create a dedicated registration page or add custom fields to the checkout register form (or both), we're going to show you an easy, code-free way to customize all parts of the WooCommerce registration process. By following this tutorial, you'll learn […] </p> <a class="cz-button cz-button--background medium block__action" href="https://www.cozmoslabs.com/351301-woocommerce-register-page/" target="">Continue Reading </a> </div> </div><div class="block"> <a class="block__figure" href="https://www.cozmoslabs.com/13357-wordpress-user-registration-plugin/"> <img width="1200" height="500" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201200%20500'%3E%3C/svg%3E" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="Best User Registration Plugins for WordPress" decoding="async" data-lazy-srcset="https://www.cozmoslabs.com/wp-content/uploads/2013/02/User_Registration_Plugin_for_WordPress.png.webp 1200w,https://www.cozmoslabs.com/wp-content/uploads/2013/02/User_Registration_Plugin_for_WordPress-300x125.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2013/02/User_Registration_Plugin_for_WordPress-768x320.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2013/02/User_Registration_Plugin_for_WordPress-1024x427.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2013/02/User_Registration_Plugin_for_WordPress-600x250.png.webp 600w" data-lazy-sizes="(max-width: 1200px) 100vw, 1200px" data-lazy-src="https://www.cozmoslabs.com/wp-content/uploads/2013/02/User_Registration_Plugin_for_WordPress.png.webp" /><noscript><img width="1200" height="500" src="https://www.cozmoslabs.com/wp-content/uploads/2013/02/User_Registration_Plugin_for_WordPress.png.webp" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="Best User Registration Plugins for WordPress" decoding="async" srcset="https://www.cozmoslabs.com/wp-content/uploads/2013/02/User_Registration_Plugin_for_WordPress.png.webp 1200w,https://www.cozmoslabs.com/wp-content/uploads/2013/02/User_Registration_Plugin_for_WordPress-300x125.png.webp 300w,https://www.cozmoslabs.com/wp-content/uploads/2013/02/User_Registration_Plugin_for_WordPress-768x320.png.webp 768w,https://www.cozmoslabs.com/wp-content/uploads/2013/02/User_Registration_Plugin_for_WordPress-1024x427.png.webp 1024w,https://www.cozmoslabs.com/wp-content/uploads/2013/02/User_Registration_Plugin_for_WordPress-600x250.png.webp 600w" sizes="(max-width: 1200px) 100vw, 1200px" /></noscript> </a> <div class="block__content"> <a href="https://www.cozmoslabs.com/13357-wordpress-user-registration-plugin/"> <h3> 8 Best WordPress User Registration Plugins </h3> </a> <div class="block__author-line"> <a class="block__author" href="https://www.cozmoslabs.com/author/admin/"> <span class="label">Author: </span> Cristian Antohe </a> <div class="block__last-updated"> <span class="label">Last Updated: </span> July 9th, 2024 </div> </div> <p> Not sure what WordPress user registration plugin to use for your project? Going through all the WordPress user registration plugins can be disorienting. You may have spent hours and hours searching for plugins and tutorials to help you with your project, and you’re still as confused as you were when you started. Imagine finding the […] </p> <a class="cz-button cz-button--background medium block__action" href="https://www.cozmoslabs.com/13357-wordpress-user-registration-plugin/" target="">Continue Reading </a> </div> </div> </div> </div> <div id="comments" class="comments-area"> <h2 class="comments-title"> 2 thoughts on “<span>How To Customize WooCommerce Registration Form (2024 Ultimate Guide)</span>” </h2> <ol class="comment-list"> <section class="comments-list"> <article class="comment even thread-even depth-1" id="comment-336710" itemprop="comment" itemscope itemtype="http://schema.org/Comment"> <div class="comment-body"> <figure class="comment-avatar"> <img alt='' src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2096%2096'%3E%3C/svg%3E" data-lazy-srcset='https://secure.gravatar.com/avatar/7afe7d37dbc7cf19a7e76f5ab5edc344?s=192&d=mm&r=g 2x' class='avatar avatar-96 photo' height='96' width='96' decoding='async' data-lazy-src="https://secure.gravatar.com/avatar/7afe7d37dbc7cf19a7e76f5ab5edc344?s=96&d=mm&r=g"/><noscript><img alt='' src='https://secure.gravatar.com/avatar/7afe7d37dbc7cf19a7e76f5ab5edc344?s=96&d=mm&r=g' srcset='https://secure.gravatar.com/avatar/7afe7d37dbc7cf19a7e76f5ab5edc344?s=192&d=mm&r=g 2x' class='avatar avatar-96 photo' height='96' width='96' decoding='async'/></noscript> </figure> <div class="comment-meta__holder" role="complementary"> <div class="comment-author"> <cite class="fn">Brad</cite> <span class="says">says:</span> </div> <div class="comment-meta"> <time datetime="2020-05-23T19:45+02:00" itemprop="datePublished"> <a href="#comment-336710" itemprop="url">5 years ago</a> </time> </div> </div> <div class="comment-content post-content" itemprop="text"> <p>Is it possible to show custom registration form fields based on the product being purchased? For instance, I use Woocommerce Membership & Subscription plugins. When a user purchases a membership product from my store, I’d like to present them with the opportunity to provide more information about themselves. I can then make their information/profile available in a membership directory. Ths membership directory would only consist of active members (member role = Premium Subscriber). This will enable members to get to know each other and connect based on location, interests, circumstances, etc.. Is this possible using your plugin(s)? If so, can you assist? Thanks!</p> </div> <a rel='nofollow' class='comment-reply-link' href='#comment-336710' data-commentid="336710" data-postid="201727" data-belowelement="comment-336710" data-respondelement="respond" data-replyto="Reply to Brad" aria-label='Reply to Brad'>Reply</a> </div> </article> <article class="comment odd alt thread-odd thread-alt depth-1" id="comment-352395" itemprop="comment" itemscope itemtype="http://schema.org/Comment"> <div class="comment-body"> <figure class="comment-avatar"> <img alt='' src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2096%2096'%3E%3C/svg%3E" data-lazy-srcset='https://secure.gravatar.com/avatar/c6e9ef2a81162c94ee7168a04d4256e0?s=192&d=mm&r=g 2x' class='avatar avatar-96 photo' height='96' width='96' decoding='async' data-lazy-src="https://secure.gravatar.com/avatar/c6e9ef2a81162c94ee7168a04d4256e0?s=96&d=mm&r=g"/><noscript><img alt='' src='https://secure.gravatar.com/avatar/c6e9ef2a81162c94ee7168a04d4256e0?s=96&d=mm&r=g' srcset='https://secure.gravatar.com/avatar/c6e9ef2a81162c94ee7168a04d4256e0?s=192&d=mm&r=g 2x' class='avatar avatar-96 photo' height='96' width='96' decoding='async'/></noscript> </figure> <div class="comment-meta__holder" role="complementary"> <div class="comment-author"> <cite class="fn">Julien</cite> <span class="says">says:</span> </div> <div class="comment-meta"> <time datetime="2020-09-09T17:51+02:00" itemprop="datePublished"> <a href="#comment-352395" itemprop="url">4 years ago</a> </time> </div> </div> <div class="comment-content post-content" itemprop="text"> <p>Is it possible to show a button ‘Create account’ on the My account page that redirects to a page with the custom registration form, instead of displaying the registration form on the My account login page?</p> </div> <a rel='nofollow' class='comment-reply-link' href='#comment-352395' data-commentid="352395" data-postid="201727" data-belowelement="comment-352395" data-respondelement="respond" data-replyto="Reply to Julien" aria-label='Reply to Julien'>Reply</a> </div> </article> </section> </ol><!-- .comment-list --> <div id="respond" class="comment-respond"> <h3 id="reply-title" class="comment-reply-title">Leave a Reply <small><a rel="nofollow" id="cancel-comment-reply-link" href="/201727-customize-woocommerce-registration-form/#respond" style="display:none;">Cancel reply</a></small></h3><form action="https://www.cozmoslabs.com/wp-comments-post.php" method="post" id="commentform" class="comment-form"><p class="comment-notes"><span id="email-notes">Your email address will not be published.</span> <span class="required-field-message">Required fields are marked <span class="required">*</span></span></p><p class="comment-form-comment"><label for="comment">Comment <span class="required">*</span></label> <textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required="required"></textarea></p><p class="comment-form-author"><label for="author">Name <span class="required">*</span></label> <input id="author" name="author" type="text" value="" size="30" maxlength="245" autocomplete="name" required="required" /></p> <p class="comment-form-email"><label for="email">Email <span class="required">*</span></label> <input id="email" name="email" type="text" value="" size="30" maxlength="100" aria-describedby="email-notes" autocomplete="email" required="required" /></p> <p class="comment-form-url"><label for="url">Website</label> <input id="url" name="url" type="text" value="" size="30" maxlength="200" autocomplete="url" /></p> <p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes" /> <label for="wp-comment-cookies-consent">Save my name, email, and website in this browser for the next time I comment.</label></p> <p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Post Comment" /> <input type='hidden' name='comment_post_ID' value='201727' id='comment_post_ID' /> <input type='hidden' name='comment_parent' id='comment_parent' value='0' /> </p><p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="e9637197b7" /></p><p style="display: none !important;" class="akismet-fields-container" data-prefix="ak_"><label>Δ<textarea name="ak_hp_textarea" cols="45" rows="8" maxlength="100"></textarea></label><input type="hidden" id="ak_js_1" name="ak_js" value="243"/><script>document.getElementById( "ak_js_1" ).setAttribute( "value", ( new Date() ).getTime() );</script></p></form> </div><!-- #respond --> <p class="akismet_comment_form_privacy_notice">This site uses Akismet to reduce spam. <a href="https://akismet.com/privacy/" target="_blank" rel="nofollow noopener">Learn how your comment data is processed</a>.</p> </div><!-- #comments --> <!-- <div class="blog-single__pagination"> </div> --> </div> </article> <footer class="footer"> <div class="wrapper"> <div class="footer__nav-container"> <menu class="footer__nav"> <h5>Company</h5> <ul id="menu-2023-company-footer" class="menu"><li id="menu-item-1974432" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1974432"><a href="https://www.cozmoslabs.com/affiliate-program/">Affiliate Program</a></li> <li id="menu-item-1974418" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974418"><a href="/about">About Us</a></li> <li id="menu-item-1974419" class="menu-item menu-item-type-post_type menu-item-object-page current_page_parent menu-item-1974419"><a href="https://www.cozmoslabs.com/blog/">Blog</a></li> <li id="menu-item-1974420" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974420"><a href="/jobs">Careers</a></li> </ul> </menu> <menu class="footer__nav"> <h5>Solutions</h5> <ul id="menu-2023-solutions-footer" class="menu"><li id="menu-item-1974421" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974421"><a href="https://www.cozmoslabs.com/244211-how-to-build-a-subscription-website/">Build a Subscription Website</a></li> <li id="menu-item-1974422" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974422"><a href="https://www.cozmoslabs.com/380816-sell-online-courses-from-your-own-website/">Sell Online Courses</a></li> <li id="menu-item-1974424" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974424"><a href="https://www.cozmoslabs.com/251415-wordpress-private-pages-for-subscribers/">Create Private Pages for Subscribers</a></li> <li id="menu-item-1974423" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item menu-item-1974423"><a href="https://www.cozmoslabs.com/201727-customize-woocommerce-registration-form/" aria-current="page">Customize WooCommerce Registration Form</a></li> <li id="menu-item-1974425" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974425"><a href="https://www.cozmoslabs.com/224738-wordpress-list-users/">List Users in WordPress</a></li> </ul> </menu> <menu class="footer__nav"> <h5>Our Products</h5> <ul id="menu-2023-products-footer" class="menu"><li id="menu-item-1974403" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974403"> <div class="footer__decoration"> <a href="/ultimate-membership-bundle/">Ultimate Membership Bundle</a> <div class="decoration"> <img width="103" height="55" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20103%2055'%3E%3C/svg%3E" data-lazy-src="https://www.cozmoslabs.com/wp-content/themes/cozmoslabs/assets/dist/img/header-product-bundle-decoration.png"><noscript><img width="103" height="55" src="https://www.cozmoslabs.com/wp-content/themes/cozmoslabs/assets/dist/img/header-product-bundle-decoration.png"></noscript> </div> </div> </li> <li id="menu-item-1974405" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974405"><a href="/wordpress-profile-builder/">Profile Builder</a></li> <li id="menu-item-1974404" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974404"><a href="/wordpress-paid-member-subscriptions/">Paid Member Subscriptions</a></li> <li id="menu-item-1974406" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974406"><a href="/wck-custom-fields-custom-post-types-plugin/">WordPress Creation Kit</a></li> <li id="menu-item-1974426" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974426"><a target="_blank" rel="noopener" href="https://translatepress.com/">TranslatePress</a></li> <li id="menu-item-2389096" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2389096"><a title="WordPress Automation Plugin" target="_blank" rel="noopener" href="https://wp-webhooks.com/">WP Webhooks Automations</a></li> </ul> </menu> <menu class="footer__nav"> <h5>Support</h5> <ul id="menu-2023-support-footer" class="menu"><li id="menu-item-1974410" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974410"><a href="/docs/documentation/">Documentation</a></li> <li id="menu-item-1974411" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974411"><a href="/support/open-ticket/">Contact Us</a></li> <li id="menu-item-1974412" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974412"><a href="/account">My Account</a></li> </ul> </menu> </div> <div class="footer__bottom"> <div class="footer__copyright"> <a class="footer__logo" href="https://www.cozmoslabs.com/"> <span class="vh">Cozmoslabs home page</span> <svg width="214" height="40" viewBox="0 0 214 40" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M57.84 19.6C57.84 17.952 58.208 16.48 58.944 15.184C59.696 13.872 60.712 12.856 61.992 12.136C63.288 11.4 64.736 11.032 66.336 11.032C68.208 11.032 69.848 11.512 71.256 12.472C72.664 13.432 73.648 14.76 74.208 16.456H70.344C69.96 15.656 69.416 15.056 68.712 14.656C68.024 14.256 67.224 14.056 66.312 14.056C65.336 14.056 64.464 14.288 63.696 14.752C62.944 15.2 62.352 15.84 61.92 16.672C61.504 17.504 61.296 18.48 61.296 19.6C61.296 20.704 61.504 21.68 61.92 22.528C62.352 23.36 62.944 24.008 63.696 24.472C64.464 24.92 65.336 25.144 66.312 25.144C67.224 25.144 68.024 24.944 68.712 24.544C69.416 24.128 69.96 23.52 70.344 22.72H74.208C73.648 24.432 72.664 25.768 71.256 26.728C69.864 27.672 68.224 28.144 66.336 28.144C64.736 28.144 63.288 27.784 61.992 27.064C60.712 26.328 59.696 25.312 58.944 24.016C58.208 22.72 57.84 21.248 57.84 19.6ZM82.2619 28.216C80.9819 28.216 79.8299 27.936 78.8059 27.376C77.7819 26.8 76.9739 25.992 76.3819 24.952C75.8059 23.912 75.5179 22.712 75.5179 21.352C75.5179 19.992 75.8139 18.792 76.4059 17.752C77.0139 16.712 77.8379 15.912 78.8779 15.352C79.9179 14.776 81.0779 14.488 82.3579 14.488C83.6379 14.488 84.7979 14.776 85.8379 15.352C86.8779 15.912 87.6939 16.712 88.2859 17.752C88.8939 18.792 89.1979 19.992 89.1979 21.352C89.1979 22.712 88.8859 23.912 88.2619 24.952C87.6539 25.992 86.8219 26.8 85.7659 27.376C84.7259 27.936 83.5579 28.216 82.2619 28.216ZM82.2619 25.288C82.8699 25.288 83.4379 25.144 83.9659 24.856C84.5099 24.552 84.9419 24.104 85.2619 23.512C85.5819 22.92 85.7419 22.2 85.7419 21.352C85.7419 20.088 85.4059 19.12 84.7339 18.448C84.0779 17.76 83.2699 17.416 82.3099 17.416C81.3499 17.416 80.5419 17.76 79.8859 18.448C79.2459 19.12 78.9259 20.088 78.9259 21.352C78.9259 22.616 79.2379 23.592 79.8619 24.28C80.5019 24.952 81.3019 25.288 82.2619 25.288ZM94.0146 25.24H99.9426V28H90.1986V25.288L96.0066 17.464H90.2226V14.704H99.8706V17.416L94.0146 25.24ZM118.336 14.512C119.968 14.512 121.28 15.016 122.272 16.024C123.28 17.016 123.784 18.408 123.784 20.2V28H120.424V20.656C120.424 19.616 120.16 18.824 119.632 18.28C119.104 17.72 118.384 17.44 117.472 17.44C116.56 17.44 115.832 17.72 115.288 18.28C114.76 18.824 114.496 19.616 114.496 20.656V28H111.136V20.656C111.136 19.616 110.872 18.824 110.344 18.28C109.816 17.72 109.096 17.44 108.184 17.44C107.256 17.44 106.52 17.72 105.976 18.28C105.448 18.824 105.184 19.616 105.184 20.656V28H101.824V14.704H105.184V16.312C105.616 15.752 106.168 15.312 106.84 14.992C107.528 14.672 108.28 14.512 109.096 14.512C110.136 14.512 111.064 14.736 111.88 15.184C112.696 15.616 113.328 16.24 113.776 17.056C114.208 16.288 114.832 15.672 115.648 15.208C116.48 14.744 117.376 14.512 118.336 14.512ZM132.157 28.216C130.877 28.216 129.725 27.936 128.701 27.376C127.677 26.8 126.869 25.992 126.277 24.952C125.701 23.912 125.413 22.712 125.413 21.352C125.413 19.992 125.709 18.792 126.301 17.752C126.909 16.712 127.733 15.912 128.773 15.352C129.813 14.776 130.973 14.488 132.253 14.488C133.533 14.488 134.693 14.776 135.733 15.352C136.773 15.912 137.589 16.712 138.181 17.752C138.789 18.792 139.093 19.992 139.093 21.352C139.093 22.712 138.781 23.912 138.157 24.952C137.549 25.992 136.717 26.8 135.661 27.376C134.621 27.936 133.453 28.216 132.157 28.216ZM132.157 25.288C132.765 25.288 133.333 25.144 133.861 24.856C134.405 24.552 134.837 24.104 135.157 23.512C135.477 22.92 135.637 22.2 135.637 21.352C135.637 20.088 135.301 19.12 134.629 18.448C133.973 17.76 133.165 17.416 132.205 17.416C131.245 17.416 130.437 17.76 129.781 18.448C129.141 19.12 128.821 20.088 128.821 21.352C128.821 22.616 129.133 23.592 129.757 24.28C130.397 24.952 131.197 25.288 132.157 25.288ZM145.925 28.216C144.837 28.216 143.861 28.024 142.997 27.64C142.133 27.24 141.445 26.704 140.933 26.032C140.437 25.36 140.165 24.616 140.117 23.8H143.501C143.565 24.312 143.813 24.736 144.245 25.072C144.693 25.408 145.245 25.576 145.901 25.576C146.541 25.576 147.037 25.448 147.389 25.192C147.757 24.936 147.941 24.608 147.941 24.208C147.941 23.776 147.717 23.456 147.269 23.248C146.837 23.024 146.141 22.784 145.181 22.528C144.189 22.288 143.373 22.04 142.733 21.784C142.109 21.528 141.565 21.136 141.101 20.608C140.653 20.08 140.429 19.368 140.429 18.472C140.429 17.736 140.637 17.064 141.053 16.456C141.485 15.848 142.093 15.368 142.877 15.016C143.677 14.664 144.613 14.488 145.685 14.488C147.269 14.488 148.533 14.888 149.477 15.688C150.421 16.472 150.941 17.536 151.037 18.88H147.821C147.773 18.352 147.549 17.936 147.149 17.632C146.765 17.312 146.245 17.152 145.589 17.152C144.981 17.152 144.509 17.264 144.173 17.488C143.853 17.712 143.693 18.024 143.693 18.424C143.693 18.872 143.917 19.216 144.365 19.456C144.813 19.68 145.509 19.912 146.453 20.152C147.413 20.392 148.205 20.64 148.829 20.896C149.453 21.152 149.989 21.552 150.437 22.096C150.901 22.624 151.141 23.328 151.157 24.208C151.157 24.976 150.941 25.664 150.509 26.272C150.093 26.88 149.485 27.36 148.685 27.712C147.901 28.048 146.981 28.216 145.925 28.216ZM156.555 10.24V28H153.195V10.24H156.555ZM158.291 21.304C158.291 19.96 158.555 18.768 159.083 17.728C159.627 16.688 160.355 15.888 161.267 15.328C162.195 14.768 163.227 14.488 164.363 14.488C165.355 14.488 166.219 14.688 166.955 15.088C167.707 15.488 168.307 15.992 168.755 16.6V14.704H172.139V28H168.755V26.056C168.323 26.68 167.723 27.2 166.955 27.616C166.203 28.016 165.331 28.216 164.339 28.216C163.219 28.216 162.195 27.928 161.267 27.352C160.355 26.776 159.627 25.968 159.083 24.928C158.555 23.872 158.291 22.664 158.291 21.304ZM168.755 21.352C168.755 20.536 168.595 19.84 168.275 19.264C167.955 18.672 167.523 18.224 166.979 17.92C166.435 17.6 165.851 17.44 165.227 17.44C164.603 17.44 164.027 17.592 163.499 17.896C162.971 18.2 162.539 18.648 162.203 19.24C161.883 19.816 161.723 20.504 161.723 21.304C161.723 22.104 161.883 22.808 162.203 23.416C162.539 24.008 162.971 24.464 163.499 24.784C164.043 25.104 164.619 25.264 165.227 25.264C165.851 25.264 166.435 25.112 166.979 24.808C167.523 24.488 167.955 24.04 168.275 23.464C168.595 22.872 168.755 22.168 168.755 21.352ZM178.061 16.648C178.493 16.008 179.085 15.488 179.837 15.088C180.605 14.688 181.477 14.488 182.453 14.488C183.589 14.488 184.613 14.768 185.525 15.328C186.453 15.888 187.181 16.688 187.709 17.728C188.253 18.752 188.525 19.944 188.525 21.304C188.525 22.664 188.253 23.872 187.709 24.928C187.181 25.968 186.453 26.776 185.525 27.352C184.613 27.928 183.589 28.216 182.453 28.216C181.461 28.216 180.589 28.024 179.837 27.64C179.101 27.24 178.509 26.728 178.061 26.104V28H174.701V10.24H178.061V16.648ZM185.093 21.304C185.093 20.504 184.925 19.816 184.589 19.24C184.269 18.648 183.837 18.2 183.293 17.896C182.765 17.592 182.189 17.44 181.565 17.44C180.957 17.44 180.381 17.6 179.837 17.92C179.309 18.224 178.877 18.672 178.541 19.264C178.221 19.856 178.061 20.552 178.061 21.352C178.061 22.152 178.221 22.848 178.541 23.44C178.877 24.032 179.309 24.488 179.837 24.808C180.381 25.112 180.957 25.264 181.565 25.264C182.189 25.264 182.765 25.104 183.293 24.784C183.837 24.464 184.269 24.008 184.589 23.416C184.925 22.824 185.093 22.12 185.093 21.304ZM195.334 28.216C194.246 28.216 193.27 28.024 192.406 27.64C191.542 27.24 190.854 26.704 190.342 26.032C189.846 25.36 189.574 24.616 189.526 23.8H192.91C192.974 24.312 193.222 24.736 193.654 25.072C194.102 25.408 194.654 25.576 195.31 25.576C195.95 25.576 196.446 25.448 196.798 25.192C197.166 24.936 197.35 24.608 197.35 24.208C197.35 23.776 197.126 23.456 196.678 23.248C196.246 23.024 195.55 22.784 194.59 22.528C193.598 22.288 192.782 22.04 192.142 21.784C191.518 21.528 190.974 21.136 190.51 20.608C190.062 20.08 189.838 19.368 189.838 18.472C189.838 17.736 190.046 17.064 190.462 16.456C190.894 15.848 191.502 15.368 192.286 15.016C193.086 14.664 194.022 14.488 195.094 14.488C196.678 14.488 197.942 14.888 198.886 15.688C199.83 16.472 200.35 17.536 200.446 18.88H197.23C197.182 18.352 196.958 17.936 196.558 17.632C196.174 17.312 195.654 17.152 194.998 17.152C194.39 17.152 193.918 17.264 193.582 17.488C193.262 17.712 193.102 18.024 193.102 18.424C193.102 18.872 193.326 19.216 193.774 19.456C194.222 19.68 194.918 19.912 195.862 20.152C196.822 20.392 197.614 20.64 198.238 20.896C198.862 21.152 199.398 21.552 199.846 22.096C200.31 22.624 200.55 23.328 200.566 24.208C200.566 24.976 200.35 25.664 199.918 26.272C199.502 26.88 198.894 27.36 198.094 27.712C197.31 28.048 196.39 28.216 195.334 28.216Z" fill="#212121"/><g filter="url(#filter0_i_3251_37255)"><g filter="url(#filter1_i_3251_37255)"><path fill-rule="evenodd" clip-rule="evenodd" d="M12.1604 25.0374L12.0723 23.2852C11.8131 22.462 11.8387 20.7045 14.0136 20.2594C15.5588 19.9432 15.8577 18.3302 16.1334 16.8426C16.3427 15.7129 16.5387 14.6556 17.2568 14.2935C18.5878 13.6224 20.1053 15.5536 20.6978 16.6031C21.6418 17.7468 23.883 19.3683 25.2957 16.7045C27.0615 13.3748 32.5188 9.94287 33.0931 10.2302C35.9576 11.6631 37.6598 14.6729 37.5151 15.4049L38.2141 21.8104L20.6486 30.9792L14.9829 28.9605C13.8189 27.8227 12.8651 26.4925 12.1604 25.0374Z" fill="url(#paint0_linear_3251_37255)"/></g><g filter="url(#filter2_i_3251_37255)"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.3478 24.4521C10.4114 21.8669 10.2294 18.9821 10.9939 16.1288C12.9869 8.69079 20.6572 4.28349 28.1261 6.28476C35.595 8.28604 40.034 15.9381 38.041 23.376C36.2972 29.8842 30.2066 34.0721 23.7076 33.6767C22.7792 33.6202 21.8424 33.4702 20.9088 33.22C20.442 33.0949 19.987 32.9478 19.5448 32.78C18.5496 32.4025 17.6186 31.9204 16.7611 31.3502C14.2412 29.6745 12.3567 27.2371 11.3478 24.4521ZM12.0637 20.9995C12.2609 22.9117 13.0666 25.5484 14.9715 25.2909V25.2909C16.3461 25.1052 17.3653 23.3644 17.3653 23.3644C18.2629 22.1002 18.0667 17.352 20.6696 19.2848C22.1223 21.3511 22.9645 21.8581 23.2041 21.8532C23.6567 22.0392 24.5574 22.0787 24.5396 20.7488C24.5217 19.4189 23.9348 17.1619 23.5309 15.654C23.2845 14.3403 23.9165 12.5679 25.8761 13.5207C26.3356 13.7887 27.1645 14.1545 29.3436 15.9415C31.5226 17.7285 33.0623 16.6014 34.2353 14.9759V14.9759C34.8743 14.0904 34.9131 13.0124 34.3908 12.0534C33.0516 9.59429 31.1567 8.6242 27.7443 7.70983C21.0657 5.92032 14.207 9.86127 12.4249 16.5122C12.0213 18.0185 11.9127 19.5345 12.0637 20.9995Z" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M11.3478 24.4521C10.4114 21.8669 10.2294 18.9821 10.9939 16.1288C12.9869 8.69079 20.6572 4.28349 28.1261 6.28476C35.595 8.28604 40.034 15.9381 38.041 23.376C36.2972 29.8842 30.2066 34.0721 23.7076 33.6767C22.7792 33.6202 21.8424 33.4702 20.9088 33.22C20.442 33.0949 19.987 32.9478 19.5448 32.78C18.5496 32.4025 17.6186 31.9204 16.7611 31.3502C14.2412 29.6745 12.3567 27.2371 11.3478 24.4521ZM12.0637 20.9995C12.2609 22.9117 13.0666 25.5484 14.9715 25.2909V25.2909C16.3461 25.1052 17.3653 23.3644 17.3653 23.3644C18.2629 22.1002 18.0667 17.352 20.6696 19.2848C22.1223 21.3511 22.9645 21.8581 23.2041 21.8532C23.6567 22.0392 24.5574 22.0787 24.5396 20.7488C24.5217 19.4189 23.9348 17.1619 23.5309 15.654C23.2845 14.3403 23.9165 12.5679 25.8761 13.5207C26.3356 13.7887 27.1645 14.1545 29.3436 15.9415C31.5226 17.7285 33.0623 16.6014 34.2353 14.9759V14.9759C34.8743 14.0904 34.9131 13.0124 34.3908 12.0534C33.0516 9.59429 31.1567 8.6242 27.7443 7.70983C21.0657 5.92032 14.207 9.86127 12.4249 16.5122C12.0213 18.0185 11.9127 19.5345 12.0637 20.9995Z" fill="url(#paint1_linear_3251_37255)"/></g><g filter="url(#filter3_di_3251_37255)"><path fill-rule="evenodd" clip-rule="evenodd" d="M46.7183 6.42859C46.7186 6.42726 46.7187 6.42663 46.7186 6.42667C46.7184 6.42676 46.7174 6.43052 46.7159 6.43764C46.7172 6.43336 46.7179 6.43036 46.7183 6.42859ZM46.0418 7.51951L46.0508 7.51827L46.0452 7.52543C45.2409 8.5544 43.8596 9.90727 41.937 11.499C38.1168 14.6615 32.4559 18.5249 25.8632 22.313C19.2704 26.1012 13.078 29.0485 8.41605 30.7598C6.06963 31.621 4.20175 32.1351 2.9042 32.3139L2.89517 32.3151L2.90076 32.3079C3.70508 31.279 5.08637 29.9261 7.00905 28.3344C8.3098 27.2576 9.82397 26.0995 11.5157 24.8908C11.2542 24.2368 11.0436 23.5663 10.8846 22.8851C3.76467 27.9073 -0.553824 32.2067 0.355597 33.7743C1.67763 36.0532 13.5471 31.6964 26.8668 24.043C40.1864 16.3897 49.9125 8.33797 48.5904 6.05906C47.6897 4.50641 41.8931 6.03397 34.0775 9.58568C34.59 10.0643 35.0673 10.582 35.5047 11.1352C37.3171 10.325 39.0054 9.63323 40.53 9.07361C42.8764 8.21232 44.7443 7.69825 46.0418 7.51951ZM1.6114 32.3448C1.61158 32.3447 1.61538 32.3457 1.62228 32.348C1.61468 32.3461 1.61123 32.3449 1.6114 32.3448ZM2.23007 33.3957C2.22794 33.4032 2.22724 33.4068 2.22741 33.4067C2.22752 33.4066 2.22798 33.4051 2.22866 33.4023C2.22906 33.4006 2.22954 33.3984 2.23007 33.3957ZM47.3237 7.48534C47.3313 7.48727 47.3348 7.48844 47.3346 7.48854C47.3344 7.48864 47.3306 7.48768 47.3237 7.48534Z" fill="url(#paint2_linear_3251_37255)"/><path fill-rule="evenodd" clip-rule="evenodd" d="M46.7183 6.42859C46.7186 6.42726 46.7187 6.42663 46.7186 6.42667C46.7184 6.42676 46.7174 6.43052 46.7159 6.43764C46.7172 6.43336 46.7179 6.43036 46.7183 6.42859ZM46.0418 7.51951L46.0508 7.51827L46.0452 7.52543C45.2409 8.5544 43.8596 9.90727 41.937 11.499C38.1168 14.6615 32.4559 18.5249 25.8632 22.313C19.2704 26.1012 13.078 29.0485 8.41605 30.7598C6.06963 31.621 4.20175 32.1351 2.9042 32.3139L2.89517 32.3151L2.90076 32.3079C3.70508 31.279 5.08637 29.9261 7.00905 28.3344C8.3098 27.2576 9.82397 26.0995 11.5157 24.8908C11.2542 24.2368 11.0436 23.5663 10.8846 22.8851C3.76467 27.9073 -0.553824 32.2067 0.355597 33.7743C1.67763 36.0532 13.5471 31.6964 26.8668 24.043C40.1864 16.3897 49.9125 8.33797 48.5904 6.05906C47.6897 4.50641 41.8931 6.03397 34.0775 9.58568C34.59 10.0643 35.0673 10.582 35.5047 11.1352C37.3171 10.325 39.0054 9.63323 40.53 9.07361C42.8764 8.21232 44.7443 7.69825 46.0418 7.51951ZM1.6114 32.3448C1.61158 32.3447 1.61538 32.3457 1.62228 32.348C1.61468 32.3461 1.61123 32.3449 1.6114 32.3448ZM2.23007 33.3957C2.22794 33.4032 2.22724 33.4068 2.22741 33.4067C2.22752 33.4066 2.22798 33.4051 2.22866 33.4023C2.22906 33.4006 2.22954 33.3984 2.23007 33.3957ZM47.3237 7.48534C47.3313 7.48727 47.3348 7.48844 47.3346 7.48854C47.3344 7.48864 47.3306 7.48768 47.3237 7.48534Z" fill="url(#paint3_linear_3251_37255)"/></g><g filter="url(#filter4_i_3251_37255)"><circle cx="22.7931" cy="10.6108" r="1.42688" transform="rotate(15 22.7931 10.6108)" fill="#F9CE21"/></g><g filter="url(#filter5_i_3251_37255)"><circle cx="18.5138" cy="17.1888" r="1.00415" transform="rotate(15 18.5138 17.1888)" fill="#F9CE21"/></g></g><defs><filter id="filter0_i_3251_37255" x="0" y="-4.99805" width="49.4463" height="49.3301" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dx="0.5" dy="-0.5"/><feGaussianBlur stdDeviation="0.75"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.16 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><filter id="filter1_i_3251_37255" x="11.96" y="10.2129" width="26.2539" height="20.7666" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><filter id="filter2_i_3251_37255" x="10.5176" y="5.80273" width="28" height="27.8994" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><filter id="filter3_di_3251_37255" x="-0.764648" y="5.4541" width="50.4756" height="30.9258" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="1"/><feGaussianBlur stdDeviation="0.5"/><feComposite in2="hardAlpha" operator="out"/><feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0"/><feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_3251_37255"/><feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_3251_37255" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect2_innerShadow_3251_37255"/></filter><filter id="filter4_i_3251_37255" x="21.3662" y="9.18359" width="2.85449" height="2.85449" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><filter id="filter5_i_3251_37255" x="17.5098" y="16.1846" width="2.00879" height="2.00879" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/><feOffset dy="0.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.13 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow_3251_37255"/></filter><linearGradient id="paint0_linear_3251_37255" x1="28.5675" y1="9.01488" x2="22.5459" y2="31.4876" gradientUnits="userSpaceOnUse"><stop stop-color="#B1261A"/><stop offset="0.0001" stop-color="#C4341D"/><stop offset="1" stop-color="#EE5225"/></linearGradient><linearGradient id="paint1_linear_3251_37255" x1="17.5061" y1="2.22488" x2="26.3834" y2="29.2746" gradientUnits="userSpaceOnUse"><stop stop-color="#FFF301"/><stop offset="1" stop-color="#F58C1D"/></linearGradient><linearGradient id="paint2_linear_3251_37255" x1="29.6281" y1="0.678335" x2="19.3182" y2="39.1555" gradientUnits="userSpaceOnUse"><stop stop-color="#EF1926"/><stop offset="1" stop-color="#F26520"/></linearGradient><linearGradient id="paint3_linear_3251_37255" x1="29.6281" y1="0.678335" x2="19.3182" y2="39.1555" gradientUnits="userSpaceOnUse"><stop stop-color="#B1261A"/><stop offset="0.0001" stop-color="#C4341D"/><stop offset="1" stop-color="#EE5225"/></linearGradient></defs></svg> </a> © 2024 Cozmoslabs. All rights reserverd. </div> <div class="social"> <ul id="menu-2023-social-networks-1" class="menu"><li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974427"><a target="_blank" rel="noopener" href="https://twitter.com/cozmoslabs"><span class="menu-item__ico menu-item__ico--twitter"><svg width="21" height="23" viewBox="0 0 21 23" fill="none" xmlns="http://www.w3.org/2000/svg"> <g id="Social Icons"> <path id="Vector" d="M16.0355 2.33984H18.9873L12.5385 10.0614L20.125 20.5686H14.1848L9.53228 14.196L4.2087 20.5686H1.25513L8.15275 12.3096L0.875 2.33984H6.96597L11.1715 8.16465L16.0355 2.33984ZM14.9995 18.7177H16.6351L6.07722 4.09355H4.32203L14.9995 18.7177Z" fill="white"/> </g> </svg> </span><span class="menu-item__title menu-item__title--twitter">twitter</span></a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974428"><a target="_blank" rel="noopener" href="https://www.facebook.com/cozmoslabs/"><span class="menu-item__ico menu-item__ico--facebook"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!-- Font Awesome Pro 5.15.4 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) --><path d="M400 32H48A48 48 0 0 0 0 80v352a48 48 0 0 0 48 48h137.25V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.27c-30.81 0-40.42 19.12-40.42 38.73V256h68.78l-11 71.69h-57.78V480H400a48 48 0 0 0 48-48V80a48 48 0 0 0-48-48z"/></svg></span><span class="menu-item__title menu-item__title--facebook">facebook</span></a></li> <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974429"><a target="_blank" rel="noopener" href="https://www.linkedin.com/company/cozmoslabs/"><span class="menu-item__ico menu-item__ico--linkedin"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!-- Font Awesome Pro 5.15.4 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) --><path d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"/></svg></span><span class="menu-item__title menu-item__title--linkedin">linkedin</span></a></li> </ul> <menu class="footer__privacy"> <ul id="menu-2023-privacy-footer" class="menu"><li id="menu-item-1974407" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974407"><a href="/privacy-policy/">Privacy Policy</a></li> <li id="menu-item-1974408" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974408"><a href="/terms-conditions/">Terms</a></li> <li id="menu-item-1974409" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1974409"><a href="/privacy-policy/">Cookies</a></li> </ul> </menu> </div> </div> <div> </footer> <style>.edd-js-none .edd-has-js, .edd-js .edd-no-js, body.edd-js input.edd-no-js { display: none; }</style> <script>/* <![CDATA[ */(function(){var c = document.body.classList;c.remove('edd-js-none');c.add('edd-js');})();/* ]]> */</script> <style type="text/css"> /* Hide reCAPTCHA V3 badge */ .grecaptcha-badge { visibility: hidden !important; } </style> <script type="text/html" id="tmpl-media-frame"> <div class="media-frame-title" id="media-frame-title"></div> <h2 class="media-frame-menu-heading">Actions</h2> <button type="button" class="button button-link media-frame-menu-toggle" aria-expanded="false"> Menu <span class="dashicons dashicons-arrow-down" aria-hidden="true"></span> </button> <div class="media-frame-menu"></div> <div class="media-frame-tab-panel"> <div class="media-frame-router"></div> <div class="media-frame-content"></div> </div> <h2 class="media-frame-actions-heading screen-reader-text"> Selected media actions </h2> <div class="media-frame-toolbar"></div> <div class="media-frame-uploader"></div> </script> <script type="text/html" id="tmpl-media-modal"> <div tabindex="0" class="media-modal wp-core-ui" role="dialog" aria-labelledby="media-frame-title"> <# if ( data.hasCloseButton ) { #> <button type="button" class="media-modal-close"><span class="media-modal-icon"><span class="screen-reader-text"> Close dialog </span></span></button> <# } #> <div class="media-modal-content" role="document"></div> </div> <div class="media-modal-backdrop"></div> </script> <script type="text/html" id="tmpl-uploader-window"> <div class="uploader-window-content"> <div class="uploader-editor-title">Drop files to upload</div> </div> </script> <script type="text/html" id="tmpl-uploader-editor"> <div class="uploader-editor-content"> <div class="uploader-editor-title">Drop files to upload</div> </div> </script> <script type="text/html" id="tmpl-uploader-inline"> <# var messageClass = data.message ? 'has-upload-message' : 'no-upload-message'; #> <# if ( data.canClose ) { #> <button class="close dashicons dashicons-no"><span class="screen-reader-text"> Close uploader </span></button> <# } #> <div class="uploader-inline-content {{ messageClass }}"> <# if ( data.message ) { #> <h2 class="upload-message">{{ data.message }}</h2> <# } #> <div class="upload-ui"> <h2 class="upload-instructions drop-instructions">Drop files to upload</h2> <p class="upload-instructions drop-instructions">or</p> <button type="button" class="browser button button-hero" aria-labelledby="post-upload-info">Select Files</button> </div> <div class="upload-inline-status"></div> <div class="post-upload-ui" id="post-upload-info"> <p class="max-upload-size"> Maximum upload file size: 64 MB. </p> <# if ( data.suggestedWidth && data.suggestedHeight ) { #> <p class="suggested-dimensions"> Suggested image dimensions: {{data.suggestedWidth}} by {{data.suggestedHeight}} pixels. </p> <# } #> </div> </div> </script> <script type="text/html" id="tmpl-media-library-view-switcher"> <a href="https://www.cozmoslabs.com/wp-admin/upload.php?mode=list" class="view-list"> <span class="screen-reader-text"> List view </span> </a> <a href="https://www.cozmoslabs.com/wp-admin/upload.php?mode=grid" class="view-grid current" aria-current="page"> <span class="screen-reader-text"> Grid view </span> </a> </script> <script type="text/html" id="tmpl-uploader-status"> <h2>Uploading</h2> <div class="media-progress-bar"><div></div></div> <div class="upload-details"> <span class="upload-count"> <span class="upload-index"></span> / <span class="upload-total"></span> </span> <span class="upload-detail-separator">–</span> <span class="upload-filename"></span> </div> <div class="upload-errors"></div> <button type="button" class="button upload-dismiss-errors">Dismiss errors</button> </script> <script type="text/html" id="tmpl-uploader-status-error"> <span class="upload-error-filename">{{{ data.filename }}}</span> <span class="upload-error-message">{{ data.message }}</span> </script> <script type="text/html" id="tmpl-edit-attachment-frame"> <div class="edit-media-header"> <button class="left dashicons"<# if ( ! data.hasPrevious ) { #> disabled<# } #>><span class="screen-reader-text">Edit previous media item</span></button> <button class="right dashicons"<# if ( ! data.hasNext ) { #> disabled<# } #>><span class="screen-reader-text">Edit next media item</span></button> <button type="button" class="media-modal-close"><span class="media-modal-icon"><span class="screen-reader-text">Close dialog</span></span></button> </div> <div class="media-frame-title"></div> <div class="media-frame-content"></div> </script> <script type="text/html" id="tmpl-attachment-details-two-column"> <div class="attachment-media-view {{ data.orientation }}"> <h2 class="screen-reader-text">Attachment Preview</h2> <div class="thumbnail thumbnail-{{ data.type }}"> <# if ( data.uploading ) { #> <div class="media-progress-bar"><div></div></div> <# } else if ( data.sizes && data.sizes.full ) { #> <img class="details-image" src="{{ data.sizes.full.url }}" draggable="false" alt="" /> <# } else if ( data.sizes && data.sizes.large ) { #> <img class="details-image" src="{{ data.sizes.large.url }}" draggable="false" alt="" /> <# } else if ( -1 === jQuery.inArray( data.type, [ 'audio', 'video' ] ) ) { #> <img class="details-image icon" src="{{ data.icon }}" draggable="false" alt="" /> <# } #> <# if ( 'audio' === data.type ) { #> <div class="wp-media-wrapper wp-audio"> <audio style="visibility: hidden" controls class="wp-audio-shortcode" width="100%" preload="none"> <source type="{{ data.mime }}" src="{{ data.url }}" /> </audio> </div> <# } else if ( 'video' === data.type ) { var w_rule = ''; if ( data.width ) { w_rule = 'width: ' + data.width + 'px;'; } else if ( wp.media.view.settings.contentWidth ) { w_rule = 'width: ' + wp.media.view.settings.contentWidth + 'px;'; } #> <div style="{{ w_rule }}" class="wp-media-wrapper wp-video"> <video controls="controls" class="wp-video-shortcode" preload="metadata" <# if ( data.width ) { #>width="{{ data.width }}"<# } #> <# if ( data.height ) { #>height="{{ data.height }}"<# } #> <# if ( data.image && data.image.src !== data.icon ) { #>poster="{{ data.image.src }}"<# } #>> <source type="{{ data.mime }}" src="{{ data.url }}" /> </video> </div> <# } #> <div class="attachment-actions"> <# if ( 'image' === data.type && ! data.uploading && data.sizes && data.can.save ) { #> <button type="button" class="button edit-attachment">Edit Image</button> <# } else if ( 'pdf' === data.subtype && data.sizes ) { #> <p>Document Preview</p> <# } #> </div> </div> </div> <div class="attachment-info"> <span class="settings-save-status" role="status"> <span class="spinner"></span> <span class="saved">Saved.</span> </span> <div class="details"> <h2 class="screen-reader-text"> Details </h2> <div class="uploaded"><strong>Uploaded on:</strong> {{ data.dateFormatted }}</div> <div class="uploaded-by"> <strong>Uploaded by:</strong> <# if ( data.authorLink ) { #> <a href="{{ data.authorLink }}">{{ data.authorName }}</a> <# } else { #> {{ data.authorName }} <# } #> </div> <# if ( data.uploadedToTitle ) { #> <div class="uploaded-to"> <strong>Uploaded to:</strong> <# if ( data.uploadedToLink ) { #> <a href="{{ data.uploadedToLink }}">{{ data.uploadedToTitle }}</a> <# } else { #> {{ data.uploadedToTitle }} <# } #> </div> <# } #> <div class="filename"><strong>File name:</strong> {{ data.filename }}</div> <div class="file-type"><strong>File type:</strong> {{ data.mime }}</div> <div class="file-size"><strong>File size:</strong> {{ data.filesizeHumanReadable }}</div> <# if ( 'image' === data.type && ! data.uploading ) { #> <# if ( data.width && data.height ) { #> <div class="dimensions"><strong>Dimensions:</strong> {{ data.width }} by {{ data.height }} pixels </div> <# } #> <# if ( data.originalImageURL && data.originalImageName ) { #> <div class="word-wrap-break-word"> <strong>Original image:</strong> <a href="{{ data.originalImageURL }}">{{data.originalImageName}}</a> </div> <# } #> <# } #> <# if ( data.fileLength && data.fileLengthHumanReadable ) { #> <div class="file-length"><strong>Length:</strong> <span aria-hidden="true">{{ data.fileLength }}</span> <span class="screen-reader-text">{{ data.fileLengthHumanReadable }}</span> </div> <# } #> <# if ( 'audio' === data.type && data.meta.bitrate ) { #> <div class="bitrate"> <strong>Bitrate:</strong> {{ Math.round( data.meta.bitrate / 1000 ) }}kb/s <# if ( data.meta.bitrate_mode ) { #> {{ ' ' + data.meta.bitrate_mode.toUpperCase() }} <# } #> </div> <# } #> <# if ( data.mediaStates ) { #> <div class="media-states"><strong>Used as:</strong> {{ data.mediaStates }}</div> <# } #> <div class="compat-meta"> <# if ( data.compat && data.compat.meta ) { #> {{{ data.compat.meta }}} <# } #> </div> </div> <div class="settings"> <# var maybeReadOnly = data.can.save || data.allowLocalEdits ? '' : 'readonly'; #> <# if ( 'image' === data.type ) { #> <span class="setting alt-text has-description" data-setting="alt"> <label for="attachment-details-two-column-alt-text" class="name">Alternative Text</label> <textarea id="attachment-details-two-column-alt-text" aria-describedby="alt-text-description" {{ maybeReadOnly }}>{{ data.alt }}</textarea> </span> <p class="description" id="alt-text-description"><a href="https://www.w3.org/WAI/tutorials/images/decision-tree" target="_blank" rel="noopener">Learn how to describe the purpose of the image<span class="screen-reader-text"> (opens in a new tab)</span></a>. Leave empty if the image is purely decorative.</p> <# } #> <span class="setting" data-setting="title"> <label for="attachment-details-two-column-title" class="name">Title</label> <input type="text" id="attachment-details-two-column-title" value="{{ data.title }}" {{ maybeReadOnly }} /> </span> <# if ( 'audio' === data.type ) { #> <span class="setting" data-setting="artist"> <label for="attachment-details-two-column-artist" class="name">Artist</label> <input type="text" id="attachment-details-two-column-artist" value="{{ data.artist || data.meta.artist || '' }}" /> </span> <span class="setting" data-setting="album"> <label for="attachment-details-two-column-album" class="name">Album</label> <input type="text" id="attachment-details-two-column-album" value="{{ data.album || data.meta.album || '' }}" /> </span> <# } #> <span class="setting" data-setting="caption"> <label for="attachment-details-two-column-caption" class="name">Caption</label> <textarea id="attachment-details-two-column-caption" {{ maybeReadOnly }}>{{ data.caption }}</textarea> </span> <span class="setting" data-setting="description"> <label for="attachment-details-two-column-description" class="name">Description</label> <textarea id="attachment-details-two-column-description" {{ maybeReadOnly }}>{{ data.description }}</textarea> </span> <span class="setting" data-setting="url"> <label for="attachment-details-two-column-copy-link" class="name">File URL:</label> <input type="text" class="attachment-details-copy-link" id="attachment-details-two-column-copy-link" value="{{ data.url }}" readonly /> <span class="copy-to-clipboard-container"> <button type="button" class="button button-small copy-attachment-url" data-clipboard-target="#attachment-details-two-column-copy-link">Copy URL to clipboard</button> <span class="success hidden" aria-hidden="true">Copied!</span> </span> </span> <div class="attachment-compat"></div> </div> <div class="actions"> <# if ( data.link ) { #> <a class="view-attachment" href="{{ data.link }}">View attachment page</a> <# } #> <# if ( data.can.save ) { #> <# if ( data.link ) { #> <span class="links-separator">|</span> <# } #> <a href="{{ data.editLink }}">Edit more details</a> <# } #> <# if ( data.can.save && data.link ) { #> <span class="links-separator">|</span> <a href="{{ data.url }}" download>Download file</a> <# } #> <# if ( ! data.uploading && data.can.remove ) { #> <# if ( data.link || data.can.save ) { #> <span class="links-separator">|</span> <# } #> <button type="button" class="button-link delete-attachment">Delete permanently</button> <# } #> </div> </div> </script> <script type="text/html" id="tmpl-attachment"> <div class="attachment-preview js--select-attachment type-{{ data.type }} subtype-{{ data.subtype }} {{ data.orientation }}"> <div class="thumbnail"> <# if ( data.uploading ) { #> <div class="media-progress-bar"><div style="width: {{ data.percent }}%"></div></div> <# } else if ( 'image' === data.type && data.size && data.size.url ) { #> <div class="centered"> <img src="{{ data.size.url }}" draggable="false" alt="" /> </div> <# } else { #> <div class="centered"> <# if ( data.image && data.image.src && data.image.src !== data.icon ) { #> <img src="{{ data.image.src }}" class="thumbnail" draggable="false" alt="" /> <# } else if ( data.sizes && data.sizes.medium ) { #> <img src="{{ data.sizes.medium.url }}" class="thumbnail" draggable="false" alt="" /> <# } else { #> <img src="{{ data.icon }}" class="icon" draggable="false" alt="" /> <# } #> </div> <div class="filename"> <div>{{ data.filename }}</div> </div> <# } #> </div> <# if ( data.buttons.close ) { #> <button type="button" class="button-link attachment-close media-modal-icon"><span class="screen-reader-text"> Remove </span></button> <# } #> </div> <# if ( data.buttons.check ) { #> <button type="button" class="check" tabindex="-1"><span class="media-modal-icon"></span><span class="screen-reader-text"> Deselect </span></button> <# } #> <# var maybeReadOnly = data.can.save || data.allowLocalEdits ? '' : 'readonly'; if ( data.describe ) { if ( 'image' === data.type ) { #> <input type="text" value="{{ data.caption }}" class="describe" data-setting="caption" aria-label="Caption" placeholder="Caption…" {{ maybeReadOnly }} /> <# } else { #> <input type="text" value="{{ data.title }}" class="describe" data-setting="title" <# if ( 'video' === data.type ) { #> aria-label="Video title" placeholder="Video title…" <# } else if ( 'audio' === data.type ) { #> aria-label="Audio title" placeholder="Audio title…" <# } else { #> aria-label="Media title" placeholder="Media title…" <# } #> {{ maybeReadOnly }} /> <# } } #> </script> <script type="text/html" id="tmpl-attachment-details"> <h2> Attachment Details <span class="settings-save-status" role="status"> <span class="spinner"></span> <span class="saved">Saved.</span> </span> </h2> <div class="attachment-info"> <# if ( 'audio' === data.type ) { #> <div class="wp-media-wrapper wp-audio"> <audio style="visibility: hidden" controls class="wp-audio-shortcode" width="100%" preload="none"> <source type="{{ data.mime }}" src="{{ data.url }}" /> </audio> </div> <# } else if ( 'video' === data.type ) { var w_rule = ''; if ( data.width ) { w_rule = 'width: ' + data.width + 'px;'; } else if ( wp.media.view.settings.contentWidth ) { w_rule = 'width: ' + wp.media.view.settings.contentWidth + 'px;'; } #> <div style="{{ w_rule }}" class="wp-media-wrapper wp-video"> <video controls="controls" class="wp-video-shortcode" preload="metadata" <# if ( data.width ) { #>width="{{ data.width }}"<# } #> <# if ( data.height ) { #>height="{{ data.height }}"<# } #> <# if ( data.image && data.image.src !== data.icon ) { #>poster="{{ data.image.src }}"<# } #>> <source type="{{ data.mime }}" src="{{ data.url }}" /> </video> </div> <# } else { #> <div class="thumbnail thumbnail-{{ data.type }}"> <# if ( data.uploading ) { #> <div class="media-progress-bar"><div></div></div> <# } else if ( 'image' === data.type && data.size && data.size.url ) { #> <img src="{{ data.size.url }}" draggable="false" alt="" /> <# } else { #> <img src="{{ data.icon }}" class="icon" draggable="false" alt="" /> <# } #> </div> <# } #> <div class="details"> <div class="filename">{{ data.filename }}</div> <div class="uploaded">{{ data.dateFormatted }}</div> <div class="file-size">{{ data.filesizeHumanReadable }}</div> <# if ( 'image' === data.type && ! data.uploading ) { #> <# if ( data.width && data.height ) { #> <div class="dimensions"> {{ data.width }} by {{ data.height }} pixels </div> <# } #> <# if ( data.originalImageURL && data.originalImageName ) { #> <div class="word-wrap-break-word"> Original image: <a href="{{ data.originalImageURL }}">{{data.originalImageName}}</a> </div> <# } #> <# if ( data.can.save && data.sizes ) { #> <a class="edit-attachment" href="{{ data.editLink }}&image-editor" target="_blank">Edit Image</a> <# } #> <# } #> <# if ( data.fileLength && data.fileLengthHumanReadable ) { #> <div class="file-length">Length: <span aria-hidden="true">{{ data.fileLength }}</span> <span class="screen-reader-text">{{ data.fileLengthHumanReadable }}</span> </div> <# } #> <# if ( data.mediaStates ) { #> <div class="media-states"><strong>Used as:</strong> {{ data.mediaStates }}</div> <# } #> <# if ( ! data.uploading && data.can.remove ) { #> <button type="button" class="button-link delete-attachment">Delete permanently</button> <# } #> <div class="compat-meta"> <# if ( data.compat && data.compat.meta ) { #> {{{ data.compat.meta }}} <# } #> </div> </div> </div> <# var maybeReadOnly = data.can.save || data.allowLocalEdits ? '' : 'readonly'; #> <# if ( 'image' === data.type ) { #> <span class="setting alt-text has-description" data-setting="alt"> <label for="attachment-details-alt-text" class="name">Alt Text</label> <textarea id="attachment-details-alt-text" aria-describedby="alt-text-description" {{ maybeReadOnly }}>{{ data.alt }}</textarea> </span> <p class="description" id="alt-text-description"><a href="https://www.w3.org/WAI/tutorials/images/decision-tree" target="_blank" rel="noopener">Learn how to describe the purpose of the image<span class="screen-reader-text"> (opens in a new tab)</span></a>. Leave empty if the image is purely decorative.</p> <# } #> <span class="setting" data-setting="title"> <label for="attachment-details-title" class="name">Title</label> <input type="text" id="attachment-details-title" value="{{ data.title }}" {{ maybeReadOnly }} /> </span> <# if ( 'audio' === data.type ) { #> <span class="setting" data-setting="artist"> <label for="attachment-details-artist" class="name">Artist</label> <input type="text" id="attachment-details-artist" value="{{ data.artist || data.meta.artist || '' }}" /> </span> <span class="setting" data-setting="album"> <label for="attachment-details-album" class="name">Album</label> <input type="text" id="attachment-details-album" value="{{ data.album || data.meta.album || '' }}" /> </span> <# } #> <span class="setting" data-setting="caption"> <label for="attachment-details-caption" class="name">Caption</label> <textarea id="attachment-details-caption" {{ maybeReadOnly }}>{{ data.caption }}</textarea> </span> <span class="setting" data-setting="description"> <label for="attachment-details-description" class="name">Description</label> <textarea id="attachment-details-description" {{ maybeReadOnly }}>{{ data.description }}</textarea> </span> <span class="setting" data-setting="url"> <label for="attachment-details-copy-link" class="name">File URL:</label> <input type="text" class="attachment-details-copy-link" id="attachment-details-copy-link" value="{{ data.url }}" readonly /> <div class="copy-to-clipboard-container"> <button type="button" class="button button-small copy-attachment-url" data-clipboard-target="#attachment-details-copy-link">Copy URL to clipboard</button> <span class="success hidden" aria-hidden="true">Copied!</span> </div> </span> </script> <script type="text/html" id="tmpl-media-selection"> <div class="selection-info"> <span class="count"></span> <# if ( data.editable ) { #> <button type="button" class="button-link edit-selection">Edit Selection</button> <# } #> <# if ( data.clearable ) { #> <button type="button" class="button-link clear-selection">Clear</button> <# } #> </div> <div class="selection-view"></div> </script> <script type="text/html" id="tmpl-attachment-display-settings"> <h2>Attachment Display Settings</h2> <# if ( 'image' === data.type ) { #> <span class="setting align"> <label for="attachment-display-settings-alignment" class="name">Alignment</label> <select id="attachment-display-settings-alignment" class="alignment" data-setting="align" <# if ( data.userSettings ) { #> data-user-setting="align" <# } #>> <option value="left"> Left </option> <option value="center"> Center </option> <option value="right"> Right </option> <option value="none" selected> None </option> </select> </span> <# } #> <span class="setting"> <label for="attachment-display-settings-link-to" class="name"> <# if ( data.model.canEmbed ) { #> Embed or Link <# } else { #> Link To <# } #> </label> <select id="attachment-display-settings-link-to" class="link-to" data-setting="link" <# if ( data.userSettings && ! data.model.canEmbed ) { #> data-user-setting="urlbutton" <# } #>> <# if ( data.model.canEmbed ) { #> <option value="embed" selected> Embed Media Player </option> <option value="file"> <# } else { #> <option value="none" selected> None </option> <option value="file"> <# } #> <# if ( data.model.canEmbed ) { #> Link to Media File <# } else { #> Media File <# } #> </option> <option value="post"> <# if ( data.model.canEmbed ) { #> Link to Attachment Page <# } else { #> Attachment Page <# } #> </option> <# if ( 'image' === data.type ) { #> <option value="custom"> Custom URL </option> <# } #> </select> </span> <span class="setting"> <label for="attachment-display-settings-link-to-custom" class="name">URL</label> <input type="text" id="attachment-display-settings-link-to-custom" class="link-to-custom" data-setting="linkUrl" /> </span> <# if ( 'undefined' !== typeof data.sizes ) { #> <span class="setting"> <label for="attachment-display-settings-size" class="name">Size</label> <select id="attachment-display-settings-size" class="size" name="size" data-setting="size" <# if ( data.userSettings ) { #> data-user-setting="imgsize" <# } #>> <# var size = data.sizes['thumbnail']; if ( size ) { #> <option value="thumbnail" > Thumbnail – {{ size.width }} × {{ size.height }} </option> <# } #> <# var size = data.sizes['medium']; if ( size ) { #> <option value="medium" > Medium – {{ size.width }} × {{ size.height }} </option> <# } #> <# var size = data.sizes['large']; if ( size ) { #> <option value="large" > Large – {{ size.width }} × {{ size.height }} </option> <# } #> <# var size = data.sizes['full']; if ( size ) { #> <option value="full" selected='selected'> Full Size – {{ size.width }} × {{ size.height }} </option> <# } #> </select> </span> <# } #> </script> <script type="text/html" id="tmpl-gallery-settings"> <h2>Gallery Settings</h2> <span class="setting"> <label for="gallery-settings-link-to" class="name">Link To</label> <select id="gallery-settings-link-to" class="link-to" data-setting="link" <# if ( data.userSettings ) { #> data-user-setting="urlbutton" <# } #>> <option value="post" <# if ( ! wp.media.galleryDefaults.link || 'post' === wp.media.galleryDefaults.link ) { #>selected="selected"<# } #>> Attachment Page </option> <option value="file" <# if ( 'file' === wp.media.galleryDefaults.link ) { #>selected="selected"<# } #>> Media File </option> <option value="none" <# if ( 'none' === wp.media.galleryDefaults.link ) { #>selected="selected"<# } #>> None </option> </select> </span> <span class="setting"> <label for="gallery-settings-columns" class="name select-label-inline">Columns</label> <select id="gallery-settings-columns" class="columns" name="columns" data-setting="columns"> <option value="1" <# if ( 1 == wp.media.galleryDefaults.columns ) { #>selected="selected"<# } #>> 1 </option> <option value="2" <# if ( 2 == wp.media.galleryDefaults.columns ) { #>selected="selected"<# } #>> 2 </option> <option value="3" <# if ( 3 == wp.media.galleryDefaults.columns ) { #>selected="selected"<# } #>> 3 </option> <option value="4" <# if ( 4 == wp.media.galleryDefaults.columns ) { #>selected="selected"<# } #>> 4 </option> <option value="5" <# if ( 5 == wp.media.galleryDefaults.columns ) { #>selected="selected"<# } #>> 5 </option> <option value="6" <# if ( 6 == wp.media.galleryDefaults.columns ) { #>selected="selected"<# } #>> 6 </option> <option value="7" <# if ( 7 == wp.media.galleryDefaults.columns ) { #>selected="selected"<# } #>> 7 </option> <option value="8" <# if ( 8 == wp.media.galleryDefaults.columns ) { #>selected="selected"<# } #>> 8 </option> <option value="9" <# if ( 9 == wp.media.galleryDefaults.columns ) { #>selected="selected"<# } #>> 9 </option> </select> </span> <span class="setting"> <input type="checkbox" id="gallery-settings-random-order" data-setting="_orderbyRandom" /> <label for="gallery-settings-random-order" class="checkbox-label-inline">Random Order</label> </span> <span class="setting size"> <label for="gallery-settings-size" class="name">Size</label> <select id="gallery-settings-size" class="size" name="size" data-setting="size" <# if ( data.userSettings ) { #> data-user-setting="imgsize" <# } #> > <option value="thumbnail"> Thumbnail </option> <option value="medium"> Medium </option> <option value="large"> Large </option> <option value="full"> Full Size </option> </select> </span> </script> <script type="text/html" id="tmpl-playlist-settings"> <h2>Playlist Settings</h2> <# var emptyModel = _.isEmpty( data.model ), isVideo = 'video' === data.controller.get('library').props.get('type'); #> <span class="setting"> <input type="checkbox" id="playlist-settings-show-list" data-setting="tracklist" <# if ( emptyModel ) { #> checked="checked" <# } #> /> <label for="playlist-settings-show-list" class="checkbox-label-inline"> <# if ( isVideo ) { #> Show Video List <# } else { #> Show Tracklist <# } #> </label> </span> <# if ( ! isVideo ) { #> <span class="setting"> <input type="checkbox" id="playlist-settings-show-artist" data-setting="artists" <# if ( emptyModel ) { #> checked="checked" <# } #> /> <label for="playlist-settings-show-artist" class="checkbox-label-inline"> Show Artist Name in Tracklist </label> </span> <# } #> <span class="setting"> <input type="checkbox" id="playlist-settings-show-images" data-setting="images" <# if ( emptyModel ) { #> checked="checked" <# } #> /> <label for="playlist-settings-show-images" class="checkbox-label-inline"> Show Images </label> </span> </script> <script type="text/html" id="tmpl-embed-link-settings"> <span class="setting link-text"> <label for="embed-link-settings-link-text" class="name">Link Text</label> <input type="text" id="embed-link-settings-link-text" class="alignment" data-setting="linkText" /> </span> <div class="embed-container" style="display: none;"> <div class="embed-preview"></div> </div> </script> <script type="text/html" id="tmpl-embed-image-settings"> <div class="wp-clearfix"> <div class="thumbnail"> <img src="{{ data.model.url }}" draggable="false" alt="" /> </div> </div> <span class="setting alt-text has-description"> <label for="embed-image-settings-alt-text" class="name">Alternative Text</label> <textarea id="embed-image-settings-alt-text" data-setting="alt" aria-describedby="alt-text-description"></textarea> </span> <p class="description" id="alt-text-description"><a href="https://www.w3.org/WAI/tutorials/images/decision-tree" target="_blank" rel="noopener">Learn how to describe the purpose of the image<span class="screen-reader-text"> (opens in a new tab)</span></a>. Leave empty if the image is purely decorative.</p> <span class="setting caption"> <label for="embed-image-settings-caption" class="name">Caption</label> <textarea id="embed-image-settings-caption" data-setting="caption"></textarea> </span> <fieldset class="setting-group"> <legend class="name">Align</legend> <span class="setting align"> <span class="button-group button-large" data-setting="align"> <button class="button" value="left"> Left </button> <button class="button" value="center"> Center </button> <button class="button" value="right"> Right </button> <button class="button active" value="none"> None </button> </span> </span> </fieldset> <fieldset class="setting-group"> <legend class="name">Link To</legend> <span class="setting link-to"> <span class="button-group button-large" data-setting="link"> <button class="button" value="file"> Image URL </button> <button class="button" value="custom"> Custom URL </button> <button class="button active" value="none"> None </button> </span> </span> <span class="setting"> <label for="embed-image-settings-link-to-custom" class="name">URL</label> <input type="text" id="embed-image-settings-link-to-custom" class="link-to-custom" data-setting="linkUrl" /> </span> </fieldset> </script> <script type="text/html" id="tmpl-image-details"> <div class="media-embed"> <div class="embed-media-settings"> <div class="column-settings"> <span class="setting alt-text has-description"> <label for="image-details-alt-text" class="name">Alternative Text</label> <textarea id="image-details-alt-text" data-setting="alt" aria-describedby="alt-text-description">{{ data.model.alt }}</textarea> </span> <p class="description" id="alt-text-description"><a href="https://www.w3.org/WAI/tutorials/images/decision-tree" target="_blank" rel="noopener">Learn how to describe the purpose of the image<span class="screen-reader-text"> (opens in a new tab)</span></a>. Leave empty if the image is purely decorative.</p> <span class="setting caption"> <label for="image-details-caption" class="name">Caption</label> <textarea id="image-details-caption" data-setting="caption">{{ data.model.caption }}</textarea> </span> <h2>Display Settings</h2> <fieldset class="setting-group"> <legend class="legend-inline">Align</legend> <span class="setting align"> <span class="button-group button-large" data-setting="align"> <button class="button" value="left"> Left </button> <button class="button" value="center"> Center </button> <button class="button" value="right"> Right </button> <button class="button active" value="none"> None </button> </span> </span> </fieldset> <# if ( data.attachment ) { #> <# if ( 'undefined' !== typeof data.attachment.sizes ) { #> <span class="setting size"> <label for="image-details-size" class="name">Size</label> <select id="image-details-size" class="size" name="size" data-setting="size" <# if ( data.userSettings ) { #> data-user-setting="imgsize" <# } #>> <# var size = data.sizes['thumbnail']; if ( size ) { #> <option value="thumbnail"> Thumbnail – {{ size.width }} × {{ size.height }} </option> <# } #> <# var size = data.sizes['medium']; if ( size ) { #> <option value="medium"> Medium – {{ size.width }} × {{ size.height }} </option> <# } #> <# var size = data.sizes['large']; if ( size ) { #> <option value="large"> Large – {{ size.width }} × {{ size.height }} </option> <# } #> <# var size = data.sizes['full']; if ( size ) { #> <option value="full"> Full Size – {{ size.width }} × {{ size.height }} </option> <# } #> <option value="custom"> Custom Size </option> </select> </span> <# } #> <div class="custom-size wp-clearfix<# if ( data.model.size !== 'custom' ) { #> hidden<# } #>"> <span class="custom-size-setting"> <label for="image-details-size-width">Width</label> <input type="number" id="image-details-size-width" aria-describedby="image-size-desc" data-setting="customWidth" step="1" value="{{ data.model.customWidth }}" /> </span> <span class="sep" aria-hidden="true">×</span> <span class="custom-size-setting"> <label for="image-details-size-height">Height</label> <input type="number" id="image-details-size-height" aria-describedby="image-size-desc" data-setting="customHeight" step="1" value="{{ data.model.customHeight }}" /> </span> <p id="image-size-desc" class="description">Image size in pixels</p> </div> <# } #> <span class="setting link-to"> <label for="image-details-link-to" class="name">Link To</label> <select id="image-details-link-to" data-setting="link"> <# if ( data.attachment ) { #> <option value="file"> Media File </option> <option value="post"> Attachment Page </option> <# } else { #> <option value="file"> Image URL </option> <# } #> <option value="custom"> Custom URL </option> <option value="none"> None </option> </select> </span> <span class="setting"> <label for="image-details-link-to-custom" class="name">URL</label> <input type="text" id="image-details-link-to-custom" class="link-to-custom" data-setting="linkUrl" /> </span> <div class="advanced-section"> <h2><button type="button" class="button-link advanced-toggle">Advanced Options</button></h2> <div class="advanced-settings hidden"> <div class="advanced-image"> <span class="setting title-text"> <label for="image-details-title-attribute" class="name">Image Title Attribute</label> <input type="text" id="image-details-title-attribute" data-setting="title" value="{{ data.model.title }}" /> </span> <span class="setting extra-classes"> <label for="image-details-css-class" class="name">Image CSS Class</label> <input type="text" id="image-details-css-class" data-setting="extraClasses" value="{{ data.model.extraClasses }}" /> </span> </div> <div class="advanced-link"> <span class="setting link-target"> <input type="checkbox" id="image-details-link-target" data-setting="linkTargetBlank" value="_blank" <# if ( data.model.linkTargetBlank ) { #>checked="checked"<# } #>> <label for="image-details-link-target" class="checkbox-label">Open link in a new tab</label> </span> <span class="setting link-rel"> <label for="image-details-link-rel" class="name">Link Rel</label> <input type="text" id="image-details-link-rel" data-setting="linkRel" value="{{ data.model.linkRel }}" /> </span> <span class="setting link-class-name"> <label for="image-details-link-css-class" class="name">Link CSS Class</label> <input type="text" id="image-details-link-css-class" data-setting="linkClassName" value="{{ data.model.linkClassName }}" /> </span> </div> </div> </div> </div> <div class="column-image"> <div class="image"> <img src="{{ data.model.url }}" draggable="false" alt="" /> <# if ( data.attachment && window.imageEdit ) { #> <div class="actions"> <input type="button" class="edit-attachment button" value="Edit Original" /> <input type="button" class="replace-attachment button" value="Replace" /> </div> <# } #> </div> </div> </div> </div> </script> <script type="text/html" id="tmpl-image-editor"> <div id="media-head-{{ data.id }}"></div> <div id="image-editor-{{ data.id }}"></div> </script> <script type="text/html" id="tmpl-audio-details"> <# var ext, html5types = { mp3: wp.media.view.settings.embedMimes.mp3, ogg: wp.media.view.settings.embedMimes.ogg }; #> <div class="media-embed media-embed-details"> <div class="embed-media-settings embed-audio-settings"> <audio style="visibility: hidden" controls class="wp-audio-shortcode" width="{{ _.isUndefined( data.model.width ) ? 400 : data.model.width }}" preload="{{ _.isUndefined( data.model.preload ) ? 'none' : data.model.preload }}" <# if ( ! _.isUndefined( data.model.autoplay ) && data.model.autoplay ) { #> autoplay<# } if ( ! _.isUndefined( data.model.loop ) && data.model.loop ) { #> loop<# } #> > <# if ( ! _.isEmpty( data.model.src ) ) { #> <source src="{{ data.model.src }}" type="{{ wp.media.view.settings.embedMimes[ data.model.src.split('.').pop() ] }}" /> <# } #> <# if ( ! _.isEmpty( data.model.mp3 ) ) { #> <source src="{{ data.model.mp3 }}" type="{{ wp.media.view.settings.embedMimes[ 'mp3' ] }}" /> <# } #> <# if ( ! _.isEmpty( data.model.ogg ) ) { #> <source src="{{ data.model.ogg }}" type="{{ wp.media.view.settings.embedMimes[ 'ogg' ] }}" /> <# } #> <# if ( ! _.isEmpty( data.model.flac ) ) { #> <source src="{{ data.model.flac }}" type="{{ wp.media.view.settings.embedMimes[ 'flac' ] }}" /> <# } #> <# if ( ! _.isEmpty( data.model.m4a ) ) { #> <source src="{{ data.model.m4a }}" type="{{ wp.media.view.settings.embedMimes[ 'm4a' ] }}" /> <# } #> <# if ( ! _.isEmpty( data.model.wav ) ) { #> <source src="{{ data.model.wav }}" type="{{ wp.media.view.settings.embedMimes[ 'wav' ] }}" /> <# } #> </audio> <# if ( ! _.isEmpty( data.model.src ) ) { ext = data.model.src.split('.').pop(); if ( html5types[ ext ] ) { delete html5types[ ext ]; } #> <span class="setting"> <label for="audio-details-source" class="name">URL</label> <input type="text" id="audio-details-source" readonly data-setting="src" value="{{ data.model.src }}" /> <button type="button" class="button-link remove-setting">Remove audio source</button> </span> <# } #> <# if ( ! _.isEmpty( data.model.mp3 ) ) { if ( ! _.isUndefined( html5types.mp3 ) ) { delete html5types.mp3; } #> <span class="setting"> <label for="audio-details-mp3-source" class="name">MP3</label> <input type="text" id="audio-details-mp3-source" readonly data-setting="mp3" value="{{ data.model.mp3 }}" /> <button type="button" class="button-link remove-setting">Remove audio source</button> </span> <# } #> <# if ( ! _.isEmpty( data.model.ogg ) ) { if ( ! _.isUndefined( html5types.ogg ) ) { delete html5types.ogg; } #> <span class="setting"> <label for="audio-details-ogg-source" class="name">OGG</label> <input type="text" id="audio-details-ogg-source" readonly data-setting="ogg" value="{{ data.model.ogg }}" /> <button type="button" class="button-link remove-setting">Remove audio source</button> </span> <# } #> <# if ( ! _.isEmpty( data.model.flac ) ) { if ( ! _.isUndefined( html5types.flac ) ) { delete html5types.flac; } #> <span class="setting"> <label for="audio-details-flac-source" class="name">FLAC</label> <input type="text" id="audio-details-flac-source" readonly data-setting="flac" value="{{ data.model.flac }}" /> <button type="button" class="button-link remove-setting">Remove audio source</button> </span> <# } #> <# if ( ! _.isEmpty( data.model.m4a ) ) { if ( ! _.isUndefined( html5types.m4a ) ) { delete html5types.m4a; } #> <span class="setting"> <label for="audio-details-m4a-source" class="name">M4A</label> <input type="text" id="audio-details-m4a-source" readonly data-setting="m4a" value="{{ data.model.m4a }}" /> <button type="button" class="button-link remove-setting">Remove audio source</button> </span> <# } #> <# if ( ! _.isEmpty( data.model.wav ) ) { if ( ! _.isUndefined( html5types.wav ) ) { delete html5types.wav; } #> <span class="setting"> <label for="audio-details-wav-source" class="name">WAV</label> <input type="text" id="audio-details-wav-source" readonly data-setting="wav" value="{{ data.model.wav }}" /> <button type="button" class="button-link remove-setting">Remove audio source</button> </span> <# } #> <# if ( ! _.isEmpty( html5types ) ) { #> <fieldset class="setting-group"> <legend class="name">Add alternate sources for maximum HTML5 playback</legend> <span class="setting"> <span class="button-large"> <# _.each( html5types, function (mime, type) { #> <button class="button add-media-source" data-mime="{{ mime }}">{{ type }}</button> <# } ) #> </span> </span> </fieldset> <# } #> <fieldset class="setting-group"> <legend class="name">Preload</legend> <span class="setting preload"> <span class="button-group button-large" data-setting="preload"> <button class="button" value="auto">Auto</button> <button class="button" value="metadata">Metadata</button> <button class="button active" value="none">None</button> </span> </span> </fieldset> <span class="setting-group"> <span class="setting checkbox-setting autoplay"> <input type="checkbox" id="audio-details-autoplay" data-setting="autoplay" /> <label for="audio-details-autoplay" class="checkbox-label">Autoplay</label> </span> <span class="setting checkbox-setting"> <input type="checkbox" id="audio-details-loop" data-setting="loop" /> <label for="audio-details-loop" class="checkbox-label">Loop</label> </span> </span> </div> </div> </script> <script type="text/html" id="tmpl-video-details"> <# var ext, html5types = { mp4: wp.media.view.settings.embedMimes.mp4, ogv: wp.media.view.settings.embedMimes.ogv, webm: wp.media.view.settings.embedMimes.webm }; #> <div class="media-embed media-embed-details"> <div class="embed-media-settings embed-video-settings"> <div class="wp-video-holder"> <# var w = ! data.model.width || data.model.width > 640 ? 640 : data.model.width, h = ! data.model.height ? 360 : data.model.height; if ( data.model.width && w !== data.model.width ) { h = Math.ceil( ( h * w ) / data.model.width ); } #> <# var w_rule = '', classes = [], w, h, settings = wp.media.view.settings, isYouTube = isVimeo = false; if ( ! _.isEmpty( data.model.src ) ) { isYouTube = data.model.src.match(/youtube|youtu\.be/); isVimeo = -1 !== data.model.src.indexOf('vimeo'); } if ( settings.contentWidth && data.model.width >= settings.contentWidth ) { w = settings.contentWidth; } else { w = data.model.width; } if ( w !== data.model.width ) { h = Math.ceil( ( data.model.height * w ) / data.model.width ); } else { h = data.model.height; } if ( w ) { w_rule = 'width: ' + w + 'px; '; } if ( isYouTube ) { classes.push( 'youtube-video' ); } if ( isVimeo ) { classes.push( 'vimeo-video' ); } #> <div style="{{ w_rule }}" class="wp-video"> <video controls class="wp-video-shortcode {{ classes.join( ' ' ) }}" <# if ( w ) { #>width="{{ w }}"<# } #> <# if ( h ) { #>height="{{ h }}"<# } #> <# if ( ! _.isUndefined( data.model.poster ) && data.model.poster ) { #> poster="{{ data.model.poster }}"<# } #> preload ="{{ _.isUndefined( data.model.preload ) ? 'metadata' : data.model.preload }}" <# if ( ! _.isUndefined( data.model.autoplay ) && data.model.autoplay ) { #> autoplay<# } if ( ! _.isUndefined( data.model.loop ) && data.model.loop ) { #> loop<# } #> > <# if ( ! _.isEmpty( data.model.src ) ) { if ( isYouTube ) { #> <source src="{{ data.model.src }}" type="video/youtube" /> <# } else if ( isVimeo ) { #> <source src="{{ data.model.src }}" type="video/vimeo" /> <# } else { #> <source src="{{ data.model.src }}" type="{{ settings.embedMimes[ data.model.src.split('.').pop() ] }}" /> <# } } #> <# if ( data.model.mp4 ) { #> <source src="{{ data.model.mp4 }}" type="{{ settings.embedMimes[ 'mp4' ] }}" /> <# } #> <# if ( data.model.m4v ) { #> <source src="{{ data.model.m4v }}" type="{{ settings.embedMimes[ 'm4v' ] }}" /> <# } #> <# if ( data.model.webm ) { #> <source src="{{ data.model.webm }}" type="{{ settings.embedMimes[ 'webm' ] }}" /> <# } #> <# if ( data.model.ogv ) { #> <source src="{{ data.model.ogv }}" type="{{ settings.embedMimes[ 'ogv' ] }}" /> <# } #> <# if ( data.model.flv ) { #> <source src="{{ data.model.flv }}" type="{{ settings.embedMimes[ 'flv' ] }}" /> <# } #> {{{ data.model.content }}} </video> </div> <# if ( ! _.isEmpty( data.model.src ) ) { ext = data.model.src.split('.').pop(); if ( html5types[ ext ] ) { delete html5types[ ext ]; } #> <span class="setting"> <label for="video-details-source" class="name">URL</label> <input type="text" id="video-details-source" readonly data-setting="src" value="{{ data.model.src }}" /> <button type="button" class="button-link remove-setting">Remove video source</button> </span> <# } #> <# if ( ! _.isEmpty( data.model.mp4 ) ) { if ( ! _.isUndefined( html5types.mp4 ) ) { delete html5types.mp4; } #> <span class="setting"> <label for="video-details-mp4-source" class="name">MP4</label> <input type="text" id="video-details-mp4-source" readonly data-setting="mp4" value="{{ data.model.mp4 }}" /> <button type="button" class="button-link remove-setting">Remove video source</button> </span> <# } #> <# if ( ! _.isEmpty( data.model.m4v ) ) { if ( ! _.isUndefined( html5types.m4v ) ) { delete html5types.m4v; } #> <span class="setting"> <label for="video-details-m4v-source" class="name">M4V</label> <input type="text" id="video-details-m4v-source" readonly data-setting="m4v" value="{{ data.model.m4v }}" /> <button type="button" class="button-link remove-setting">Remove video source</button> </span> <# } #> <# if ( ! _.isEmpty( data.model.webm ) ) { if ( ! _.isUndefined( html5types.webm ) ) { delete html5types.webm; } #> <span class="setting"> <label for="video-details-webm-source" class="name">WEBM</label> <input type="text" id="video-details-webm-source" readonly data-setting="webm" value="{{ data.model.webm }}" /> <button type="button" class="button-link remove-setting">Remove video source</button> </span> <# } #> <# if ( ! _.isEmpty( data.model.ogv ) ) { if ( ! _.isUndefined( html5types.ogv ) ) { delete html5types.ogv; } #> <span class="setting"> <label for="video-details-ogv-source" class="name">OGV</label> <input type="text" id="video-details-ogv-source" readonly data-setting="ogv" value="{{ data.model.ogv }}" /> <button type="button" class="button-link remove-setting">Remove video source</button> </span> <# } #> <# if ( ! _.isEmpty( data.model.flv ) ) { if ( ! _.isUndefined( html5types.flv ) ) { delete html5types.flv; } #> <span class="setting"> <label for="video-details-flv-source" class="name">FLV</label> <input type="text" id="video-details-flv-source" readonly data-setting="flv" value="{{ data.model.flv }}" /> <button type="button" class="button-link remove-setting">Remove video source</button> </span> <# } #> </div> <# if ( ! _.isEmpty( html5types ) ) { #> <fieldset class="setting-group"> <legend class="name">Add alternate sources for maximum HTML5 playback</legend> <span class="setting"> <span class="button-large"> <# _.each( html5types, function (mime, type) { #> <button class="button add-media-source" data-mime="{{ mime }}">{{ type }}</button> <# } ) #> </span> </span> </fieldset> <# } #> <# if ( ! _.isEmpty( data.model.poster ) ) { #> <span class="setting"> <label for="video-details-poster-image" class="name">Poster Image</label> <input type="text" id="video-details-poster-image" readonly data-setting="poster" value="{{ data.model.poster }}" /> <button type="button" class="button-link remove-setting">Remove poster image</button> </span> <# } #> <fieldset class="setting-group"> <legend class="name">Preload</legend> <span class="setting preload"> <span class="button-group button-large" data-setting="preload"> <button class="button" value="auto">Auto</button> <button class="button" value="metadata">Metadata</button> <button class="button active" value="none">None</button> </span> </span> </fieldset> <span class="setting-group"> <span class="setting checkbox-setting autoplay"> <input type="checkbox" id="video-details-autoplay" data-setting="autoplay" /> <label for="video-details-autoplay" class="checkbox-label">Autoplay</label> </span> <span class="setting checkbox-setting"> <input type="checkbox" id="video-details-loop" data-setting="loop" /> <label for="video-details-loop" class="checkbox-label">Loop</label> </span> </span> <span class="setting" data-setting="content"> <# var content = ''; if ( ! _.isEmpty( data.model.content ) ) { var tracks = jQuery( data.model.content ).filter( 'track' ); _.each( tracks.toArray(), function( track, index ) { content += track.outerHTML; #> <label for="video-details-track-{{ index }}" class="name">Tracks (subtitles, captions, descriptions, chapters, or metadata)</label> <input class="content-track" type="text" id="video-details-track-{{ index }}" aria-describedby="video-details-track-desc-{{ index }}" value="{{ track.outerHTML }}" /> <span class="description" id="video-details-track-desc-{{ index }}"> The srclang, label, and kind values can be edited to set the video track language and kind. </span> <button type="button" class="button-link remove-setting remove-track">Remove video track</button><br /> <# } ); #> <# } else { #> <span class="name">Tracks (subtitles, captions, descriptions, chapters, or metadata)</span><br /> <em>There are no associated subtitles.</em> <# } #> <textarea class="hidden content-setting">{{ content }}</textarea> </span> </div> </div> </script> <script type="text/html" id="tmpl-editor-gallery"> <# if ( data.attachments.length ) { #> <div class="gallery gallery-columns-{{ data.columns }}"> <# _.each( data.attachments, function( attachment, index ) { #> <dl class="gallery-item"> <dt class="gallery-icon"> <# if ( attachment.thumbnail ) { #> <img src="{{ attachment.thumbnail.url }}" width="{{ attachment.thumbnail.width }}" height="{{ attachment.thumbnail.height }}" alt="{{ attachment.alt }}" /> <# } else { #> <img src="{{ attachment.url }}" alt="{{ attachment.alt }}" /> <# } #> </dt> <# if ( attachment.caption ) { #> <dd class="wp-caption-text gallery-caption"> {{{ data.verifyHTML( attachment.caption ) }}} </dd> <# } #> </dl> <# if ( index % data.columns === data.columns - 1 ) { #> <br style="clear: both;" /> <# } #> <# } ); #> </div> <# } else { #> <div class="wpview-error"> <div class="dashicons dashicons-format-gallery"></div><p>No items found.</p> </div> <# } #> </script> <script type="text/html" id="tmpl-crop-content"> <img class="crop-image" src="{{ data.url }}" alt="Image crop area preview. Requires mouse interaction." /> <div class="upload-errors"></div> </script> <script type="text/html" id="tmpl-site-icon-preview"> <h2>Preview</h2> <strong aria-hidden="true">As a browser icon</strong> <div class="favicon-preview"> <img src="https://www.cozmoslabs.com/wp-admin/images/browser.png" class="browser-preview" width="182" height="" alt="" /> <div class="favicon"> <img id="preview-favicon" src="{{ data.url }}" alt="Preview as a browser icon" /> </div> <span class="browser-title" aria-hidden="true"><# print( 'Cozmoslabs' ) #></span> </div> <strong aria-hidden="true">As an app icon</strong> <div class="app-icon-preview"> <img id="preview-app-icon" src="{{ data.url }}" alt="Preview as an app icon" /> </div> </script> <script type="text/javascript"> /* MonsterInsights Scroll Tracking */ if ( typeof(jQuery) !== 'undefined' ) { jQuery( document ).ready(function(){ function monsterinsights_scroll_tracking_load() { if ( ( typeof(__gaTracker) !== 'undefined' && __gaTracker && __gaTracker.hasOwnProperty( "loaded" ) && __gaTracker.loaded == true ) || ( typeof(__gtagTracker) !== 'undefined' && __gtagTracker ) ) { (function(factory) { factory(jQuery); }(function($) { /* Scroll Depth */ "use strict"; var defaults = { percentage: true }; var $window = $(window), cache = [], scrollEventBound = false, lastPixelDepth = 0; /* * Plugin */ $.scrollDepth = function(options) { var startTime = +new Date(); options = $.extend({}, defaults, options); /* * Functions */ function sendEvent(action, label, scrollDistance, timing) { if ( 'undefined' === typeof MonsterInsightsObject || 'undefined' === typeof MonsterInsightsObject.sendEvent ) { return; } var paramName = action.toLowerCase(); var fieldsArray = { send_to: 'G-K7MZJ57R03', non_interaction: true }; fieldsArray[paramName] = label; if (arguments.length > 3) { fieldsArray.scroll_timing = timing MonsterInsightsObject.sendEvent('event', 'scroll_depth', fieldsArray); } else { MonsterInsightsObject.sendEvent('event', 'scroll_depth', fieldsArray); } } function calculateMarks(docHeight) { return { '25%' : parseInt(docHeight * 0.25, 10), '50%' : parseInt(docHeight * 0.50, 10), '75%' : parseInt(docHeight * 0.75, 10), /* Cushion to trigger 100% event in iOS */ '100%': docHeight - 5 }; } function checkMarks(marks, scrollDistance, timing) { /* Check each active mark */ $.each(marks, function(key, val) { if ( $.inArray(key, cache) === -1 && scrollDistance >= val ) { sendEvent('Percentage', key, scrollDistance, timing); cache.push(key); } }); } function rounded(scrollDistance) { /* Returns String */ return (Math.floor(scrollDistance/250) * 250).toString(); } function init() { bindScrollDepth(); } /* * Public Methods */ /* Reset Scroll Depth with the originally initialized options */ $.scrollDepth.reset = function() { cache = []; lastPixelDepth = 0; $window.off('scroll.scrollDepth'); bindScrollDepth(); }; /* Add DOM elements to be tracked */ $.scrollDepth.addElements = function(elems) { if (typeof elems == "undefined" || !$.isArray(elems)) { return; } $.merge(options.elements, elems); /* If scroll event has been unbound from window, rebind */ if (!scrollEventBound) { bindScrollDepth(); } }; /* Remove DOM elements currently tracked */ $.scrollDepth.removeElements = function(elems) { if (typeof elems == "undefined" || !$.isArray(elems)) { return; } $.each(elems, function(index, elem) { var inElementsArray = $.inArray(elem, options.elements); var inCacheArray = $.inArray(elem, cache); if (inElementsArray != -1) { options.elements.splice(inElementsArray, 1); } if (inCacheArray != -1) { cache.splice(inCacheArray, 1); } }); }; /* * Throttle function borrowed from: * Underscore.js 1.5.2 * http://underscorejs.org * (c) 2009-2013 Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors * Underscore may be freely distributed under the MIT license. */ function throttle(func, wait) { var context, args, result; var timeout = null; var previous = 0; var later = function() { previous = new Date; timeout = null; result = func.apply(context, args); }; return function() { var now = new Date; if (!previous) previous = now; var remaining = wait - (now - previous); context = this; args = arguments; if (remaining <= 0) { clearTimeout(timeout); timeout = null; previous = now; result = func.apply(context, args); } else if (!timeout) { timeout = setTimeout(later, remaining); } return result; }; } /* * Scroll Event */ function bindScrollDepth() { scrollEventBound = true; $window.on('scroll.scrollDepth', throttle(function() { /* * We calculate document and window height on each scroll event to * account for dynamic DOM changes. */ var docHeight = $(document).height(), winHeight = window.innerHeight ? window.innerHeight : $window.height(), scrollDistance = $window.scrollTop() + winHeight, /* Recalculate percentage marks */ marks = calculateMarks(docHeight), /* Timing */ timing = +new Date - startTime; checkMarks(marks, scrollDistance, timing); }, 500)); } init(); }; /* UMD export */ return $.scrollDepth; })); jQuery.scrollDepth(); } else { setTimeout(monsterinsights_scroll_tracking_load, 200); } } monsterinsights_scroll_tracking_load(); }); } /* End MonsterInsights Scroll Tracking */ </script><link rel='stylesheet' id='imgareaselect-css' href='https://www.cozmoslabs.com/wp-includes/js/imgareaselect/imgareaselect.css?ver=0.9.8' type='text/css' media='all' /> <link rel='stylesheet' id='codebox-css' href='https://www.cozmoslabs.com/wp-content/plugins/wp-codebox/css/codebox.css?ver=0.1' type='text/css' media='screen' /> <script type="text/javascript" id="wpil-frontend-script-js-extra"> /* <![CDATA[ */ var wpilFrontend = {"ajaxUrl":"\/wp-admin\/admin-ajax.php","postId":"201727","postType":"post","openInternalInNewTab":"0","openExternalInNewTab":"1","disableClicks":"0","openLinksWithJS":"0","trackAllElementClicks":"0","clicksI18n":{"imageNoText":"Image in link: No Text","imageText":"Image Title: ","noText":"No Anchor Text Found"}}; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-content/plugins/link-whisper-premium/js/frontend.min.js?ver=1680527855" id="wpil-frontend-script-js" defer></script> <script type="text/javascript" id="edd-ajax-js-extra"> /* <![CDATA[ */ var edd_scripts = {"ajaxurl":"https:\/\/www.cozmoslabs.com\/wp-admin\/admin-ajax.php","position_in_cart":"","has_purchase_links":"0","already_in_cart_message":"You have already added this item to your cart","empty_cart_message":"Your cart is empty","loading":"Loading","select_option":"Please select an option","is_checkout":"0","default_gateway":"stripe","redirect_to_checkout":"1","checkout_page":"https:\/\/www.cozmoslabs.com\/checkout\/?nocache=true","permalinks":"1","quantities_enabled":"","taxes_enabled":"1","current_page":"201727"}; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-content/plugins/easy-digital-downloads-pro/assets/js/edd-ajax.js?ver=3.3.4" id="edd-ajax-js" defer></script> <script type="text/javascript" id="dlm-xhr-js-extra"> /* <![CDATA[ */ var dlmXHRtranslations = {"error":"An error occurred while trying to download the file. Please try again.","not_found":"Download does not exist.","no_file_path":"No file path defined.","no_file_paths":"No file paths defined.","filetype":"Download is not allowed for this file type.","file_access_denied":"Access denied to this file.","access_denied":"Access denied. You do not have permission to download this file.","security_error":"Something is wrong with the file path.","file_not_found":"File not found."}; /* ]]> */ </script> <script type="text/javascript" id="dlm-xhr-js-before"> /* <![CDATA[ */ const dlmXHR = {"xhr_links":{"class":["download-link","download-button"]},"prevent_duplicates":true,"ajaxUrl":"https:\/\/www.cozmoslabs.com\/wp-admin\/admin-ajax.php"}; dlmXHRinstance = {}; const dlmXHRGlobalLinks = "https://www.cozmoslabs.com/download/"; const dlmNonXHRGlobalLinks = []; dlmXHRgif = "https://www.cozmoslabs.com/wp-includes/images/spinner.gif"; const dlmXHRProgress = "1" /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-content/plugins/download-monitor/assets/js/dlm-xhr.min.js?ver=4.9.11" id="dlm-xhr-js" defer></script> <script type="text/javascript" id="jaotama-window-opener-js-before"> /* <![CDATA[ */ var jaotama_window_opener_class = ".jaotama__window-opener"; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-content/themes/cozmoslabs/inc/jaotama/jaotama-window-opener.js?ver=1.0.0" id="jaotama-window-opener-js" defer></script> <script type="text/javascript" id="cozmoslabs-js-before"> /* <![CDATA[ */ var ajax_url = 'https://www.cozmoslabs.com/wp-admin/admin-ajax.php'; var assets_src = 'https://www.cozmoslabs.com/wp-content/themes/cozmoslabs/assets/dist/'; var gallery_product_info = ''; var cozmos_black_friday_banner_countdown = '12/03/2024 23:59:00'; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-content/themes/cozmoslabs/assets/dist/js/main.js" id="cozmoslabs-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-content/themes/cozmoslabs/assets/dist/js/carousels.js" id="cozmoslabs-carousels-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-content/plugins/wp-codebox/js/codebox.js?ver=0.1" id="codebox-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/underscore.min.js?ver=1.13.4" id="underscore-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/shortcode.min.js?ver=6.5.5" id="shortcode-js" defer></script> <script type="text/javascript" id="utils-js-extra"> /* <![CDATA[ */ var userSettings = {"url":"\/","uid":"0","time":"1732712951","secure":"1"}; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/utils.min.js?ver=6.5.5" id="utils-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/backbone.min.js?ver=1.5.0" id="backbone-js" defer></script> <script type="text/javascript" id="wp-util-js-extra"> /* <![CDATA[ */ var _wpUtilSettings = {"ajax":{"url":"\/wp-admin\/admin-ajax.php"}}; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/wp-util.min.js?ver=6.5.5" id="wp-util-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/wp-backbone.min.js?ver=6.5.5" id="wp-backbone-js" defer></script> <script type="text/javascript" id="media-models-js-extra"> /* <![CDATA[ */ var _wpMediaModelsL10n = {"settings":{"ajaxurl":"\/wp-admin\/admin-ajax.php","post":{"id":0}}}; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/media-models.min.js?ver=6.5.5" id="media-models-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/plupload/moxie.min.js?ver=1.3.5" id="moxiejs-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/plupload/plupload.min.js?ver=2.1.9" id="plupload-js" defer></script> <!--[if lt IE 8]> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/json2.min.js?ver=2015-05-03" id="json2-js"></script> <![endif]--> <script type="text/javascript" id="wp-plupload-js-extra"> /* <![CDATA[ */ var pluploadL10n = {"queue_limit_exceeded":"You have attempted to queue too many files.","file_exceeds_size_limit":"%s exceeds the maximum upload size for this site.","zero_byte_file":"This file is empty. Please try another.","invalid_filetype":"Sorry, you are not allowed to upload this file type.","not_an_image":"This file is not an image. Please try another.","image_memory_exceeded":"Memory exceeded. Please try another smaller file.","image_dimensions_exceeded":"This is larger than the maximum size. Please try another.","default_error":"An error occurred in the upload. Please try again later.","missing_upload_url":"There was a configuration error. Please contact the server administrator.","upload_limit_exceeded":"You may only upload 1 file.","http_error":"Unexpected response from the server. The file may have been uploaded successfully. Check in the Media Library or reload the page.","http_error_image":"The server cannot process the image. This can happen if the server is busy or does not have enough resources to complete the task. Uploading a smaller image may help. Suggested maximum size is 2560 pixels.","upload_failed":"Upload failed.","big_upload_failed":"Please try uploading this file with the %1$sbrowser uploader%2$s.","big_upload_queued":"%s exceeds the maximum upload size for the multi-file uploader when used in your browser.","io_error":"IO error.","security_error":"Security error.","file_cancelled":"File canceled.","upload_stopped":"Upload stopped.","dismiss":"Dismiss","crunching":"Crunching\u2026","deleted":"moved to the Trash.","error_uploading":"\u201c%s\u201d has failed to upload.","unsupported_image":"This image cannot be displayed in a web browser. For best results convert it to JPEG before uploading.","noneditable_image":"This image cannot be processed by the web server. Convert it to JPEG or PNG before uploading.","file_url_copied":"The file URL has been copied to your clipboard"}; var _wpPluploadSettings = {"defaults":{"file_data_name":"async-upload","url":"\/wp-admin\/async-upload.php","filters":{"max_file_size":"67108864b","mime_types":[{"extensions":"jpg,jpeg,jpe,gif,png,bmp,tiff,tif,webp,avif,ico,heic,asf,asx,wmv,wmx,wm,avi,divx,flv,mov,qt,mpeg,mpg,mpe,mp4,m4v,ogv,webm,mkv,3gp,3gpp,3g2,3gp2,txt,asc,c,cc,h,srt,csv,tsv,ics,rtx,css,vtt,dfxp,mp3,m4a,m4b,aac,ra,ram,wav,ogg,oga,flac,mid,midi,wma,wax,mka,rtf,pdf,class,tar,zip,gz,gzip,rar,7z,psd,xcf,doc,pot,pps,ppt,wri,xla,xls,xlt,xlw,mdb,mpp,docx,docm,dotx,dotm,xlsx,xlsm,xlsb,xltx,xltm,xlam,pptx,pptm,ppsx,ppsm,potx,potm,ppam,sldx,sldm,onetoc,onetoc2,onetmp,onepkg,oxps,xps,odt,odp,ods,odg,odc,odb,odf,wp,wpd,key,numbers,pages,epub,mobi,m4r,aif,aiff,exe,apk,msi"}]},"avif_upload_error":true,"heic_upload_error":true,"multipart_params":{"action":"upload-attachment","_wpnonce":"ca9db91e19"}},"browser":{"mobile":false,"supported":true},"limitExceeded":false}; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/plupload/wp-plupload.min.js?ver=6.5.5" id="wp-plupload-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/jquery/ui/core.min.js?ver=1.13.2" id="jquery-ui-core-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/jquery/ui/mouse.min.js?ver=1.13.2" id="jquery-ui-mouse-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/jquery/ui/sortable.min.js?ver=1.13.2" id="jquery-ui-sortable-js" defer></script> <script type="text/javascript" id="mediaelement-core-js-before"> /* <![CDATA[ */ var mejsL10n = {"language":"en","strings":{"mejs.download-file":"Download File","mejs.install-flash":"You are using a browser that does not have Flash player enabled or installed. Please turn on your Flash player plugin or download the latest version from https:\/\/get.adobe.com\/flashplayer\/","mejs.fullscreen":"Fullscreen","mejs.play":"Play","mejs.pause":"Pause","mejs.time-slider":"Time Slider","mejs.time-help-text":"Use Left\/Right Arrow keys to advance one second, Up\/Down arrows to advance ten seconds.","mejs.live-broadcast":"Live Broadcast","mejs.volume-help-text":"Use Up\/Down Arrow keys to increase or decrease volume.","mejs.unmute":"Unmute","mejs.mute":"Mute","mejs.volume-slider":"Volume Slider","mejs.video-player":"Video Player","mejs.audio-player":"Audio Player","mejs.captions-subtitles":"Captions\/Subtitles","mejs.captions-chapters":"Chapters","mejs.none":"None","mejs.afrikaans":"Afrikaans","mejs.albanian":"Albanian","mejs.arabic":"Arabic","mejs.belarusian":"Belarusian","mejs.bulgarian":"Bulgarian","mejs.catalan":"Catalan","mejs.chinese":"Chinese","mejs.chinese-simplified":"Chinese (Simplified)","mejs.chinese-traditional":"Chinese (Traditional)","mejs.croatian":"Croatian","mejs.czech":"Czech","mejs.danish":"Danish","mejs.dutch":"Dutch","mejs.english":"English","mejs.estonian":"Estonian","mejs.filipino":"Filipino","mejs.finnish":"Finnish","mejs.french":"French","mejs.galician":"Galician","mejs.german":"German","mejs.greek":"Greek","mejs.haitian-creole":"Haitian Creole","mejs.hebrew":"Hebrew","mejs.hindi":"Hindi","mejs.hungarian":"Hungarian","mejs.icelandic":"Icelandic","mejs.indonesian":"Indonesian","mejs.irish":"Irish","mejs.italian":"Italian","mejs.japanese":"Japanese","mejs.korean":"Korean","mejs.latvian":"Latvian","mejs.lithuanian":"Lithuanian","mejs.macedonian":"Macedonian","mejs.malay":"Malay","mejs.maltese":"Maltese","mejs.norwegian":"Norwegian","mejs.persian":"Persian","mejs.polish":"Polish","mejs.portuguese":"Portuguese","mejs.romanian":"Romanian","mejs.russian":"Russian","mejs.serbian":"Serbian","mejs.slovak":"Slovak","mejs.slovenian":"Slovenian","mejs.spanish":"Spanish","mejs.swahili":"Swahili","mejs.swedish":"Swedish","mejs.tagalog":"Tagalog","mejs.thai":"Thai","mejs.turkish":"Turkish","mejs.ukrainian":"Ukrainian","mejs.vietnamese":"Vietnamese","mejs.welsh":"Welsh","mejs.yiddish":"Yiddish"}}; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/mediaelement/mediaelement-and-player.min.js?ver=4.2.17" id="mediaelement-core-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/mediaelement/mediaelement-migrate.min.js?ver=6.5.5" id="mediaelement-migrate-js" defer></script> <script type="text/javascript" id="mediaelement-js-extra"> /* <![CDATA[ */ var _wpmejsSettings = {"pluginPath":"\/wp-includes\/js\/mediaelement\/","classPrefix":"mejs-","stretching":"responsive","audioShortcodeLibrary":"mediaelement","videoShortcodeLibrary":"mediaelement"}; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/mediaelement/wp-mediaelement.min.js?ver=6.5.5" id="wp-mediaelement-js" defer></script> <script type="text/javascript" id="wp-api-request-js-extra"> /* <![CDATA[ */ var wpApiSettings = {"root":"https:\/\/www.cozmoslabs.com\/wp-json\/","nonce":"b2ef03d06c","versionString":"wp\/v2\/"}; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/api-request.min.js?ver=6.5.5" id="wp-api-request-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/dist/vendor/wp-polyfill-inert.min.js?ver=3.1.2" id="wp-polyfill-inert-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/dist/vendor/regenerator-runtime.min.js?ver=0.14.0" id="regenerator-runtime-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/dist/vendor/wp-polyfill.min.js?ver=3.15.0" id="wp-polyfill-js"></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/dist/dom-ready.min.js?ver=f77871ff7694fffea381" id="wp-dom-ready-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/dist/hooks.min.js?ver=2810c76e705dd1a53b18" id="wp-hooks-js"></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/dist/i18n.min.js?ver=5e580eb46a90c2b997e6" id="wp-i18n-js"></script> <script type="text/javascript" id="wp-i18n-js-after"> /* <![CDATA[ */ wp.i18n.setLocaleData( { 'text direction\u0004ltr': [ 'ltr' ] } ); /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/dist/a11y.min.js?ver=d90eebea464f6c09bfd5" id="wp-a11y-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/clipboard.min.js?ver=2.0.11" id="clipboard-js" defer></script> <script type="text/javascript" id="media-views-js-extra"> /* <![CDATA[ */ var _wpMediaViewsL10n = {"mediaFrameDefaultTitle":"Media","url":"URL","addMedia":"Add media","search":"Search","select":"Select","cancel":"Cancel","update":"Update","replace":"Replace","remove":"Remove","back":"Back","selected":"%d selected","dragInfo":"Drag and drop to reorder media files.","uploadFilesTitle":"Upload files","uploadImagesTitle":"Upload images","mediaLibraryTitle":"Media Library","insertMediaTitle":"Add media","createNewGallery":"Create a new gallery","createNewPlaylist":"Create a new playlist","createNewVideoPlaylist":"Create a new video playlist","returnToLibrary":"\u2190 Go to library","allMediaItems":"All media items","allDates":"All dates","noItemsFound":"No items found.","insertIntoPost":"Insert into post","unattached":"Unattached","mine":"Mine","trash":"Trash","uploadedToThisPost":"Uploaded to this post","warnDelete":"You are about to permanently delete this item from your site.\nThis action cannot be undone.\n 'Cancel' to stop, 'OK' to delete.","warnBulkDelete":"You are about to permanently delete these items from your site.\nThis action cannot be undone.\n 'Cancel' to stop, 'OK' to delete.","warnBulkTrash":"You are about to trash these items.\n 'Cancel' to stop, 'OK' to delete.","bulkSelect":"Bulk select","trashSelected":"Move to Trash","restoreSelected":"Restore from Trash","deletePermanently":"Delete permanently","errorDeleting":"Error in deleting the attachment.","apply":"Apply","filterByDate":"Filter by date","filterByType":"Filter by type","searchLabel":"Search","searchMediaLabel":"Search media","searchMediaPlaceholder":"Search media items...","mediaFound":"Number of media items found: %d","noMedia":"No media items found.","noMediaTryNewSearch":"No media items found. Try a different search.","attachmentDetails":"Attachment details","insertFromUrlTitle":"Insert from URL","setFeaturedImageTitle":"Featured image","setFeaturedImage":"Set featured image","createGalleryTitle":"Create gallery","editGalleryTitle":"Edit gallery","cancelGalleryTitle":"\u2190 Cancel gallery","insertGallery":"Insert gallery","updateGallery":"Update gallery","addToGallery":"Add to gallery","addToGalleryTitle":"Add to gallery","reverseOrder":"Reverse order","imageDetailsTitle":"Image details","imageReplaceTitle":"Replace image","imageDetailsCancel":"Cancel edit","editImage":"Edit image","chooseImage":"Choose image","selectAndCrop":"Select and crop","skipCropping":"Skip cropping","cropImage":"Crop image","cropYourImage":"Crop your image","cropping":"Cropping\u2026","suggestedDimensions":"Suggested image dimensions: %1$s by %2$s pixels.","cropError":"There has been an error cropping your image.","audioDetailsTitle":"Audio details","audioReplaceTitle":"Replace audio","audioAddSourceTitle":"Add audio source","audioDetailsCancel":"Cancel edit","videoDetailsTitle":"Video details","videoReplaceTitle":"Replace video","videoAddSourceTitle":"Add video source","videoDetailsCancel":"Cancel edit","videoSelectPosterImageTitle":"Select poster image","videoAddTrackTitle":"Add subtitles","playlistDragInfo":"Drag and drop to reorder tracks.","createPlaylistTitle":"Create audio playlist","editPlaylistTitle":"Edit audio playlist","cancelPlaylistTitle":"\u2190 Cancel audio playlist","insertPlaylist":"Insert audio playlist","updatePlaylist":"Update audio playlist","addToPlaylist":"Add to audio playlist","addToPlaylistTitle":"Add to Audio Playlist","videoPlaylistDragInfo":"Drag and drop to reorder videos.","createVideoPlaylistTitle":"Create video playlist","editVideoPlaylistTitle":"Edit video playlist","cancelVideoPlaylistTitle":"\u2190 Cancel video playlist","insertVideoPlaylist":"Insert video playlist","updateVideoPlaylist":"Update video playlist","addToVideoPlaylist":"Add to video playlist","addToVideoPlaylistTitle":"Add to video Playlist","filterAttachments":"Filter media","attachmentsList":"Media list","settings":{"tabs":[],"tabUrl":"https:\/\/www.cozmoslabs.com\/wp-admin\/media-upload.php?chromeless=1","mimeTypes":{"image":"Images","audio":"Audio","video":"Video","application\/msword,application\/vnd.openxmlformats-officedocument.wordprocessingml.document,application\/vnd.ms-word.document.macroEnabled.12,application\/vnd.ms-word.template.macroEnabled.12,application\/vnd.oasis.opendocument.text,application\/vnd.apple.pages,application\/pdf,application\/vnd.ms-xpsdocument,application\/oxps,application\/rtf,application\/wordperfect,application\/octet-stream":"Documents","application\/vnd.apple.numbers,application\/vnd.oasis.opendocument.spreadsheet,application\/vnd.ms-excel,application\/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application\/vnd.ms-excel.sheet.macroEnabled.12,application\/vnd.ms-excel.sheet.binary.macroEnabled.12":"Spreadsheets","application\/x-gzip,application\/rar,application\/x-tar,application\/zip,application\/x-7z-compressed":"Archives"},"captions":true,"nonce":{"sendToEditor":"80243b15b3","setAttachmentThumbnail":"e1f2c5c3a0"},"post":{"id":0},"defaultProps":{"link":"","align":"","size":""},"attachmentCounts":{"audio":1,"video":1},"oEmbedProxyUrl":"https:\/\/www.cozmoslabs.com\/wp-json\/oembed\/1.0\/proxy","embedExts":["mp3","ogg","flac","m4a","wav","mp4","m4v","webm","ogv","flv"],"embedMimes":{"mp3":"audio\/mpeg","ogg":"audio\/ogg","flac":"audio\/flac","m4a":"audio\/mpeg","wav":"audio\/wav","mp4":"video\/mp4","m4v":"video\/mp4","webm":"video\/webm","ogv":"video\/ogg","flv":"video\/x-flv"},"contentWidth":null,"months":[{"year":"2024","month":"11","text":"November 2024"},{"year":"2024","month":"10","text":"October 2024"},{"year":"2024","month":"9","text":"September 2024"},{"year":"2024","month":"8","text":"August 2024"},{"year":"2024","month":"7","text":"July 2024"},{"year":"2024","month":"6","text":"June 2024"},{"year":"2024","month":"5","text":"May 2024"},{"year":"2024","month":"4","text":"April 2024"},{"year":"2024","month":"3","text":"March 2024"},{"year":"2024","month":"2","text":"February 2024"},{"year":"2024","month":"1","text":"January 2024"},{"year":"2023","month":"12","text":"December 2023"},{"year":"2023","month":"11","text":"November 2023"},{"year":"2023","month":"10","text":"October 2023"},{"year":"2023","month":"9","text":"September 2023"},{"year":"2023","month":"8","text":"August 2023"},{"year":"2023","month":"7","text":"July 2023"},{"year":"2023","month":"6","text":"June 2023"},{"year":"2023","month":"5","text":"May 2023"},{"year":"2023","month":"4","text":"April 2023"},{"year":"2023","month":"3","text":"March 2023"},{"year":"2023","month":"2","text":"February 2023"},{"year":"2023","month":"1","text":"January 2023"},{"year":"2022","month":"12","text":"December 2022"},{"year":"2022","month":"11","text":"November 2022"},{"year":"2022","month":"10","text":"October 2022"},{"year":"2022","month":"9","text":"September 2022"},{"year":"2022","month":"8","text":"August 2022"},{"year":"2022","month":"7","text":"July 2022"},{"year":"2022","month":"6","text":"June 2022"},{"year":"2022","month":"5","text":"May 2022"},{"year":"2022","month":"4","text":"April 2022"},{"year":"2022","month":"3","text":"March 2022"},{"year":"2022","month":"2","text":"February 2022"},{"year":"2022","month":"1","text":"January 2022"},{"year":"2021","month":"12","text":"December 2021"},{"year":"2021","month":"11","text":"November 2021"},{"year":"2021","month":"10","text":"October 2021"},{"year":"2021","month":"9","text":"September 2021"},{"year":"2021","month":"8","text":"August 2021"},{"year":"2021","month":"7","text":"July 2021"},{"year":"2021","month":"6","text":"June 2021"},{"year":"2021","month":"5","text":"May 2021"},{"year":"2021","month":"4","text":"April 2021"},{"year":"2021","month":"3","text":"March 2021"},{"year":"2021","month":"2","text":"February 2021"},{"year":"2021","month":"1","text":"January 2021"},{"year":"2020","month":"12","text":"December 2020"},{"year":"2020","month":"11","text":"November 2020"},{"year":"2020","month":"10","text":"October 2020"},{"year":"2020","month":"9","text":"September 2020"},{"year":"2020","month":"8","text":"August 2020"},{"year":"2020","month":"7","text":"July 2020"},{"year":"2020","month":"6","text":"June 2020"},{"year":"2020","month":"5","text":"May 2020"},{"year":"2020","month":"4","text":"April 2020"},{"year":"2020","month":"3","text":"March 2020"},{"year":"2020","month":"2","text":"February 2020"},{"year":"2020","month":"1","text":"January 2020"},{"year":"2019","month":"12","text":"December 2019"},{"year":"2019","month":"11","text":"November 2019"},{"year":"2019","month":"10","text":"October 2019"},{"year":"2019","month":"9","text":"September 2019"},{"year":"2019","month":"8","text":"August 2019"},{"year":"2019","month":"7","text":"July 2019"},{"year":"2019","month":"6","text":"June 2019"},{"year":"2019","month":"5","text":"May 2019"},{"year":"2019","month":"4","text":"April 2019"},{"year":"2019","month":"3","text":"March 2019"},{"year":"2019","month":"2","text":"February 2019"},{"year":"2019","month":"1","text":"January 2019"},{"year":"2018","month":"12","text":"December 2018"},{"year":"2018","month":"11","text":"November 2018"},{"year":"2018","month":"10","text":"October 2018"},{"year":"2018","month":"9","text":"September 2018"},{"year":"2018","month":"8","text":"August 2018"},{"year":"2018","month":"7","text":"July 2018"},{"year":"2018","month":"6","text":"June 2018"},{"year":"2018","month":"5","text":"May 2018"},{"year":"2018","month":"4","text":"April 2018"},{"year":"2018","month":"3","text":"March 2018"},{"year":"2018","month":"2","text":"February 2018"},{"year":"2018","month":"1","text":"January 2018"},{"year":"2017","month":"12","text":"December 2017"},{"year":"2017","month":"11","text":"November 2017"},{"year":"2017","month":"10","text":"October 2017"},{"year":"2017","month":"9","text":"September 2017"},{"year":"2017","month":"8","text":"August 2017"},{"year":"2017","month":"7","text":"July 2017"},{"year":"2017","month":"6","text":"June 2017"},{"year":"2017","month":"5","text":"May 2017"},{"year":"2017","month":"4","text":"April 2017"},{"year":"2017","month":"3","text":"March 2017"},{"year":"2017","month":"2","text":"February 2017"},{"year":"2017","month":"1","text":"January 2017"},{"year":"2016","month":"12","text":"December 2016"},{"year":"2016","month":"11","text":"November 2016"},{"year":"2016","month":"10","text":"October 2016"},{"year":"2016","month":"9","text":"September 2016"},{"year":"2016","month":"8","text":"August 2016"},{"year":"2016","month":"7","text":"July 2016"},{"year":"2016","month":"6","text":"June 2016"},{"year":"2016","month":"5","text":"May 2016"},{"year":"2016","month":"4","text":"April 2016"},{"year":"2016","month":"3","text":"March 2016"},{"year":"2016","month":"2","text":"February 2016"},{"year":"2016","month":"1","text":"January 2016"},{"year":"2015","month":"12","text":"December 2015"},{"year":"2015","month":"11","text":"November 2015"},{"year":"2015","month":"10","text":"October 2015"},{"year":"2015","month":"9","text":"September 2015"},{"year":"2015","month":"8","text":"August 2015"},{"year":"2015","month":"7","text":"July 2015"},{"year":"2015","month":"6","text":"June 2015"},{"year":"2015","month":"5","text":"May 2015"},{"year":"2015","month":"4","text":"April 2015"},{"year":"2015","month":"3","text":"March 2015"},{"year":"2015","month":"2","text":"February 2015"},{"year":"2015","month":"1","text":"January 2015"},{"year":"2014","month":"12","text":"December 2014"},{"year":"2014","month":"11","text":"November 2014"},{"year":"2014","month":"10","text":"October 2014"},{"year":"2014","month":"9","text":"September 2014"},{"year":"2014","month":"8","text":"August 2014"},{"year":"2014","month":"7","text":"July 2014"},{"year":"2014","month":"6","text":"June 2014"},{"year":"2014","month":"5","text":"May 2014"},{"year":"2014","month":"4","text":"April 2014"},{"year":"2014","month":"3","text":"March 2014"},{"year":"2014","month":"2","text":"February 2014"},{"year":"2014","month":"1","text":"January 2014"},{"year":"2013","month":"12","text":"December 2013"},{"year":"2013","month":"11","text":"November 2013"},{"year":"2013","month":"10","text":"October 2013"},{"year":"2013","month":"9","text":"September 2013"},{"year":"2013","month":"8","text":"August 2013"},{"year":"2013","month":"7","text":"July 2013"},{"year":"2013","month":"6","text":"June 2013"},{"year":"2013","month":"5","text":"May 2013"},{"year":"2013","month":"4","text":"April 2013"},{"year":"2013","month":"3","text":"March 2013"},{"year":"2013","month":"2","text":"February 2013"},{"year":"2013","month":"1","text":"January 2013"},{"year":"2012","month":"12","text":"December 2012"},{"year":"2012","month":"11","text":"November 2012"},{"year":"2012","month":"10","text":"October 2012"},{"year":"2012","month":"9","text":"September 2012"},{"year":"2012","month":"8","text":"August 2012"},{"year":"2012","month":"7","text":"July 2012"},{"year":"2012","month":"6","text":"June 2012"},{"year":"2012","month":"3","text":"March 2012"},{"year":"2012","month":"2","text":"February 2012"},{"year":"2011","month":"12","text":"December 2011"},{"year":"2011","month":"11","text":"November 2011"},{"year":"2011","month":"10","text":"October 2011"},{"year":"2011","month":"9","text":"September 2011"},{"year":"2011","month":"8","text":"August 2011"},{"year":"2011","month":"6","text":"June 2011"},{"year":"2011","month":"5","text":"May 2011"},{"year":"2011","month":"4","text":"April 2011"},{"year":"2011","month":"3","text":"March 2011"},{"year":"2011","month":"2","text":"February 2011"},{"year":"2010","month":"11","text":"November 2010"},{"year":"2010","month":"9","text":"September 2010"},{"year":"2010","month":"7","text":"July 2010"},{"year":"2010","month":"6","text":"June 2010"},{"year":"2010","month":"5","text":"May 2010"},{"year":"2010","month":"4","text":"April 2010"},{"year":"2010","month":"2","text":"February 2010"},{"year":"2010","month":"1","text":"January 2010"},{"year":"2009","month":"11","text":"November 2009"},{"year":"2009","month":"10","text":"October 2009"},{"year":"2009","month":"7","text":"July 2009"},{"year":"2009","month":"6","text":"June 2009"},{"year":"2009","month":"5","text":"May 2009"},{"year":"2009","month":"4","text":"April 2009"},{"year":"2009","month":"2","text":"February 2009"},{"year":"2009","month":"1","text":"January 2009"},{"year":"2008","month":"12","text":"December 2008"},{"year":"2008","month":"10","text":"October 2008"},{"year":"2008","month":"9","text":"September 2008"},{"year":"2008","month":"8","text":"August 2008"}],"mediaTrash":0,"infiniteScrolling":0}}; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/media-views.min.js?ver=6.5.5" id="media-views-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/media-editor.min.js?ver=6.5.5" id="media-editor-js" defer></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-includes/js/media-audiovideo.min.js?ver=6.5.5" id="media-audiovideo-js" defer></script> <script type="text/javascript" id="wppb-upload-script-js-extra"> /* <![CDATA[ */ var wppb_upload_script_vars = {"nonce":"5d46d55b91","ajaxUrl":"https:\/\/www.cozmoslabs.com\/wp-admin\/admin-ajax.php","remove_link_text":"Remove"}; var wppb_upload_script_vars = {"nonce":"5d46d55b91","ajaxUrl":"https:\/\/www.cozmoslabs.com\/wp-admin\/admin-ajax.php","remove_link_text":"Remove"}; var wppb_upload_script_vars = {"nonce":"5d46d55b91","ajaxUrl":"https:\/\/www.cozmoslabs.com\/wp-admin\/admin-ajax.php","remove_link_text":"Remove"}; var wppb_upload_script_vars = {"nonce":"5d46d55b91","ajaxUrl":"https:\/\/www.cozmoslabs.com\/wp-admin\/admin-ajax.php","remove_link_text":"Remove"}; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-content/plugins/profile-builder/front-end/default-fields/upload/upload.js?ver=3.12.7" id="wppb-upload-script-js" defer></script> <script defer type="text/javascript" src="https://www.cozmoslabs.com/wp-content/plugins/akismet/_inc/akismet-frontend.js?ver=1711381700" id="akismet-frontend-js"></script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-content/plugins/avangate-referral/assets/js/tracking.js?ver=999" id="ar-tracking-js" defer></script> <script type="text/javascript" id="jquery-cookie-js-extra"> /* <![CDATA[ */ var affwp_scripts = {"ajaxurl":"https:\/\/www.cozmoslabs.com\/wp-admin\/admin-ajax.php"}; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-content/plugins/affiliate-wp/assets/js/jquery.cookie.min.js?ver=1.4.0" id="jquery-cookie-js" defer></script> <script type="text/javascript" id="affwp-tracking-js-extra"> /* <![CDATA[ */ var affwp_debug_vars = {"integrations":{"edd":"Easy Digital Downloads","gravityforms":"Gravity Forms"},"version":"2.27.1","currency":"USD","ref_cookie":"affwp_ref","visit_cookie":"affwp_ref_visit_id","campaign_cookie":"affwp_campaign"}; /* ]]> */ </script> <script type="text/javascript" src="https://www.cozmoslabs.com/wp-content/plugins/affiliate-wp/assets/js/tracking.min.js?ver=2.27.1" id="affwp-tracking-js" defer></script> <script type="text/javascript"> jQuery(document).on( "wppbAddRequiredAttributeEvent", wppbAddRequired ); function wppbAddRequired(event) { var element = wppbEventTargetRequiredElement( event.target ); if( jQuery( element ).attr( "wppb_cf_temprequired" ) ){ jQuery( element ).removeAttr( "wppb_cf_temprequired" ); jQuery( element ).attr( "required", "required" ); } } jQuery(document).on( "wppbRemoveRequiredAttributeEvent", wppbRemoveRequired ); function wppbRemoveRequired(event) { var element = wppbEventTargetRequiredElement( event.target ); if ( jQuery( element ).attr( "required" ) ) { jQuery( element ).removeAttr( "required" ); jQuery( element ).attr( "wppb_cf_temprequired", "wppb_cf_temprequired" ); } } jQuery(document).on( "wppbToggleRequiredAttributeEvent", wppbToggleRequired ); function wppbToggleRequired(event) { if ( jQuery( event.target ).attr( "required" ) ) { jQuery( event.target ).removeAttr( "required" ); jQuery( event.target ).attr( "wppb_cf_temprequired", "wppb_cf_temprequired" ); }else if( jQuery( event.target ).attr( "wppb_cf_temprequired" ) ){ jQuery( event.target ).removeAttr( "wppb_cf_temprequired" ); jQuery( event.target ).attr( "required", "required" ); } } function wppbEventTargetRequiredElement( htmlElement ){ if ( htmlElement.nodeName == "OPTION" ){ // <option> is the target element, so we need to get the parent <select>, in order to apply the required attribute return htmlElement.parentElement; }else{ return htmlElement; } } </script> <script type="text/javascript"> function wppbHideActions( liElement ){ jQuery( "input[type='text'], input[type='email'], input[type='number'], input[type='hidden'], textarea, select option, input[type='checkbox'], input[type='radio'], input[type='url']", jQuery( liElement ) ).each( function(){ /* do this for cascading conditional fields meaning if a field is hidden and another field is dependent on it than hide it as well */ if( jQuery( this )[0].hasAttribute("value") ){ /* keep the value for the repeater field hidden count so we do not loose the values when we hide the repeater fields and show them again */ if( !( jQuery( this )[0].hasAttribute("name") && jQuery( this ).attr("name").substring(0, 20) == "wppb_repeater_field_" ) ){ jQuery( this ).attr( "conditional-value", jQuery( this ).attr("value") ); jQuery( this ).removeAttr("value"); jQuery( this ).trigger("change"); } } else{ jQuery( this ).attr( "conditional-value", jQuery( this ).text() ); jQuery( this ).trigger("change"); } /* we do this so we do not send them in $_POST so we do not change their value */ /* the repeater field hidden count needs to be in the $_POST */ // for select the name attribute is on the parent not the option tag if( jQuery( this ).is("option") ) current = jQuery( this ).parent(); else current = jQuery( this ); if( typeof current[0] != "undefined" && current[0].hasAttribute("name") && current.attr("name").substring(0, 20) != "wppb_repeater_field_" ){ current.attr( "conditional-name", current.attr("name") ); current.removeAttr("name"); } // Trigger a custom event that will remove the HTML attribute -required- for hidden fields. This is necessary for browsers to allow form submission. jQuery( this ).trigger( "wppbRemoveRequiredAttributeEvent" ); } ) } function wppbShowActions( liElement ){ jQuery( "input[type='text'], input[type='email'], input[type='number'], input[type='hidden'], textarea, select option, input[type='checkbox'], input[type='radio'], input[type='url']", jQuery( liElement ) ).each( function(){ if( jQuery( this )[0].hasAttribute("conditional-value") ){ jQuery( this ).attr( "value", jQuery( this ).attr("conditional-value") ); jQuery( this ).removeAttr("conditional-value"); jQuery( this ).trigger("change"); // Trigger a custom event that will add the HTML attribute -required- back again, for previously hidden fields. jQuery( this ).trigger( "wppbAddRequiredAttributeEvent" ); } // for select the name attribute is on the parent not the option tag if( jQuery( this ).is("option") ) current = jQuery( this ).parent(); else current = jQuery( this ); if( current[0].hasAttribute("conditional-name") ){ current.attr( "name", current.attr("conditional-name") ); current.removeAttr("conditional-name"); } // for subscription plans field, we want to select the default selected plan from settings; since all the fields use the same name, by default, only the last one will be selected // for future reference: when multiple fields show, its fine that only one of them will have the default plan selected ( you can only buy 1 plan at time ) if( jQuery(liElement).hasClass("wppb-subscription-plans") ){ jQuery( liElement ).find( "input[name='subscription_plans']" ).each( function( index, item ){ if( typeof jQuery(item).data("default-selected") != "undefined" && jQuery(item).data("default-selected") == true ){ jQuery(item).prop("checked","checked") jQuery(item).trigger("click") } }) } } ) } </script><script type="text/javascript" src="https://www.cozmoslabs.com/wp-content/plugins/profile-builder/assets/js/script-front-end.js?ver=3.12.7" id="wppb_front_end_script-js" defer></script> <script>window.lazyLoadOptions=[{elements_selector:"img[data-lazy-src],.rocket-lazyload,iframe[data-lazy-src]",data_src:"lazy-src",data_srcset:"lazy-srcset",data_sizes:"lazy-sizes",class_loading:"lazyloading",class_loaded:"lazyloaded",threshold:300,callback_loaded:function(element){if(element.tagName==="IFRAME"&&element.dataset.rocketLazyload=="fitvidscompatible"){if(element.classList.contains("lazyloaded")){if(typeof window.jQuery!="undefined"){if(jQuery.fn.fitVids){jQuery(element).parent().fitVids()}}}}}},{elements_selector:".rocket-lazyload",data_src:"lazy-src",data_srcset:"lazy-srcset",data_sizes:"lazy-sizes",class_loading:"lazyloading",class_loaded:"lazyloaded",threshold:300,}];window.addEventListener('LazyLoad::Initialized',function(e){var lazyLoadInstance=e.detail.instance;if(window.MutationObserver){var observer=new MutationObserver(function(mutations){var image_count=0;var iframe_count=0;var rocketlazy_count=0;mutations.forEach(function(mutation){for(var i=0;i<mutation.addedNodes.length;i++){if(typeof mutation.addedNodes[i].getElementsByTagName!=='function'){continue} if(typeof mutation.addedNodes[i].getElementsByClassName!=='function'){continue} images=mutation.addedNodes[i].getElementsByTagName('img');is_image=mutation.addedNodes[i].tagName=="IMG";iframes=mutation.addedNodes[i].getElementsByTagName('iframe');is_iframe=mutation.addedNodes[i].tagName=="IFRAME";rocket_lazy=mutation.addedNodes[i].getElementsByClassName('rocket-lazyload');image_count+=images.length;iframe_count+=iframes.length;rocketlazy_count+=rocket_lazy.length;if(is_image){image_count+=1} if(is_iframe){iframe_count+=1}}});if(image_count>0||iframe_count>0||rocketlazy_count>0){lazyLoadInstance.update()}});var b=document.getElementsByTagName("body")[0];var config={childList:!0,subtree:!0};observer.observe(b,config)}},!1)</script><script data-no-minify="1" async src="https://www.cozmoslabs.com/wp-content/plugins/wp-rocket/assets/js/lazyload/17.5/lazyload.min.js"></script><script>function lazyLoadThumb(e){var t='<img data-lazy-src="https://i.ytimg.com/vi/ID/hqdefault.jpg" alt="" width="480" height="360"><noscript><img src="https://i.ytimg.com/vi/ID/hqdefault.jpg" alt="" width="480" height="360"></noscript>',a='<button class="play" aria-label="play Youtube video"></button>';return t.replace("ID",e)+a}function lazyLoadYoutubeIframe(){var e=document.createElement("iframe"),t="ID?autoplay=1";t+=0===this.parentNode.dataset.query.length?'':'&'+this.parentNode.dataset.query;e.setAttribute("src",t.replace("ID",this.parentNode.dataset.src)),e.setAttribute("frameborder","0"),e.setAttribute("allowfullscreen","1"),e.setAttribute("allow", "accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"),this.parentNode.parentNode.replaceChild(e,this.parentNode)}document.addEventListener("DOMContentLoaded",function(){var e,t,p,a=document.getElementsByClassName("rll-youtube-player");for(t=0;t<a.length;t++)e=document.createElement("div"),e.setAttribute("data-id",a[t].dataset.id),e.setAttribute("data-query", a[t].dataset.query),e.setAttribute("data-src", a[t].dataset.src),e.innerHTML=lazyLoadThumb(a[t].dataset.id),a[t].appendChild(e),p=e.querySelector('.play'),p.onclick=lazyLoadYoutubeIframe});</script></body> </html> <!-- This website is like a Rocket, isn't it? Performance optimized by WP Rocket. Learn more: https://wp-rocket.me - Debug: cached@1732712951 -->