Layout Overview
Layouts allow you to create and manage digital signage content by arranging Assets and Widgets on a canvas.
You can quickly get started with pre-built templates or design freely from a blank canvas, and enhance your content with widgets that provide real-time information such as weather, news, and calendars. With drag-and-drop editing, layer management, and real-time data integration, anyone can easily create high-quality content.
Go to the Layout page and click ➀New Layout to open the Template Library.
➀
Browse Templates in the Template Library
Templates help you create content quickly while maintaining brand consistency. Easily customize designs to suit various situations.
➁+Blank Canvas: Start designing from scratch on a blank canvas without using a template.
➂Category: Templates are categorized by purpose and theme. Use keyword search or browse categories to find the perfect template.
-
Categories: Seasonal Campaigns, Food & Dining, Service Promotions, Attention Grabbers, Product Promotions, Classes, Automotive, Guest Speakers, Hotels & Resorts, Travel.
Click a template to open Layout Editor. You can freely utilize various Assets such as images, videos, and text, as well as Widgets to complete your Layout.
➂
➁
Layout Editor Overview
The Layout Editor is where you create and manage content for your displays. You can combine images, videos, text, playlists, and widgets into a single layout, which is easy to use even without prior design experience.
➀Canvas Settings: Click the icon to open the Canvas Settings panel, where you can configure the screen orientation, video wall layout, and background color or audio.
➁Assets Panel: Assets are basic content objects used to build a layout, such as images, videos, text, web pages, and shapes.
➂Widgets Panel: Widgets are dynamic content objects that automatically display and update information based on external data sources, such as weather, clocks, and RSS feeds.
➃Top Toolbar: This area contains tools for manipulating Assets and Widgets on the canvas, such as deleting assets and widgets, alignment, zoom control, and previewing.
➄Canvas: A workspace where you place selected assets and widgets and perform actual design work.
➅Layers Panel: This is a dedicated space for managing and selecting the order of assets and widgets placed on the screen.
➀
➁
➃
➄
➂
➅
Canvas Settings
Canvas settings provide a work environment that matches the physical configuration of your display, allowing you to design layouts in a state identical to the final output.
-
Screen Orientation: Set the screen to Landscape or Portrait mode.
-
Landscape
-
Portrait
-
-
Video Wall Layout: Provides the following layout options for multi-monitor installations:
-
1×1, 1×2, 1×3, 1×4, 2×1, 3×1, 4×1, 2×2
-
-
Background Color: Select the canvas background color.
-
Background Audio: Add background music to play along with the layout.
Top Toolbar
➀
➁
➂
The top toolbar provides quick access to essential editing functions on the canvas. It allows you to intuitively control elements positioning, layers, and data synchronization during design work.
-
➀Delete icon: Removes the selected Assets and Widget from the canvas.
-
Duplicate icon: Create an exact copy of the selected assets and widget and add it to the canvas.
-
Undo(Ctrl+Z) / Redo(Ctrl+Y) icon: Cancel the most recent action performed / Restore the action that was undone using Undo.
-
Bring Forward / Send Backward icon: Moves the selected assets and widget one layer forward or backward.
-
➁Toggle Layer Visibility icon: Shows or hides the Layer Panel on the right.
-
➂Google Sheets Integration icon: Click to open Google Sheets Integration Settings.
Using the Google Sheets Integration feature in CONNECTPlayer Manager, you can link data stored in Google Sheets with assets in the layout canvas in real time. By connecting specific cells in a Google Sheet to template assets, the content on the canvas is automatically updated whenever the sheet data changes.
-
Create and Share a Google Sheet
-
Create a Google Sheets document to be linked with your menu template.
-
Click the Share button in the upper-right corner.
-
Change General Access to Anyone with the link.
-
Set the permission to Viewer and click Done.
-
※ The sharing setting must be changed so that external systems can access the data.
-
Enter Data Connection Information
-
In the Google Sheets Integration settings window, enter the following information and click Save.
-
Google Sheets URL: Copy and paste the URL of the Google Sheet you want to connect.
-
Sheet Name: Enter the name of the sheet tab located at the bottom of Google Sheets.
(Example: menu item)
-
Sheet Range: Enter the starting cell position from which data should be read. Enter the cell where the first menu item begins (A2).
-
Refresh Interval: Set how often (in minutes) changes made in Google Sheets should be automatically synchronized.
-
Additional Menu Integration
Using the same method, connect Google Sheets cells to MENU #2 through MENU #13.
-
Image Integration
Enter the shared URL of an image stored in Google Drive into the sheet and connect it to an image asset. You can then update the displayed image simply by changing the link in the sheet.
※ When using Google Drive images, make sure the image link is publicly accessible.
-
Zoom Controls: Zoom in or out of the canvas view.
-
Preview: Displays a real-time preview of your design as it will appear on the screen.
-
Mute / Unmute: Toggles audio playback during preview mode.
Layers Panel
Layers Panel shows all Assets and Widgets on the canvas, allowing you to manage their order, visibility, and properties.
Layer List :
Shows all assets and widgets in the design, such as text, shapes, icons, images, and videos.
Each layer is labeled by type or file name for easy identification.
Reorder Layers: Drag and drop layers to change their stacking order on the canvas.
⑨Lock/Unlock (Lock Icon): Lock a layer to prevent accidental changes; unlock it when editing is required.
⑩Visibility Toggle (Eye Icon): Toggle visibility of individual layers without deleting them.
⑪Delete (Trash Icon): Remove the selected layer from the canvas.
⑨
⑩
⑪