{"id":9311,"date":"2016-02-11T11:23:10","date_gmt":"2016-02-11T03:23:10","guid":{"rendered":"http:\/\/localhost\/help\/?page_id=9311"},"modified":"2024-09-11T11:26:39","modified_gmt":"2024-09-11T03:26:39","slug":"preparing-an-explorer-studio-page-for-a-tutorial","status":"publish","type":"page","link":"https:\/\/oihelp.corporate.ifs.com\/help\/p2-explorer\/explorer-studio\/controls\/preparing-an-explorer-studio-page-for-a-tutorial\/","title":{"rendered":"Preparing an Explorer Page for Tutorials"},"content":{"rendered":"\n<p class=\"intro-text\">This article describes how to get a page ready for the tutorials on how to use the <a title=\"Components\" href=\"https:\/\/oihelp.corporate.ifs.com\/help\/p2-explorer\/explorer-studio\/controls\/\">components in IFS OI Explorer Studio<\/a>.<\/p>\n<p class=\"intro-text\">We're going to add a page in grid layout, with four separate grid cells in the top left quadrant. Add extra grid cells, if required, to complete individual tutorials. Next, we'll save the new page.<\/p>\n<p class=\"intro-text\"><strong>Step 1. Set up a new IFS OI Explorer Page<\/strong><\/p>\n<p class=\"intro-text\">Create a new page in <em>Grid Layout<\/em>, then format this so that you have four additional rows in the top left quadrant of the main grid.<\/p>\n<p><a href=\"https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Explorer-Page.png\" rel=\"lightbox-0\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9318\" src=\"https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Explorer-Page.png\" alt=\"\" width=\"700\" height=\"458\" srcset=\"https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Explorer-Page.png 1054w, https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Explorer-Page-768x503.png 768w, https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Explorer-Page-150x98.png 150w, https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Explorer-Page-24x16.png 24w, https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Explorer-Page-36x24.png 36w, https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Explorer-Page-48x31.png 48w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/><\/a><\/p>\n<p class=\"intro-text\">1. Click <strong>New Page<\/strong> on the Explorer Ribbon <strong>Home<\/strong> tab, and select <strong>Grid Layout<\/strong>.<\/p>\n<p class=\"intro-text\">2. Drag a new <a title=\"Grid Layout\" href=\"https:\/\/oihelp.corporate.ifs.com\/help\/p2-explorer\/explorer-studio\/controls\/grid-layout\/\">grid<\/a> onto the top left quadrant, and add three rows.<\/p>\n<p class=\"intro-text\">3. In the new grid, adjust the row heights and add column and row spacing if you like.<\/p>\n<p>&nbsp;<\/p>\n<p class=\"intro-text\"><strong>Step 2. Save the Page in your Workspace<\/strong><\/p>\n<p class=\"intro-text\">Save the page in your private workspace, with a name suited to the component you are working with, for example \"Data Label\".<\/p>\n<p class=\"intro-text\">1. Click the <strong>Save<\/strong> <a href=\"https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2015\/02\/saveicon1.png\" rel=\"lightbox-1\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-3365 size-full\" src=\"https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2015\/02\/saveicon1.png\" alt=\"\" width=\"14\" height=\"13\" \/><\/a> button on the Studio toolbar.<\/p>\n<p><a href=\"https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-1.png\" rel=\"lightbox-2\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9326 size-full\" src=\"https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-1.png\" alt=\"\" width=\"512\" height=\"165\" srcset=\"https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-1.png 512w, https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-1-150x48.png 150w, https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-1-24x8.png 24w, https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-1-36x12.png 36w, https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-1-48x15.png 48w\" sizes=\"auto, (max-width: 512px) 100vw, 512px\" \/><\/a><\/p>\n<p class=\"intro-text\">2. In the dialog that appears, type in a suitable <strong>Name<\/strong>, and keep the default <strong>Workspace<\/strong>, <em>My Workspace<\/em>.<\/p>\n<p><a href=\"https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-2.png\" rel=\"lightbox-3\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9327 size-full\" src=\"https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-2.png\" alt=\"\" width=\"599\" height=\"297\" srcset=\"https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-2.png 599w, https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-2-150x74.png 150w, https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-2-24x12.png 24w, https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-2-36x18.png 36w, https:\/\/oihelp.corporate.ifs.com\/help\/wp-content\/uploads\/2016\/02\/Save-2-48x24.png 48w\" sizes=\"auto, (max-width: 599px) 100vw, 599px\" \/><\/a><\/p>\n<p class=\"intro-text\">You can now continue with your tutorial.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>This article describes how to get a page ready for the tutorials on how to use the components in IFS OI Explorer Studio.<\/p>\n<p class=\"continue-reading-button\"> <a class=\"continue-reading-link\" href=\"https:\/\/oihelp.corporate.ifs.com\/help\/p2-explorer\/explorer-studio\/controls\/preparing-an-explorer-studio-page-for-a-tutorial\/\">Read more<i class=\"crycon-right-dir\"><\/i><\/a><\/p>\n","protected":false},"author":8,"featured_media":6679,"parent":1407,"menu_order":25,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":"","_members_access_role":[],"_members_access_error":""},"categories":[11],"tags":[],"class_list":["post-9311","page","type-page","status-publish","has-post-thumbnail","hentry","category-tutorial"],"_links":{"self":[{"href":"https:\/\/oihelp.corporate.ifs.com\/help\/wp-json\/wp\/v2\/pages\/9311","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/oihelp.corporate.ifs.com\/help\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/oihelp.corporate.ifs.com\/help\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/oihelp.corporate.ifs.com\/help\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/oihelp.corporate.ifs.com\/help\/wp-json\/wp\/v2\/comments?post=9311"}],"version-history":[{"count":2,"href":"https:\/\/oihelp.corporate.ifs.com\/help\/wp-json\/wp\/v2\/pages\/9311\/revisions"}],"predecessor-version":[{"id":67001,"href":"https:\/\/oihelp.corporate.ifs.com\/help\/wp-json\/wp\/v2\/pages\/9311\/revisions\/67001"}],"up":[{"embeddable":true,"href":"https:\/\/oihelp.corporate.ifs.com\/help\/wp-json\/wp\/v2\/pages\/1407"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/oihelp.corporate.ifs.com\/help\/wp-json\/wp\/v2\/media\/6679"}],"wp:attachment":[{"href":"https:\/\/oihelp.corporate.ifs.com\/help\/wp-json\/wp\/v2\/media?parent=9311"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/oihelp.corporate.ifs.com\/help\/wp-json\/wp\/v2\/categories?post=9311"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/oihelp.corporate.ifs.com\/help\/wp-json\/wp\/v2\/tags?post=9311"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}