{"id":13331,"date":"2021-02-19T07:47:42","date_gmt":"2021-02-19T07:47:42","guid":{"rendered":"https:\/\/datapost.co.za\/help\/?page_id=13331"},"modified":"2025-03-06T13:58:46","modified_gmt":"2025-03-06T11:58:46","slug":"how-to-create-a-layout-assign-it-to-a-screen","status":"publish","type":"page","link":"https:\/\/datapost.co.za\/help\/how-to-create-a-layout-assign-it-to-a-screen\/","title":{"rendered":"How to create a layout & assign it to a screen"},"content":{"rendered":"[et_pb_section fb_built=”1″ fullwidth=”on” _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_fullwidth_header title=”How to create a layout & assign it to your screen” button_one_text=”Back” button_one_url=”https:\/\/datapost.co.za\/help\/getting-started\/adding-a-screen\/” _builder_version=”4.20.0″ _module_preset=”default” background_color=”gcid-434e3e7c-aba7-49f2-8895-830dae15ee9e” custom_button_one=”on” button_one_icon=”4||divi||400″ hover_enabled=”0″ global_colors_info=”{%22gcid-434e3e7c-aba7-49f2-8895-830dae15ee9e%22:%91%22background_color%22%93}” sticky_enabled=”0″]\n

Screen Layouts can range from a simple, single full screen layer to multiple layers to which different content lists can be attached.<\/span><\/p>\n[\/et_pb_fullwidth_header][\/et_pb_section][et_pb_section fb_built=”1″ admin_label=”section” _builder_version=”4.16″ locked=”off” global_colors_info=”{}”][et_pb_row _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

Examples of screen layouts<\/strong><\/h4>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”https:\/\/datapost.co.za\/help\/wp-content\/uploads\/2020\/10\/Full-screen-16×9-layout-example-Oct-2020.jpg” title_text=”Full screen 16×9 layout example Oct 2020″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

Simple 16×9 Full Screen Layout\u00a0<\/p>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”https:\/\/datapost.co.za\/help\/wp-content\/uploads\/2020\/10\/More-complicated-layout-example-Oct-2020.jpg” title_text=”More complicated layout example Oct 2020″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

More complicated layout with video block, ticker & side panel<\/p>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

Step-by-step guide on how to create a simple full screen 16×9 layout<\/strong><\/h4>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”http:\/\/www.datapost.co.za\/help\/wp-content\/uploads\/2020\/08\/Select-Screen-Works-Aug-2020.jpg” title_text=”Select Screen Works Aug 2020″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

1. Click on the Screen Works tab in the top left corner of the screen.<\/p>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”http:\/\/www.datapost.co.za\/help\/wp-content\/uploads\/2020\/08\/Click-on-New-Screen-Layout-Aug-2020.jpg” title_text=”Click on New Screen Layout Aug 2020″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

2. Click on the New Screen Layout icon. A window will open.<\/p>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”http:\/\/www.datapost.co.za\/help\/wp-content\/uploads\/2020\/07\/New-Screen-Layout-window.jpg” title_text=”New-Screen-Layout-window” _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

3. Give your layout a name and aspect ratio by completing the metadata fields. Click on the Save button in the bottom right corner of the window.<\/p>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”https:\/\/datapost.co.za\/help\/wp-content\/uploads\/2020\/10\/Full-screen-16×9-layout-in-middle-panel-Oct-2020.jpg” title_text=”Full screen 16×9 layout in middle panel Oct 2020″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

4. Once created, the new screen layout <\/em>will open in the middle panel. It will also automatically appear in your clipboard on the right of the screen for easy access.\u00a0<\/p>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”https:\/\/datapost.co.za\/help\/wp-content\/uploads\/2020\/10\/Click-on-the-New-Layer-button-Oct-2020.jpg” title_text=”Click on the New Layer button Oct 2020″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

5. \u00a0Click on the New Layer button.\u00a0A New Layer block will appear.\u00a0<\/p>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”https:\/\/datapost.co.za\/help\/wp-content\/uploads\/2020\/10\/New-layer-and-Layer-Name-Oct-2020.jpg” title_text=”New layer and Layer Name Oct 2020″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

6. Click on your new layer. Type the name of your new layer in the Layer Name field on the right.<\/p>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”https:\/\/datapost.co.za\/help\/wp-content\/uploads\/2020\/10\/Name-your-layer-Oct-2020.jpg” title_text=”Name your layer Oct 2020″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

7. Add the following values to the axes: x=0, y=0, z=0, width=100 and height=100 in the blocks below the layer name. Your layer will adapt according to your inputs.<\/p>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

Step-by-step guide on how to assign a layout to a screen<\/strong><\/h4>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”https:\/\/datapost.co.za\/help\/wp-content\/uploads\/2020\/10\/Open-screen-2-Oct-2020.jpg” title_text=”Open screen 2 Oct 2020″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

1. Ensure that you have opened the screen that you want to assign your layout to. Drag your layout from the clipboard onto the relevant screen.<\/p>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”https:\/\/datapost.co.za\/help\/wp-content\/uploads\/2020\/10\/Save-Initialize-Date-Time-Oct-2020.jpg” title_text=”Save Initialize Date Time Oct 2020″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

2. A new window will appear. Leave the Initialize Date Time fields as they are and click on the Save button.<\/p>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row column_structure=”3_5,2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_column type=”3_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_image src=”https:\/\/datapost.co.za\/help\/wp-content\/uploads\/2020\/10\/Updated-layout-Oct-2020.jpg” title_text=”Updated layout Oct 2020″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_image][\/et_pb_column][et_pb_column type=”2_5″ _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_text _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”]\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

\u00a03. The screen layout <\/em>will update in the screen block after you have saved.<\/p>\n

 <\/p>\n[\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section][et_pb_section fb_built=”1″ fullwidth=”on” _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][et_pb_fullwidth_header title=”Learn how to upload & log media” button_one_text=”To Top” button_one_url=”https:\/\/datapost.co.za\/help\/how-to-create-a-layout-assign-it-to-a-screen\/” button_two_text=”Learn How” button_two_url=”https:\/\/datapost.co.za\/help\/getting-started\/uploading-media\/” _builder_version=”4.20.0″ _module_preset=”default” background_color=”gcid-434e3e7c-aba7-49f2-8895-830dae15ee9e” custom_button_one=”on” button_one_icon=”2||divi||400″ hover_enabled=”0″ global_colors_info=”{%22gcid-434e3e7c-aba7-49f2-8895-830dae15ee9e%22:%91%22background_color%22%93}” sticky_enabled=”0″]\n

Before you can build your content list, you need to upload & log the media that you want to schedule.<\/p>\n[\/et_pb_fullwidth_header][\/et_pb_section]\n","protected":false},"excerpt":{"rendered":"

Screen Layouts can range from a simple, single full screen layer to multiple layers to which different content lists can be attached.Examples of screen layouts            Simple 16×9 Full Screen Layout\u00a0            More complicated layout with video block, ticker & side panelStep-by-step guide on how to create […]<\/p>\n","protected":false},"author":148,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"class_list":["post-13331","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/datapost.co.za\/help\/wp-json\/wp\/v2\/pages\/13331","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/datapost.co.za\/help\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/datapost.co.za\/help\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/datapost.co.za\/help\/wp-json\/wp\/v2\/users\/148"}],"replies":[{"embeddable":true,"href":"https:\/\/datapost.co.za\/help\/wp-json\/wp\/v2\/comments?post=13331"}],"version-history":[{"count":16,"href":"https:\/\/datapost.co.za\/help\/wp-json\/wp\/v2\/pages\/13331\/revisions"}],"predecessor-version":[{"id":18142,"href":"https:\/\/datapost.co.za\/help\/wp-json\/wp\/v2\/pages\/13331\/revisions\/18142"}],"wp:attachment":[{"href":"https:\/\/datapost.co.za\/help\/wp-json\/wp\/v2\/media?parent=13331"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}