{"id":1765,"date":"2018-02-14T21:36:43","date_gmt":"2018-02-14T21:36:43","guid":{"rendered":"http:\/\/www.turtle.works\/knowledge\/?p=1765"},"modified":"2018-02-14T21:39:11","modified_gmt":"2018-02-14T21:39:11","slug":"custom-forms-sharepoint-modern-experience","status":"publish","type":"post","link":"https:\/\/www.turtle.works\/knowledge\/custom-forms-sharepoint-modern-experience\/","title":{"rendered":"Custom Forms SharePoint Modern Experience"},"content":{"rendered":"

Custom Forms SharePoint Modern Experience<\/strong><\/p>\n

Finally! Form customization has made its way into SharePoint<\/a>!<\/p>\n

You have been tasked with creating a nice-looking form, let\u2019s see how that\u2019s done\u2026<\/p>\n

We will be working with a SharePoint List<\/a>.<\/p>\n

Go ahead and create your list, you already know how to do that.<\/p>\n

Let me know when you\u2019re done\u2026\u2026\"\"<\/p>\n

Ok let\u2019s get started.<\/p>\n

Note: you must be in SharePoint Modern Experience<\/a>.<\/p>\n

\"\"<\/p>\n

The option to create a custom form is located in the list settings. Navigate to the list settings and click on Form Settings.<\/p>\n

\"\"<\/p>\n

Select \u2018Use a custom form created in PowerApps\u2019 or click on the link (Customize in PowerApps), click ok.<\/p>\n

Keep this in mind just in case you decide to return to the default SharePoint form. I can\u2019t imagine going back after you\u2019ve created an amazing custom form!\u00a0\u00a0 \"\"<\/p>\n

\"\"<\/p>\n

Of course, you know as well as I do there is more than one way to do anything in SharePoint.<\/p>\n

So, here\u2019s another way\u2026<\/p>\n

Simply navigate to the list and click on the down arrow next to PowerApps, then select Customize Forms.<\/p>\n

 <\/p>\n

\"\"<\/p>\n

You can skip the Welcome option, or if you prefer click on the links, there\u2019s a lot of good information in there. I\u2019m going to skip that for now\u2026<\/p>\n

\"\"<\/p>\n

Ok you\u2019ve landed on the form. Right now it\u2019s just a basic form.<\/p>\n

On the left you see the name of the Screen, the form name and all the fields from the list that make up the form. On the right you see the ability to work with properties, rules, and advanced.<\/p>\n

\"\"<\/p>\n

 <\/p>\n

Let\u2019s change the theme!<\/p>\n

Select the form by clicking on the form name on the left.<\/p>\n

\"\"<\/p>\n

After selecting the down arrow next to Theme there are various options to choose from.<\/p>\n

Go ahead play around to see what you like\u2026 \"\"\u00a0yes, I\u2019m still here!<\/p>\n

\"\"<\/p>\n

You\u2019ve made a selection\u2026 You like it but you want more. Let\u2019s try creating a label for the form.<\/p>\n

Drag the top part of the form down to make room for a label. Now let\u2019s add the label\u2026<\/p>\n

\"\"\u00a0\u00a0 \"\"<\/p>\n

On the top navigation click on Insert \/ Label.<\/p>\n

\"\"<\/p>\n

The label will appear somewhere on the form. Yup there it’s at the top of the form.<\/p>\n

\"\"<\/p>\n

With the label still selected let\u2019s change the text, type something in there that will identify the form.<\/span><\/p>\n

\"\"<\/p>\n

You can center the wording and give it some color, change the fill color, the options are endless.<\/p>\n

Go ahead and create your masterpiece!<\/p>\n

\"\"<\/p>\n

Now isn\u2019t that nice?\u00a0\u00a0\"\" Much better than the OOTB form.<\/p>\n

\"\"<\/p>\n

How does the form look when adding an item? Let\u2019s see\u2026<\/p>\n

\"\"<\/p>\n

Thanks Microsoft<\/a>! \"\"<\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n","protected":false},"excerpt":{"rendered":"

Custom Forms SharePoint Modern Experience Finally! Form customization has made its way into SharePoint! You have been tasked with creating a nice-looking form, let\u2019s see how that\u2019s done\u2026 We will be working with a SharePoint List. Go ahead and create your list, you already know how to do that. Let me know when you\u2019re done\u2026\u2026 … <\/p>\n

Continue reading “Custom Forms SharePoint Modern Experience”<\/span><\/a><\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[20,23],"tags":[],"class_list":["post-1765","post","type-post","status-publish","format-standard","hentry","category-sharepoint","category-sharepoint-online"],"_links":{"self":[{"href":"https:\/\/www.turtle.works\/knowledge\/wp-json\/wp\/v2\/posts\/1765","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.turtle.works\/knowledge\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.turtle.works\/knowledge\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.turtle.works\/knowledge\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.turtle.works\/knowledge\/wp-json\/wp\/v2\/comments?post=1765"}],"version-history":[{"count":8,"href":"https:\/\/www.turtle.works\/knowledge\/wp-json\/wp\/v2\/posts\/1765\/revisions"}],"predecessor-version":[{"id":1791,"href":"https:\/\/www.turtle.works\/knowledge\/wp-json\/wp\/v2\/posts\/1765\/revisions\/1791"}],"wp:attachment":[{"href":"https:\/\/www.turtle.works\/knowledge\/wp-json\/wp\/v2\/media?parent=1765"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.turtle.works\/knowledge\/wp-json\/wp\/v2\/categories?post=1765"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.turtle.works\/knowledge\/wp-json\/wp\/v2\/tags?post=1765"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}