{"id":50225,"date":"2020-04-27T05:35:17","date_gmt":"2020-04-27T12:35:17","guid":{"rendered":"http:\/\/www.technosolutions.com\/kb\/?p=50225"},"modified":"2020-04-27T05:36:39","modified_gmt":"2020-04-27T12:36:39","slug":"arranging-fields-on-form-using-form-layout-designer","status":"publish","type":"post","link":"http:\/\/www.technosolutions.com\/kb\/50225\/arranging-fields-on-form-using-form-layout-designer\/","title":{"rendered":"Arranging Fields on form using Form Layout Designer"},"content":{"rendered":"<h3>Overview<\/h3>\n<p>With <strong>Form Layout Designer<\/strong>, you can arrange fields that are added to a record type form. You can align fields, change the height or width of fields, move fields to another position, etc.<\/p>\n<p>This article describes the procedure to align, bring to front\/send to back, and removing fields from a form.<\/p>\n<h3>Who should read this?<\/h3>\n<ul>\n<li>TopTeam Administrators<\/li>\n<li>Project Admins<\/li>\n<\/ul>\n<h3>Prerequisites<\/h3>\n<p>You need to first learn about <strong>Form Layout Designer<\/strong> and then adding fields to a form. Refer to the article <a href=\"http:\/\/www.technosolutions.com\/kb\/50218\/working-with-form-layout-designer\/\" target=\"_blank\" rel=\"noopener\">Form Layout Designer<\/a>.<\/p>\n<h3>1. Aligning Fields<\/h3>\n<p>Select desired fields under a tab to align them using the <strong>Align Widgets<\/strong> drop-down menu located on the designer toolbar.<\/p>\n<p><strong>Align Widgets<\/strong> drop-down actions:<\/p>\n<p><img decoding=\"async\" class=\"wp-image-50226\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/www.technosolutions.com\/kb\/wp-content\/uploads\/2020\/04\/word-image-66.png\" \/><\/p>\n<p>Refer to the process demonstration below.<\/p>\n<p><img decoding=\"async\" class=\"wp-image-50227\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/www.technosolutions.com\/kb\/wp-content\/uploads\/2020\/04\/word-image-42.gif\" \/><\/p>\n<h3>2. Bring to Front and Send to Back Fields<\/h3>\n<p>When a field overlaps with another field, you may want to change the field\u2019s order by one level so that a field either is one level below or above another field. Refer to the process demonstration below.<\/p>\n<p><img decoding=\"async\" class=\"wp-image-50228\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/www.technosolutions.com\/kb\/wp-content\/uploads\/2020\/04\/word-image-43.gif\" \/><\/p>\n<h3>3. Removing Widgets<\/h3>\n<p>To remove a field or widget, simply select one or more fields\/widgets and click <strong>Remove Widgets<\/strong> (or press <strong>Delete<\/strong> key) located on the designer toolbar.<\/p>\n<p><img decoding=\"async\" class=\"wp-image-50229\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" data-layzr=\"http:\/\/www.technosolutions.com\/kb\/wp-content\/uploads\/2020\/04\/c-users-admin-appdata-local-temp-snaghtml34e217f4.png\" alt=\"C:\\Users\\admin\\AppData\\Local\\Temp\\SNAGHTML34e217f4.PNG\" \/><\/p>\n<p><strong>Remove Widgets<\/strong> is helpful when you want to move a field from one tab to another. Refer to the article Moving Fields from one Tab to another.<\/p>\n<h3>Related Articles<\/h3>\n<p><a href=\"http:\/\/www.technosolutions.com\/kb\/50218\/working-with-form-layout-designer\/\" target=\"_blank\" rel=\"noopener\">Form Layout Designer<\/a><\/p>\n<p>Revised: April 27<sup>th<\/sup>, 2020<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Overview With Form Layout Designer, you can arrange fields that are added to a record type form. You can align fields, change the height or width of fields, move fields to another position, etc. This article describes the procedure to align, bring to front\/send to back, and removing fields from a form. Who should read this? TopTeam Administrators Project Admins Prerequisites You need to first learn about Form Layout Designer and then adding fields to a form. Refer to the article Form Layout Designer. 1. Aligning Fields Select desired fields under a tab to align them using the Align Widgets <\/p>\n","protected":false},"author":6,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10],"tags":[308,309],"class_list":["post-50225","post","type-post","status-publish","format-standard","hentry","category-administration","tag-fields","tag-forms"],"jetpack_featured_media_url":"","jetpack_shortlink":"https:\/\/wp.me\/paoaNA-d45","_links":{"self":[{"href":"http:\/\/www.technosolutions.com\/kb\/wp-json\/wp\/v2\/posts\/50225","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.technosolutions.com\/kb\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.technosolutions.com\/kb\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.technosolutions.com\/kb\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"http:\/\/www.technosolutions.com\/kb\/wp-json\/wp\/v2\/comments?post=50225"}],"version-history":[{"count":1,"href":"http:\/\/www.technosolutions.com\/kb\/wp-json\/wp\/v2\/posts\/50225\/revisions"}],"predecessor-version":[{"id":50230,"href":"http:\/\/www.technosolutions.com\/kb\/wp-json\/wp\/v2\/posts\/50225\/revisions\/50230"}],"wp:attachment":[{"href":"http:\/\/www.technosolutions.com\/kb\/wp-json\/wp\/v2\/media?parent=50225"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.technosolutions.com\/kb\/wp-json\/wp\/v2\/categories?post=50225"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.technosolutions.com\/kb\/wp-json\/wp\/v2\/tags?post=50225"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}