{"id":1429,"date":"2025-05-04T14:19:04","date_gmt":"2025-05-04T14:19:04","guid":{"rendered":"https:\/\/marcwuestenhagen.de\/?page_id=1429"},"modified":"2025-05-14T18:32:17","modified_gmt":"2025-05-14T18:32:17","slug":"multi-step-form","status":"publish","type":"page","link":"https:\/\/marcwuestenhagen.de\/en\/multi-step-form\/","title":{"rendered":"Multi Step Form"},"content":{"rendered":"<div id=\"multi-step-form\" class=\"fw-wizard\" data-stepcount=\"2\" data-wizardid=\"1\">\n    <div class=\"fw-wizard-step-header-container\">\n        <div class=\"fw-container\" data-redirect=\"\">\n                <div class=\"fw-wizard-step-header\" data-stepid=\"0\">\n            <span class=\"msf-h2\">How can I reach you?<\/span>\n            <p class=\"fw-copytext\"><\/p>\n        <\/div>\n                <div class=\"fw-wizard-step-header\" data-stepid=\"1\">\n            <span class=\"msf-h2\">Tell me about you?<\/span>\n            <p class=\"fw-copytext\"><\/p>\n        <\/div>\n                <\/div>\n    <\/div>\n    <div class=\"fw-progress-bar-container\">\n        <div class=\"fw-container\">\n    <div class=\"fw-progress-wrap\">\n    <ul class=\"fw-progress-bar\"\n        data-activecolor=\"#546e7a\"\n        data-donecolor=\"#4caf50\"\n        data-nextcolor=\"#aaa\"\n        data-buttoncolor=\"#546e7a\">\n                <li class=\"fw-progress-step\"\n            data-id=\"0\">\n            <span class=\"fw-progress-bar-bar\"><\/span>\n            <span class=\"fw-txt-ellipsis\" data-title=\"Contact\">Contact<\/span>\n                    <\/li>\n                    <li class=\"fw-progress-step\"\n            data-id=\"1\">\n            <span class=\"fw-progress-bar-bar\"><\/span>\n            <span class=\"fw-txt-ellipsis\" data-title=\"Bandname \/ Artist\">Bandname \/ Artist<\/span>\n                    <\/li>\n                <\/ul>\n<\/div>\n        <\/div>\n    <\/div>\n    <div class=\"fw-wizard-step-container\">\n        <div class=\"fw-container\">\n                    <div class=\"fw-wizard-step\" data-stepid=\"0\">\n                <div class=\"fw-step-part\" data-partid=\"0\">\n\t<span class=\"fw-step-part-title\">\n\t\t\tContact\t<\/span>\n\t<div class=\"fw-clearfix\"><\/div>\n\t<div class=\"fw-step-part-body\">\n\t\t\t\t\t\t\t\t\t<div class=\"fw-step-block\" data-blockid=\"1\" data-type=\"fw-email\" data-required=\"true\">\n\t\t\t<div class=\"fw-input-container\">\n\t\t\t\t<label for=\"msf-mail-e-mail\"><span class=\"msf-h3\">E-Mail<\/span><\/label>\n\t\t\t\t<input type=\"text\" id=\"msf-mail-e-mail\"  class=\"fw-text-input one\" data-id=\"email\">\n\t\t\t\t<span class=\"fa fa-envelope form-control-feedback\" aria-hidden=\"true\"><\/span>\n\t\t\t<\/div>\n\t\t\t\t\t\t<div class=\"fw-clearfix\"><\/div>\n\t\t<\/div>\n\t  \t\t\t\t\t\t\t\t\t<div class=\"fw-step-block\" data-blockid=\"1\" data-type=\"fw-textarea\" data-required=\"true\">\n\t\t\t<div class=\"fw-input-container\">\n\t\t\t\t<label for=\"msf-textarea-name\"><span class=\"msf-h3\">Name<\/span><\/label>\n\t\t\t\t<textarea \n\t\t\t\t\tclass=\"fw-textarea\"\n\t\t\t\t\tid=\"msf-textarea-name\"\n\t\t\t\t\tdata-id=\"textarea\"><\/textarea>\n\t\t\t\t<span class=\"fa fa-pencil t-area form-control-feedback\" aria-hidden=\"true\"><\/span>\n\t\t\t<\/div>\n\t\t\t<div class=\"fw-clearfix\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n<\/div>\n\t\t\t                <div class=\"fw-clearfix\"><\/div>\n            <\/div>\n                        <div class=\"fw-wizard-step\" data-stepid=\"1\">\n                <div class=\"fw-step-part\" data-partid=\"0\">\n\t<span class=\"fw-step-part-title\">\n\t\t\tBandname \/ Artist\t<\/span>\n\t<div class=\"fw-clearfix\"><\/div>\n\t<div class=\"fw-step-part-body\">\n\t\t\t\t\t\t\t\t\t<div class=\"fw-step-block\" data-blockid=\"1\" data-type=\"fw-text\" data-required=\"true\">\n\t\t\t<div class=\"fw-input-container\">\n\t\t\t\t<label for=\"msf-text-bandname-\/-artistname\"><span class=\"msf-h3\">Bandname \/ Artistname<\/span><\/label>\n\t\t\t\t<input \n\t\t\t\t\ttype=\"text\" \n\t\t\t\t\tclass=\"fw-text-input\" \n\t\t\t\t\tid=\"msf-text-bandname-\/-artistname\"\n\t\t\t\t\tdata-id=\"text\">\n\t\t\t\t<span class=\"fa fa-pencil form-control-feedback\" aria-hidden=\"true\"><\/span>\n\t\t\t<\/div>\n\t\t\t<div class=\"fw-clearfix\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"fw-step-block\" data-blockid=\"1\" data-type=\"fw-text\" data-required=\"false\">\n\t\t\t<div class=\"fw-input-container\">\n\t\t\t\t<label for=\"msf-text-a-direct-link-to-your-music\"><span class=\"msf-h3\">A direct link to your music<\/span><\/label>\n\t\t\t\t<input \n\t\t\t\t\ttype=\"text\" \n\t\t\t\t\tclass=\"fw-text-input\" \n\t\t\t\t\tid=\"msf-text-a-direct-link-to-your-music\"\n\t\t\t\t\tdata-id=\"text\">\n\t\t\t\t<span class=\"fa fa-pencil form-control-feedback\" aria-hidden=\"true\"><\/span>\n\t\t\t<\/div>\n\t\t\t<div class=\"fw-clearfix\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n<\/div>\n\t\t\t                        <div class=\"fw-summary-container\">\n                            <button type=\"button\" class=\"fw-toggle-summary\">SHOW SUMMARY<\/button>\n                            <div id=\"wizard-summary\" class=\"fw-wizard-summary\" style=\"display:none;\" data-showsummary=\"on\">\n                            <div class=\"fw-summary-alert\">Some required Fields are empty<br>Please check the highlighted fields.<\/div>\n                            <\/div>\n                        <\/div>\n                                            <button type=\"button\" class=\"fw-btn-submit\">Submit<\/button>\n                                <div class=\"fw-clearfix\"><\/div>\n            <\/div>\n                    <\/div>\n    <\/div>\n        <div class=\"fw-wizard-button-container\">\n        <div class=\"fw-container\">\n            <div class=\"fw-wizard-buttons\">\n                <button class=\"fw-button-previous\"><i class=\"fa fa-arrow-circle-left\" aria-hidden=\"true\"><\/i> &nbsp;Previous Step<\/button>\n                <button class=\"fw-button-next\">Next Step &nbsp;<i class=\"fa fa-arrow-circle-right\" aria-hidden=\"true\"><\/i><\/button>\n            <\/div>\n        <\/div>\n    <\/div>\n        <div class=\"fw-alert-user\" style=\"display:none;\"><\/div>\n<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"templates\/full-width.php","meta":{"footnotes":""},"class_list":["post-1429","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/marcwuestenhagen.de\/en\/wp-json\/wp\/v2\/pages\/1429","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/marcwuestenhagen.de\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/marcwuestenhagen.de\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/marcwuestenhagen.de\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/marcwuestenhagen.de\/en\/wp-json\/wp\/v2\/comments?post=1429"}],"version-history":[{"count":5,"href":"https:\/\/marcwuestenhagen.de\/en\/wp-json\/wp\/v2\/pages\/1429\/revisions"}],"predecessor-version":[{"id":1439,"href":"https:\/\/marcwuestenhagen.de\/en\/wp-json\/wp\/v2\/pages\/1429\/revisions\/1439"}],"wp:attachment":[{"href":"https:\/\/marcwuestenhagen.de\/en\/wp-json\/wp\/v2\/media?parent=1429"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}