177 lines
8.1 KiB
HTML
177 lines
8.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<title>OTS Signs Command Center Documentation</title>
|
|
<meta name="viewport" content="width=device-width">
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
|
|
|
<!-- favicon -->
|
|
<link href="../img/favicon.ico" rel="shortcut icon"/>
|
|
|
|
<!-- Bootstrap -->
|
|
<link href="../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">
|
|
|
|
<!-- Stylesheets -->
|
|
<link href="../manual.css" rel="stylesheet" media="screen">
|
|
|
|
<!-- META -->
|
|
<meta name="keywords" content="digital signage, signage, narrow-casting, ots-signs, open source, agpl, documentation" />
|
|
<meta name="description" content="OTS Signs Command Center is an open source digital signage solution. It supports all main media types and can be interfaced to other sources of data using CSV, Databases or RSS." />
|
|
</head>
|
|
<body data-toc="layouts">
|
|
<!-- Copyright 2020 Xibo Signage Ltd. Part of the Xibo Open Source Digital Signage Solution. Released under the AGPLv3 or later. -->
|
|
<nav id="top-nav" class="navbar navbar-inverse navbar-fixed-top" role="navigation">
|
|
<div class="container">
|
|
<div class="navbar-header">
|
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#ss-navbar">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
<span class="icon-bar"></span>
|
|
</button>
|
|
<a href="#" class="navbar-brand">OTS Signs Command Center Documentation</a>
|
|
</div>
|
|
|
|
<div class="collapse navbar-collapse" id="ss-navbar">
|
|
<ul class="nav navbar-nav">
|
|
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="ss_body container">
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
<ul id="side-nav" class="nav nav-pills nav-stacked">
|
|
<li><a href="index.html" data-toc-name="getting_started">Getting Started</a></li><li><a href="layouts_editor.html" data-toc-name="layouts">Layouts</a></li><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
|
|
<html><body><ul>
|
|
<li>
|
|
<p><a href="layouts_editor.html">Layout Editor</a></p>
|
|
</li>
|
|
<li>
|
|
<p><a href="layouts_editor_using_templates.html">Using Templates</a></p>
|
|
</li>
|
|
<li>
|
|
<p><a href="layouts_editor_library_search.html">Library Search</a></p>
|
|
</li>
|
|
<li>
|
|
<p><a href="layouts_editor_global_elements.html">Global Elements</a></p>
|
|
</li>
|
|
<li>
|
|
<p><a href="layouts_editor_data_widgets.html">Data Widgets</a></p>
|
|
</li>
|
|
<li>
|
|
<p><a href="layouts_editor_editing_tools.html">Editing Tools</a></p>
|
|
</li>
|
|
<li>
|
|
<p><a href="layouts_editor_design_changes.html">Design Changes</a></p>
|
|
</li>
|
|
<li>
|
|
<p><a href="layouts_editor_playlists.html">Add Playlists</a></p>
|
|
</li>
|
|
<li>
|
|
<p class="active"><a href="layouts_editor_widgets.html">Widgets</a></p>
|
|
</li>
|
|
<li>
|
|
<p><a href="layouts_interactive_actions.html">Interactive Actions</a></p>
|
|
</li>
|
|
<li>
|
|
<p><a href="layouts_templates.html">Layout Templates</a></p>
|
|
</li>
|
|
</ul>
|
|
</body></html>
|
|
<li><a href="media_library.html" data-toc-name="media">Media</a></li><li><a href="media_modules.html" data-toc-name="widgets">Modules</a></li><li><a href="scheduling_events.html" data-toc-name="scheduling">Scheduling</a></li><li><a href="displays.html" data-toc-name="displays">Displays</a></li><li><a href="users_administration.html" data-toc-name="users">Users</a></li><li><a href="configure_cms_settings.html" data-toc-name="configure">Configuration and Organisation</a></li><li><a href="troubleshooting.html" data-toc-name="troubleshooting">Troubleshooting</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-9" role="main">
|
|
<h1 id="widgets">Widgets <a href="#widgets" class="header-link"><span class="glyphicon glyphicon-link"></span></a></h1>
|
|
<p>Widgets are a core component of OTS Signs Command Center and are used to display content on a <strong>Layout</strong> or in a <strong>Playlist</strong>.</p>
|
|
<h2 id="feature_overview">Feature Overview <a href="#feature_overview" class="header-link"><span class="glyphicon glyphicon-link"></span></a></h2>
|
|
<ul>
|
|
<li>Selection of powerful Widgets to choose from.</li>
|
|
<li>Create content quickly and easily.</li>
|
|
<li>Integrated content from third parties.</li>
|
|
<li>Show dynamic content on screens.</li>
|
|
<li>Select which Modules to make available to other users of the CMS.</li>
|
|
</ul>
|
|
<p>All Widgets have an associated <a href="media_modules.html">Module</a> which tells OTS Signs Command Center what information is required from the User for configuration as to how it should be displayed.</p>
|
|
<blockquote class="tip"><p>Widgets can be disabled/enabled by an Administrator in the <strong>Modules</strong> section of the CMS.</p>
|
|
</blockquote>
|
|
<p>Widgets are available from the <strong>Toolbox</strong>:</p>
|
|
<ul>
|
|
<li>Click the top button to view available Widgets.</li>
|
|
</ul>
|
|
<p><img src="img/v4_layouts_editor_widgets.png" alt="Widgets" /></p>
|
|
<p>Widgets can be marked as <strong>Favourites</strong> to appear in their own section for easier selection:</p>
|
|
<ul>
|
|
<li>Click the star icon at the top left of a Widget card.</li>
|
|
</ul>
|
|
<p><img src="img/v4_layouts_editor_widgets_favourites.png" alt="Favourite Widgets" /></p>
|
|
<blockquote class="tip"><p>Click the star to deselect from the Favourites section.</p>
|
|
</blockquote>
|
|
<p>Widgets that have an <code>></code> need to be opened to select from additional Widget templates:</p>
|
|
<p><img src="img/v4_layouts_editor_widgets_clock_example.png" alt="Widget Clock" /></p>
|
|
<p>Add to Layouts by drag and drop or click in the Widget card to highlight then click on the canvas to add:</p>
|
|
<ul>
|
|
<li>Position and resize.</li>
|
|
<li>Configure from the available options in the <strong>Properties Panel</strong>.</li>
|
|
</ul>
|
|
<p><img src="img/v4_layouts_editor_clock_configuration.png" alt="Clock Configuration" /></p>
|
|
<p>Next <a href="layouts_editor_data_widgets.html">Data Widgets</a>…</p>
|
|
|
|
</div>
|
|
</div>
|
|
</div> <!-- container-->
|
|
<footer class="ss_footer" role="contentinfo">
|
|
<div class="container">
|
|
<div class="pull-right">
|
|
<img class="img-responsive logo" src="../img/logo.png" alt="OTS Signs Command Center" />
|
|
</div>
|
|
|
|
<p class="ss_back_to_top">Back to Top</p>
|
|
|
|
<p class="ss_footer_links">Currently v4</p>
|
|
|
|
<p class="ss_languages"><a href="../en/index.html">en</a></p>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- JavaScript -->
|
|
<script src="../vendor/jquery/jquery.min.js"></script>
|
|
<script src="../vendor/bootstrap/js/bootstrap.min.js"></script>
|
|
<script type="text/javascript">
|
|
$(document).ready(function() {
|
|
$(".ss-sidebar .list-group li").addClass("list-group-item");
|
|
$(".ss_body img").addClass("img-thumbnail");
|
|
$(".ss_body table").addClass("table");
|
|
|
|
// Set the selected page based on the TOC name
|
|
// Mark the appropriate top nav element as the selected page
|
|
$("#top-nav a").each(function() {
|
|
if ($(this).data().tocName == $("body").data().toc)
|
|
$(this).parent().addClass("active");
|
|
});
|
|
|
|
$(".ss_back_to_top").click(function() {
|
|
$('html, body').animate({scrollTop : 0},800);
|
|
});
|
|
|
|
if (inIframe()) {
|
|
console.log("In Frame");
|
|
$("#top-nav").css("display", "none");
|
|
$(".ss-sidebar").parent().css("display", "none");
|
|
}
|
|
});
|
|
|
|
function inIframe () {
|
|
try {
|
|
return window.self !== window.top;
|
|
} catch (e) {
|
|
return true;
|
|
}
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|