Sie sind auf Seite 1von 49

What is Xibo?

Xibo is a software package which provides a high quality digital signage system for free! Digital
signage is essentially any form of digital display, such as a TV, which is used for showing notices,
public announcements, advertisements, etc.
There are an ever increasing number of software packages that do this job Xibo sets itself
apart in both functionality and cost (Xibo is completely free!). The people behind the Xibo project
believe that the software used to display content shouldnt break the bank and shouldnt be
inflexible, unwieldy or out of date and we are happy that Xibo is none of these things.
Xibo is community driven and open source which means that if there is something you dont like,
you are completely free to change it (or to get it changed by the community).

How does it work?


Xibo is a client/server application which means it comes in two parts.

The Server
The Xibo server is a PHP/MySQL web application which can run on Windows/Mac or Linux. It is
the central administration interface for the display network (if its a network of 1, or 1000).
The server is used to upload content, design layouts, schedule content to the display and various
other administration tasks.

The Client
A client is essentially a display (tv, projector, etc) which you will use to show content. Each
client can have its own schedule of content and layout on screen. Xibo will run on a PC behind
the screen, communicate with the Xibo server and display what its told. It will also report back
exactly what has been displayed and for how long.

The two parts can be on the same physical hardware (usual for a single display installation) or
span multiple different machines across the network the server can even be hosted online!

Features
The Xibo client comes in three flavours the Windows Client, the Ubuntu Linux Client and the
Android Client (Xibo for Android). The windows client was born first and is therefore the client of

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

choice for a stable installation. The Python client has greater potential in the future and will
eventually become the only client for Windows and Linux. Xibo for Android is a commercial
application sold by our sponsor to fund the support and development needed to keep the Xibo
Project running. For more information see the Xibo for Android homepage.
Feature

.Net
Client

Xibo for
Android

Python

Schedule Layouts

Yes

Yes

Yes

Priority Schedules

Yes

Yes

Yes

Video

Yes

Yes

Yes

Flash

Yes

Some Support

No

Images

Yes

Yes

Yes

PowerPoint

Yes

No

No

Text

Yes

Yes

Yes

RSS

Yes

Yes

Yes

Web Page

Yes

Yes

Yes

Embedded HTML

Yes

Yes

Yes

Microblog

No

Yes

No

DataSets

Yes

Yes

Yes

Background Image

Yes (jpg
only)

Yes

Yes

Media Stats

Yes

Yes

No

Layout Stats

Yes

No

No

Report Inventory

Yes

Yes

Yes

File Resume

Yes

Yes

Yes

Counter Media

No

Yes

No

Socket Listener

No

Yes

No

Lift/Serial Interface Support

No

Yes (16 inputs / 4 per serial


No
port)

Client Runtime Information


Screen

Yes

Yes

Yes

Offline Update via USB Drive

No

Yes

No

Full Compositing (overlapping

No

Yes

Yes

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Feature

.Net
Client

Python

Xibo for
Android

regions)
Webpage Transparency

No

Yes

Yes

Video Transparency

No

Yes

Yes

Image Transparency

No

Yes

Yes

Download the latest Xibo release and start running your Xibo network today!

What if I am not technical?


If you arent technical then dont worry Xibo has a great community to back you up and help
you along the way. Take a look through the archives on Launchpad or ask a new question to get
the help you need.
The Xibo project is backed by Spring Signage this means Spring Signage maintain the Xibo
code base, the Xibo Wiki and manage the development and release of new features. We also
provide low price hosting for Xibo to help people without the technical abilities or infrastructure
get access to Xibo and all the benefits it provides.

When, where and who?


At its birth in 2004, Xibo was the university project of James Packer, however it quickly became
much more than that. James took Xibo with him after graduating and with the help of Daniel
Garner, started developing Xibo in earnest.
Xibo was first installed in a live environment at Longhill High School, where the schools digital
signage project was being managed by Alex Harrington.
It was released to the public under the AGPLv3 open source license in 2006 and since then Xibo
has been under continual development adding new features, improved stability, a shiny new
client and lots more. Since being open sourced the Xibo project has been financially backed by
Spring Signage Ltd, who offer Xibo as a hosted signage service.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Contents
[hide]

1 Introduction

2 Install on Linux
o

2.1 Setup Apache and PHP

2.1.1 Ubuntu

2.1.2 CentOS 5.x / Redhat RHEL 5.x

2.1.3 SuSe

2.2 Install Xibo

3 Install on Windows
o

3.1 Install the Webserver (XAMPP)

3.2 Install Xibo

4 What you need to know!

Introduction
This document is a work in progress . Complete is an install guide for Windows systems. Eager Linux
users should follow the instructions for their distribution, and then skip to the "Installing Xibo" section of
the Windows install guide to install Xibo itself.
The server component of Xibo is written in PHP and therefore requires a webserver to make it work. It also
needs a database server and PHP installed.
There are several install guides on this page, depending on the operating system you've chosen to run Xibo
server on.
If you already know your way around webservers, PHP, MySQL etc then you can skip to the "What you
need to know!" section which gives the bare facts in the shortest amount of characters possible.

Install on Windows
This Windows install guide is focused mainly on someone who wants to use a Windows PC to be the
server as well as the client, or perhaps has a spare Windows XP machine to use as a server. The
instructions should work equally well on Windows Server operating systems.
Xibo should also run under IIS, however it's not a platform the Xibo development team currently tests
with. If you know your way around IIS, then the latter half of this guide plus the "What you need to
know!" section should get you going.

Install the Webserver (XAMPP)


We'll be using XAMPP to install Apache, MySQL, PHP (amongst other things) to support Xibo. This is
convenient as it provides the whole system in a single installer, and can be uninstalled via Add/Remove
Programs at a later date if required. If you already have XAMPP installed, you can skip to the next section.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

You can download XAMPP from Apache Friends. You need to download the full XAMPP Installer
package for Windows systems. Save it to the Desktop.
Note: New versions of XAMPP come with PHP 5.3.1 or later. We have some reports of the webservice in
Xibo that uses the nuSOAP library not working properly with PHP > 5.2. You can download XAMPP 1.7.1
here which comes with PHP 5.2.9 and should work for everyone.
Once XAMPP Installer has downloaded, double click on it to run it. You may be prompted to allow the
installer to run as the publisher could not be verified. Click "Run".
You should get to the start of the install wizard.

XAMPP Installer Running


By default, XAMPP installs to "c:\xampp". Unless you need to move it somewhere else, then that's a good
choice. If you do select a different directory, remember it for the next step when we install Xibo. Click
Install. The installer will now run, and extract a number of files. When it finishes, it will bring you to a
command prompt.
You'll now be asked a few questions about how XAMPP should install itself. At the following prompts,
you may select all default options.

XAMPP Command Prompt 1

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

XAMPP Command Prompt 2

XAMPP Command Prompt 3

XAMPP Command Prompt 4


Once the installation scripts complete, you should choose option 1 to load the XAMPP Control Panel. It
should open up, and if everything went to plan, look like the screenshot.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

XAMPP Control Panel


At this point, you need to check the boxes next to "Svc" for both Apache and MySql. As you click each, it
will prompt you to install the service for that item. Click OK. Then click the "Start" button on each of these
items as well. Your screen should now look like the below:

XAMPP Control Panel Started


Before we install Xibo, we need to configure a few things on XAMPP to make it a bit more secure. From
the XAMPP Control Panel, click the "Admin" button next to MySQL. This will load a web browser and
take you to an application called PHPMyAdmin that was installed along with XAMPP. It will let us setup a
password for the "root" MySQL account. The "root" account on MySQL has privileges to add new users,
create databases etc so needs to have a strong password.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

From the PHPMyAdmin screen, click "Privileges" at the top of the screen. You'll see the database users
that exist already listed. We're interested in the one called "root" that has "localhost" in the "Host" column.
Click the blue "Edit Privileges" symbol to the right of the word "Yes".

PHPMyAdmin Privileges
Scroll down the page until you find the "Change Password" box. Enter a new password in both the
password boxes and click "Go". On a piece of paper, write down "MySQL Admin User details. Username:
root Password:" followed by the password you just chose. We'll need these later!

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

PHPMyAdmin Change Password


Install Xibo
Now we have XAMPP setup, we can get on with installing Xibo.
Firstly, go to the Xibo website and download the latest server zip file. The zip file is prepared for Windows
systems, whereas the .tar.gz files are prepared for Unix-like systems. Save the zip file to your Desktop.
Once the download completes, browse to C:\xampp\htdocs. (Unless you changed the target directory for
Xampp in the last section, in which case you'll go to the directory you selected then.) Go "File -> New
Folder". Name the new Folder Xibo and press Enter. Now double click on the folder to open it. This is
where we're going to install the Xibo server.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Xibo Install Folder


Arrange the desktop so you can see both the new Xibo folder we created and the zip file we downloaded
earlier. (see screenshot). Double click on the zip file and then double click on the xibo-server-1.0.2 folder
inside it. Now we need to extract all these files in to the folder we created earlier.
Go "Edit -> Select All" then "Edit -> Copy" now go to the Xibo folder window we left open and go "Edit
-> Paste". You should see the files extract in to the Xibo folder.

Extracting the Xibo Installation Files


Once the files finish extracting, you can close the zip archive window. That should leave you with a folder
that looks like this. Close the window.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Files Extracted
Next we need to make a folder for Xibo to store the media (images, videos etc) that you'll upload to be
shown on the displays. Crucially this must NOT be inside the Apache Document Root folder. Go to
"My Computer", then "Local Disc C:". You may need to click "Show contents of this folder" to see the
files inside it. Go "New -> Folder" and name the folder "XiboLibrary". Write on your piece of paper
"Library Directory: c:\XiboLibrary". We'll need that information later!
Now open your web browser (Mozilla Firefox, Internet Explorer etc). In the address bar, enter
"http://localhost/xibo". You should see the Xibo Installer start screen. Click "Next".

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Xibo Installer Start


First the installer checks everything we need is installed. XAMPP provides everything for us, so you
should see a long list of green traffic lights indicating everything is OK. Click Next.
Next, the installer asks us about creating a database for Xibo to use. Since we've not created a database,
click on "Create New".
The installer will now ask us for information to allow it to create the database for us. The "Host" box is
prefilled with "localhost". We don't need to change that. The next two boxes are Admin Username and
Password. We wrote these down when we configured MySQL earlier. Fill in "root" in the Admin Username
box and the password you chose in the "Admin Password" box. The final three boxes specify the name of
the database to create - "xibo" is fine - the name of a new database user to create, again "xibo" is fine - and
a password for that user. You can enter anything here, but make a note of the password you chose. When
all the boxes are filled in, click "Create".

Xibo Installer Database Options


The installer will now create a new database and user for you, and load in the default database for Xibo.
You should see a series of dots appear on the screen as this happens. It can take a few moments to
complete. Assuming everything went well, click "Next".
Now we need to choose a password for the xibo_admin user. This is the first user in the xibo system, and is
the person who typically administers Xibo (does updgrades etc). Choose a password for the user and enter
it in both boxes. Make a note "Xibo Admin: Username: xibo_admin Password:" and then the password that
you chose. You'll need this to log on, and to perform upgrades at a later date. Once both boxes are
completed, click "Next".
Assuming the password you chose was acceptable, you'll be told the password change succeeded. Click
Next.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

The next screen deals with configuring Xibo. The first box asks for the location that Xibo should store the
media you upload. We created a folder for this earlier and wrote it down. Enter the directory you wrote
down next to "Library Directory", eg "c:\XiboLibrary".
The next box asks for a server key. You can think of this as a password for adding client PCs to the system.
Choose something obscure. You won't have to enter this very often. Make a note on your piece of paper.
You'll need to refer to this when installing the client.
The final tick box asks if it's OK to send anonymous statistics back to the Xibo project. There's information
on exactly what we collect is available here. If you're happy for that to happen, tick the box. Otherwise,
untick it. Click "Next".
If everything went well, you'll be told so. Click Next.
And we're done. You should be presented with a link to log in to your new Xibo system. Click the link and
log in with your xibo_admin username and password.

http://wiki.xibo.org.uk/wiki/Manual:TOC
Install Guide NET Client
From Xibo
Jump to: navigation, search

Contents
[hide]

1 Prerequisites

2 Installation
o

2.1 Step 1

2.2 Step 2

2.3 Step 3

2.4 Step 4

2.5 Step 5

3 Configuration

4 Windows Modifications

Prerequisites
Before attempting to install the Xibo Client please ensure the following prerequisites are met.

A network connection to the Xibo Server (possibly over the Internet)

Microsoft Windows 2000/XP/Vista/7

.NET Framework v3.5 SP1

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Internet Explorer 7 or 8

Flash Player Version 9 or later

Windows Media Player 11 or later

For Powerpoint support, Microsoft Powerpoint 2003 or later. Powerpoint


viewer is not suitable.

Installation
Step 1

You may see the following security warning when installing Xibo.

Please click on "Run" to begin the installation.

Step 2
The installer presents a welcome screen:

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Please press "Next".

Step 3
Choose the location where Xibo should be installed. The default location should normally be sufficient,
however to change the location click browse.

After making the selection (or if leaving to the default) click "Next" to continue.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Step 4
A confirmation message is then shown

When happy with the selections made click "Install" to begin. Otherwise click "Back" to correct any errors.

Step 5
The Installation is complete. Click finish to exit.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Configuration

Client Options Dialogue

Open the client configuration dialogue by going to "Start -> Programs ->
Xibo Player -> Xibo Client Options"

Fill in the address of your Xibo server in the "URI of the Xibo server" box. If
your Xibo server is on the same machine as the client, enter
"http://localhost/xibo" or similar. If Xibo server is installed on a different
computer, enter the IP address or hostname of the machine the Xibo
server is installed on - for example "http://192.168.0.4/xibo" or
"http://my.server.name.com/xibo" or similar.

Enter your server key in the "The server key for the Xibo server" box. If
you can't remember the key you'll find it in the Settings dialogue on the
Management menu in the web interface on the server.

The "Local Library Location" defaults to a folder called "Xibo Library". It's
used to cache content from the Xibo server so that the client can continue
to play if the connection to the Xibo server is lost. If you want to change to
a different folder, use the "Browse" button to choose an alternative. Note
that you must NOT use the server's library location (if it's on the same PC
as the client or via a file share)

"The collection interval for content" is the interval in seconds that the
client will poll the server for new content. The more frequent the
collections, the quicker the client will update when changes are made on
the server - but at the expense of bandwidth and possibly minor freezes in
things like scrolling text when the collection happens. We don't
recommend values lower than 60 seconds.

"The unique key for this client" is a unique identifier for this client
machine. It's generated from a mix of Windows system identifiers and your

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

hardware. If you're installing for the first time, there's no need to amend
this value. If you're changing hardware or want to have two clients using
the same server account then you can edit the key as required.

"Scroll step amount" is the number of pixels scrolling text will move by
each time scrolling text items are told to move. You should leave this set
to 1px.

Tick the "Enable Powerpoint" box if you have the full version of PowerPoint
2003 or later installed and want to use PowerPoint media items. Be sure to
read the notes on Powerpoint setup here: Windows Modifications.

Tick the box if you want the client to send statistics back to the Xibo
server. This will generate alot of data that will be stored in the Xibo
database. If you don't have any specific use for statistics, we recommend
you turn this option off.

Click the "Save" button.

If you use a proxy server to access your Xibo server, go to the "Proxy
Server" tab and fill in the details for your network, then click "Save". Make
sure to set your proxy information in Internet Explorer too.

Finally go to the "Register Display" tab.

Optionally rename the client by entering a name in the "Display Name"


box. It defaults to the hostname of the PC.

Click the "Register" button.

You should see a message "Display registered and awaiting licensing".

If you don't get that message, ensure you entered the correct URL for the
Xibo server, and that your server key is entered correctly.

Now log in to the server web interface, go to the Management Menu and
then "Displays".

You should see your newly registered client in the list. Click the "Edit"
button next to the display.

The "License Display" option will automatically swap to "Yes".

Optionally select a different default layout (the layout the client will play if
nothing is scheduled).

Click "Save"

You can now start the Xibo Client software. It should show you the Xibo
splash screen while the default layout (and anything else you have
scheduled) is downloaded and then begin playing layouts.

Windows Modifications
Here are some suggested settings for Windows / Powerpoint for a Display Client:

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Turn off all screensavers

Turn off screen power saving

Load the "No Sounds" Sound Scheme (Control Panel -> Sounds and Audio
Devices Properties)

Set a plain wallpaper (Hopefully nobody will see it, but you might need to
reboot a client, or restart Xibo and a sane wallpaper is a help :D

If the client is accessible from where you manage your displays from, you
might want to install UltraVNC server so you can connect in and check on
the client from time to time. Use the "View only" option in the VNC client
to avoid disturbing the display.

Set Windows to log on as your display client user automatically

Disable balloon tips in the notification area

Disable Windows Error Reporting. Occasionally Powerpoint seems to


"crash" when Xibo closes it. Unfortunately this leaves an unsightly
"Powerpoint has encountered a problem and needs to close" message on
the display. Follow the steps here to disable Windows Error Reporting
completely - including notifications.

Also disable Office Application Error reporting. Follow instructions at


KB325075 or merge this registry patch.

If you're using Powerpoint, then there are a couple of extra steps:

The first time you run Xibo with a Powerpoint, you might get a popup
appear that asks what Xibo should do with the Powerpoint file. The popup
actually originates from Internet Explorer. Choose to "Open" the file, and
untick the box so you won't be prompted again.

In some circumstances, you may find that Powerpoint, the application,


loads instead of the file opening within Xibo itself. If that happens, try
merging this registry patch. (Taken from pptfaq.com). Users of Powerpoint
2007 should go to Microsoft KB927009 and run the FixIT application
instead. Users of PowerPoint 2010 should go here instead KB982995

Note also that Powerpoint will put scroll bars up the side of your
presentation, unless you do the following for each Powerpoint file BEFORE
you upload it:

o Open your Powerpoint Document


o Slide Show -> Setup Show
o Under "Show Type", choose "Browsed by an individual (window)" and then
untick "Show scrollbar"

INSTALL XIBO

client

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Bila klik fail xibo-client-1.4.2-win32-x86 terdapat pop up yang


memberi amaran ke tentang securiti pada windows seperti di
bawah:

Pastikan semua di tanda betul

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

root
1qaz2wsx

1qaz2wsx

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

1qaz2wsx
1qaz2wsx

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

http://localhost/xibo/index.php

user name:

xibo_admin

password:

1qaz2wsx

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Xibo client. Same pc

CARA NAK BESARKAN FAIL YANG BOLEH DI UPLOAD DAN DISIMPAN DALAN XIBO
SERVER
1. upload_max_filesize, memory_limit and post_max_size in the php.ini
configuration file. All of these three settings limit the maximum size of data that
can be submitted and handled by PHP. You may also need to change Maximum
execution time setting.

Ada dalam C:\xampp\php

fail php.ini

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

XIBO BASIC CONFIGURATION


Overview
Xibo tries very hard to be simple and intuitive to use, however it's good to have a basic
overview of the components that make up Xibo, how they interact and also to understand the
terms we'll use in this manual.

Glossary of Terms
Content
See Media
Dashboard
The first component to be presented when the user logs in is the Dashboard. This is
used to provide all the components that the user is allowed to access. The dashboard is
an easy and intuitive feature for navigating the Xibo server interface and provides an
outline of the applications components. It is particularly useful for first time users of
Xibo.
Groups
Xibo put every user of the system in to at least one group. Users can share content
with users in the same groups as them, or with global groups (eg Public).
Layouts
A layout is a collection of Media items in their regions, together with their positioning
on the screen and a background colour or image. You could think of a layout as a
single slide in a slide show.
Media
The actual images, videos etc that you want to show. These could be text, images,
videos, formatted RSS feeds, flash, Microsoft Powerpoint files, HTML or links to
webpages.
Navigation Bar
The primary means of going between the different areas of the Xibo server interface.
You'll find this near the top of every page in the server interface. It shows what
components the user logged in has access to - and provides an intuitive "click to
nagivate" interface to the main areas of the system. The navigation bar can also drop
down where there are lots of options to show.
Region
A region is transparent box that is placed on the background in a layout to contain a
sequence of media items.
Schedule
A list of layouts and their assigned windows to be shown on a display client.
Scheduling
The act of assigning layouts to display clients together with information about when
the client should show that layout.
Template
Xibo ships with a set of default templates that setup a blank layout for various screen
shapes. It is not currently possible to edit these.
Users

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

All actions in Xibo - content creation, schedules etc - are attributed to a user. This
information, along with a permissions system, allows users of the system to share
things they have created in the system with each other and also allows "admins" of the
system to oversee what is being shown on displays. Users also have a "Home Page".
This will become their "Dashboard" page. Using the home page users can be directed
to a simple page allowing very restricted access to Xibo - or a complex page showing
all components available.

Dashboard
The Dashboard is the first page you see once you've logged in to Xibo.

Dashboard Screenshot
Icons

Schedule - Access the schedule for each display, and schedule new or existing layouts
to displays.

Layouts - Create, edit or delete layouts

Library - Create, replace or delete media items

Templates - View the templates that are offered to users when they create new layouts.

Users - Allows administration of users on the system (Admins Only)

Settings - Xibo configuration settings (Admins Only)

License - Information about the licenses Xibo is released under.

Manual - Access the online manual

Navigation

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

The navigation bar appears on every page in the Xibo server interface. It's the quick way to
jump between the main sections of the server.
Most of the options directly mirror those available on the Dashboard. The main exception to
this is the Management Menu - which is only displayed to Admins. It has the following links:

Displays
o Maintain your licensed displays
o Revoke the license of a display
o Rename a display
o Change the default layout for the display
o Toggle Auditing of the display

Groups
o Add a new group
o Alter a groups permissions

Users
o Add a new user
o Edit a users settings
o Delete a user
o Set a users homepage
o Override a users password

Log
o The log page provides detailed messages about the system. These are normally
required when reporting bugs or asking for help.

License
o The license page provides details of all the relevant licenses for the system.

Sessions
o Sessions provide details of the current user activity on the network.

Settings

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

o Settings is used to provide a set of defaults for content and system


configurations.

Navigation Bar Screenshot

Overview
A layout is made up of a background picture or colour. On top of that, one or more
transparent boxes, or "regions", are drawn, which can contain one or more media items
(pictures, videos etc). Let's look at a finished layout as shown on the digital sign, and then
work out how it was constructed.

Example Layout
Here you can see a screen that you might find in a hotel conference centre. It's showing the
itinerary for two conference suites and a news feed from the BBC. Let's take a look at how it
has been constructed:

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Example Layout - Designer View


This is the designer view for Xibo. You can see the background image, and on top of it is
drawn six regions (each identified by the dashed lines). The regions contain images, text and
an RSS Ticker. Now that we understand the basic makeup of a Xibo layout, we can make a
new one.

Notice for Opera Users


The Opera browser does not allow Xibo to substitute its own context menu when rightclicking in the layout designer. It is therefore not possible to perform certain operations in the
Opera Browser. Users are advised to use Mozilla Firefox, Google Chrome, Safari or Internet
Explorer instead as these browsers do not have such a limitation.

Adding Layouts
To add a new layout:
1. From the dashboard, click on "Layouts".
2. Click "Add Layout"
3. A new layout form will appear:

1. Fill in all the required fields, and any other fields you wish to complete.
2. Click Save
The fields on the Add Layout form are described as follows:
Name (Mandatory)
A name for this layout. This is how you will refer to it later on when scheduling or
editing the layout.
Description (Optional)
A description of the layout.
Tags (Optional)
Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

A space-separated list of keywords to apply to the layout. These could be used to


identify groups of layouts or sometimes have special meaning if you have specialised
versions of the Xibo client.
Shared (Mandatory)
Choose who can see this layout in Xibo. Private means only you (and Admins) can
see the layout. "Group" means people in your group can see the layout and "Public"
means everyone can see it.
Template (Mandatory)
Optionally you can choose a template to base your new layout on.
Choosing the right template
Xibo comes with a selection of default templates which we think will cater for most digital
signage applications (eg LCD TVs, projectors, portrait screens).
The Xibo client will make its best effort to fit whatever shape layout you choose on to the
screen, however sending a client a layout in a 4:3 aspect ratio when it's connected to a 16:9
TV wastes two bars on either side of your content.
Try to choose a template with the closest aspect ratio to the screen you'll be showing the
layout on. Here's a list of typical displays and the template to choose:
LCD/Plasma Widescreen TV
LCD TVs tend to be either 16:9 aspect ratio. Try "Full Screen 16:9" first. If you find
there are slim black bars to the top and bottom of your fullscreen content, try
switching to "Full Screen 16:10".
Widescreen Projectors
Widescreen projectors can be 16:9 or 16:10 so you'll need to try both and see which
fits best.
Widescreen Computer Monitors
Widescreen Computer Monitors are usually 16:10 but there are a few 16:9 ones out
there. Try "Full Screen 16:10" first.
Computer Monitors
Non-widescreen computer monitors are usually 4:3 aspect ratio. Try "Full Screen
4:3".
CRT Televisions
Old TVs tend to be either 4:3 or 3:2 aspect ratio. Try "Full Screen 4:3" or "Full Screen
3:2" and see which fits best.
There are also specialist versions of all the above displays that are turned on their side. Called
"Portrait" displays, they are taller than they are wide. Xibo supports all the above aspect
ratios for portrait screens - 2:3, 3:4, 9:16, 10:16. Consult your display manufacturer to find
out which aspect ratio to choose.

Layout Designer
Once you've created a new layout, you should see a screen like this:

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Layout Designer Screenshot


Here we can see the new layout we've created. Since we based it on one of the Full Screen
templates, you can see it's a wide screen aspect ratio and has one region that fills the entire
screen.
Changing the Background
You can change the background colour or choose a background image if you wish. Click the
Background button.

Layout Designer Screenshot - Background


Background Colour
Select a colour from the list of available background colours.
Background Image
Choose a background image that has been uploaded already.
Resolution
Choose the aspect ratio of the layout. Since you used one of the Full Screen templates
that came with Xibo, there is usually no need to change this.
Try choosing a new background colour and click Save.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

To resize the region, click and drag the green handles on the left and bottom edges of the
region to make it smaller, then click and drag on the region itself to move it around the
layout.

Adding Regions
As you make the region smaller, you'll see the background behind. Right click on the
background and choose Add Region.

Layout Designer Screenshot - Add Region


You'll see a new region appear. You can move it around or resize it in the same way as you
did before.

Removing Regions
If you decide you don't want a region any more, right click on it and choose "Remove
Region". Note that you will loose any media items contained in the region that aren't in the
library (eg Text, RSS Tickers, Embedded HTML).

Region Permissions
Assigning Media
Now that you have one or more regions, we need to put some media in the regions so there's
something to show.
To edit a region's timeline (the sequence of media items that the region plays), double click
on the region. You'll see the timeline appear:

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Region Timeline
The top of the Region Timeline is a sequence of icons representing the different types of
Media you can assign to the region.
Library
The first button is the Library. This takes you through to a list of media items that
have already been uploaded either in the Library section or in a previous layout.
Image
Add Image lets you upload a new Image.
Video
Add Video lets you upload a new Video.
Powerpoint
Add Powerpoint lets you upload a Powerpoint file.
Text
Add Text lets you type in some text and format it.
Flash
Add a Adobe Flash swf file
Webpage
Embed an external webpage
Ticker
Reformat an RSS feed in to a Ticker (scrolling or static text)
Embedded HTML
Embed some HTML
MicroBlog
Search the Identi.ca and Twitter Microblogging services and display the results
formatted by a template
Counter
An on-screen count up/down timer for use with paper ticket systems
DataSets
Display data sets data
Your administrator may have turned some of these media types off, or added new ones. We'll
look at each of the standard Xibo media types in detail here.
Image
You can upload your images to show on a Xibo layout. Currently JPEG, PNG, and GIF files
are supported. Transparency is supported in PNG and GIF files, (although NOT if used as
background images).

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Add an image
1. Click the "Add Image" icon
2. A new dialogue will appear:

3. Click "Browse"
4. Select the image file you want to upload from your computer. Click OK
5. While the file uploads, give the image a name for use inside Xibo. Type the name in
the "Name" box.
6. Use the Sharing box to decide who else can see this image.
7. Finally enter a duration in seconds that the image should remain in the region until the
next media item should appear.
Note that if this is the only media item in a region, then this is the minimum amount of
time the image will be shown for as the total time shown will be dictated by the total
run time of the longest-running region on the layout.
8. Click "Save"
Video
You can upload your videos to show on a Xibo layout. Currently MPEG, and WMV files are
supported.
Add a video
1. Click the "Add Video" icon

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

2. A new dialogue will appear:

3. Click "Browse"
4. Select the video file you want to upload from your computer. Click OK
5. While the file uploads, give the video a name for use inside Xibo. Type the name in
the "Name" box.
6. Use the Sharing box to decide who else can see this video.
7. Finally enter a duration in seconds that you want the video to play for, or 0 to play the
entire video.
Note that if this is the only media item in a region, then this is the minimum amount of
time the video will be shown for as the total time shown will be dictated by the total
run time of the longest-running region on the layout. Videos do not loop automatically
so you need to add a second media item in the region with the video to cause it to play
again.
8. Click "Save"
Flash
You can upload Flash swf files to show on a Xibo layout.
Add a Flash File
1. Click the "Add Flash" icon
2. A new dialogue will appear:

3. Click "Browse"

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

4. Select the Flash file you want to upload from your computer. Click OK
5. While the file uploads, give the flash file a name for use inside Xibo. Type the name
in the "Name" box.
6. Use the Sharing box to decide who else can see this flash file.
7. Finally enter a duration in seconds that you want the flash file to play for.
Note that if this is the only media item in a region, then this is the minimum amount of
time the presentation will be shown for as the total time shown will be dictated by the
total run time of the longest-running region on the layout.
8. Click "Save"
Note that the C# control used in the Xibo .net client cannot render the background of
Flash files transparently. Flash is always rendered on a white background.
Powerpoint
You can upload Microsoft Powerpoint files to show on a Xibo layout.
Add a Powerpoint Presentation
1. First prepare the Powerpoint Presentation. Powerpoint will, by default, put scroll bars
up the side of your presentation, unless you do the following for each Powerpoint file
BEFORE you upload it:
1. Open your Powerpoint Document
2. Slide Show -> Setup Show
3. Under "Show Type", choose "Browsed by an individual (window)" and then
untick "Show scrollbar"
4. Click OK
5. Save the Presentation
6. Note also that Xibo will not advance the slides in a Presentation, so you
should record automatic slide timings by going to "Slide Show -> Rehearse
Timings" and then saving the presentation.
2. Once your Powerpoint file is prepared, click the "Add Powerpoint" icon

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

3. A new dialogue will appear:

4. Click "Browse"
5. Select the Powerpoint file you want to upload from your computer. Click OK
6. While the file uploads, give the presentation a name for use inside Xibo. Type the
name in the "Name" box.
7. Use the Sharing box to decide who else can see this presentation.
8. Finally enter a duration in seconds that you want the presentation to play for.
Note that if this is the only media item in a region, then this is the minimum amount of
time the presentation will be shown for as the total time shown will be dictated by the
total run time of the longest-running region on the layout.
9. Click "Save"
Text
You can add text directly to Xibo layouts. Text is specific to the layout it's added to. It doesn't
go in the library so you'll need to copy/paste between layouts if you want to use text on more
than one layout. The reason for this is that it very quickly becomes unmanageable to have
named text strings in the library - especially when you have minor variations.
Note: A certain amount of experimentation is required when sizing text. The text preview in
the web interface can be misleading about how the text will finally fit on the layout. If
possible, preview a new layout on a display to see how the text fits, and make any
adjustments required to get the layout as you want it.
Add Text
1. Click the "Add Text" icon

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

2. A new dialogue will appear:

3. You'll see the text editor. Xibo uses FCKeditor for text input. Its format is very similar
to many word processing applications you may have used in the past. Complete
documentation for all the buttons is available over at FCKEditor's website here: [1]
4. Type in the text you want to add.
5. To change the font, highlight your text and choose a new font from the "Font"
dropdown menu.
6. To change the size, highlight your text and choose a new size from the "Size"
dropdown menu.
7. To change the colour, highlight your text and choose a new colour from the font
colour pallet icon
8. Bold, italic and underline are available using the respective icon:
9. Enter a duration in seconds for the text to be on the layout. Note that if this is the only
media item in a region, then this is the minimum amount of time the text will be shown
for as the total time shown will be dictated by the total run time of the longestrunning region on the layout.
10. Optionally select a direction for the text to scroll in. Available options are Up, Down,
Left and Right.
11. If you've selected to scroll the text, you can control the speed of the scrolling by
editing the "Scroll Speed" value. Lower numbers cause the text to scroll faster.
12. When you're happy with your text, click the "Save" button.
MicroBlog

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

The MicroBlog module searches Identi.ca and/or Twitter for the search term you specify and
then displays posts that contain that term one at a time with a fade transition between items.
Adding a MicroBlog search:
1. Click the "Add MicroBlog" button
2. A new dialogue will appear:

3. First choose which service or services you want to search. Tick either the Twitter or
Identica boxes, or both.
4. Next enter a search term. This is the word you want to search for.
5. Enter a duration in seconds. This is the total time you want the media to be shown for
(as you would for any other Xibo media item)
6. The Fade Interval box controls how long, in seconds, the fade in and fade out
animations run. 1 second is a sensible default.
7. Speed controls how long each post is displayed in seconds. 5 seconds is a sensible
default.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

8. Update Interval controls how often, in minutes, the client will connect to the
microblog services and search for new content. Twitter limits the number of searches
you can do over a fixed period so I'd suggest setting this to around 10 minutes.
Cached content is shown between updates.
9. History Size tells the client how many items to hold in local cache. When the client
connects to the microblog services for new content, all new posts that match the
search term are collected and displayed, however only the newest number of posts
specified by History Size are cached to disk for display later.
10. The Template tells the client how to format the posts. You can put in several tags to
represent content from the posts.
1. [text] - The main message from the post
2. [from_user] - The username of the person that made the post
3. [service] - The service that the post came from
4. [profile_image_url] - The url of the post author's avatar image. You can
change the template editor to source mode to add in an image using that url
directly. Note that those images aren't cached to disk so require a working
internet connection to be displayed.
5. You can extract any value returned by the Twitter or Identica API. Twitter
Search for Xibo will show you the JSON result of a query on their API for the
term "Xibo". You can use this to get the names of any other tags you may want
to display.
11. The Default block is what the client will display if the search returns no results or if
there is no cached content and the services could not be contacted.
Counter
The counter module provides an on screen counter which counts up or down in response to
key presses (or to key presses generated by a wireless presenter style remote control - often
used to control PowerPoint presentations).
It was originally written to cater for paper ticket systems where customers entering a business
premises take a number from a dispenser and wait for their number to be called before
obtaining a product or service.
In it's most basic form, there's no need to add a Counter media type at all. From v1.3.0 of the
Python client, you can simply press Page Up or Page Down keys on the client machine (or
via a wireless presenter style remote) and a popup overlay will appear displaying the current
counter number.
This popup overlay can be styled and configured using the configuration variables in the
client site.cfg file as follows:

nextScanCode=112 - Keyboard scan code used to increment the counter

resetScanCode=0 - Keyboard scan code used to zero the counter

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

prevScanCode=117 - Keyboard scan code used to decrement the counter

maxCount=99 - Number the counter should count up to or down from

osdBackColour=000000 - HTML/Hex colour for the popup background

osdBackOpacity=0.7 - How opaic the background of the popup should be

osdFontSize=270 - Font size of the number displayed in the popup

osdFontColour=ffffff - Font colour of the number displayed in the popup in


HTML/Hex

osdWidthPercent=40 - Percentage of the width of the screen that the popup should
occupy

osdTimeOut=5000 - How many milliseconds the popup should be displayed for

If you're not sure what scan codes there are, you can press "i" then "l" with the client running.
That will popup the on-screen logging. Any key press that isn't currently being used will
generate a log message with the scan code for that key - so you can get the code you need and
alter the client configuration.
You can also embed the counter number in a region. If you choose to do that, you can
optionally disable the popup overlay whilst that region/media item is on the screen.
1. Click the "Add Counter" icon
2. A new dialogue will appear:

3. The "Popup Notification" box enables or disables the popup overlay. Leaving the box
unticked will disable the popup while this media item is being shown on screen.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

4. The "Duration" box is the number of seconds the counter should be shown on screen
for.
5. The final box is a WYSIWYG HTML editor. You'll see a \[Counter\] tag. You can
style that tag however you want the counter value to be shown on the screen. You can
also add additional text before and/or after the tag which will also be displayed.

Permissions

Previewing Regions
In the Layout Designer, each region has two blue arrows on it when the mouse is over the
region. Clicking on the blue arrows steps forwards and back through the media items
assigned to that region. Where possible, a preview of the media is shown in the region. If it's
not possible for us to show you a preview, an icon is shown in its place. A media information
popup is also shown giving the name of the media and its duration in seconds.

Layout Designer Preview

Changing the Region Timeline


You may wish to change the order that media items appear in a region. The Layout Designer
has the ability to reorder media in a region after it has been added. This is achieved through
drag and drop.
1. Find the region you wish to edit
2. Double click the region to open the Region Timeline
3. Each item on the timeline is separated by a vertical line. Click and hold your mouse
pointer over the item you want to move and drag it.
4. Release the mouse button when it touches the vertical line next to your desired final
position.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Limitations
We appreciate this features UI is not ideal. If you are having problems after following this
article please refer to the below links:

Suggested Improvements (https://blueprints.launchpad.net/xibo/+spec/regiontimeline-improvements)

Bug for UI issues (https://bugs.launchpad.net/xibo/+bug/376585)

Contents

1 Overview
o 1.1 Editing Layouts
o 1.2 Copying Layouts
o 1.3 Deleting or Retiring Layouts

1.3.1 Retiring a Layout

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

1.3.2 Deleting a Layout

o 1.4 Layout Permissions

Overview
Editing Layouts

Allows the user to edit an existing layout.


The Name of the Layout - (1 - 50 characters)
An optional description of the Layout. (1 - 250 characters)
Tags for this layout - used when searching for it. Space delimited. (1 - 250 characters).
Retire this layout or not? It will no longer be visible in lists

Copying Layouts

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Allows the user to copy an existing layout leaving the original intact.
1. From the Layouts screen, choose the "Copy" button next to the layout you want to
copy.
2. Enter a name for the new copy of the layout
3. Click Copy
Once the layout has been copied, you can then edit/design it by selecting the appropriate
button from the Layouts list.

Deleting or Retiring Layouts


When you're finished with an old layout, you can optionally hide it in the Xibo Server (incase
you want to reuse it at a later date) - we call this retiring a layout - or you can delete it
completely.
Retiring a Layout

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

1. Choose the Edit button next to the layout you want to retire in the Layouts screen.
2. Select "Yes" from the Retired dropdown box.
3. Click Save
The layout will disappear from the Layouts screen. Use the Filter options to show retired
layouts if you want to view retired layouts. You can then edit a retired layout to un-retire it at
a later date.
Deleting a Layout

1. Choose the Delete button next to the layout you want to delete in the Layouts screen.
2. Note that deleting a layout is irreversible so be very sure that you don't want the
layout before you delete it.
3. Press Yes to delete the Layout or No to cancel the deletion.

Layout Permissions

Scheduling
Overview
Scheduling is straightforward in Xibo, but there are some important things you need to know
about how the software works if there are very specific schedules you want to run.
Firstly, Xibo is not designed to show a blank screen at any time. In display Management
when you set each client up, you're asked to choose a default layout for that display. If at any
time there are no layouts scheduled to run, the default will be run automatically.
Xibo supports scheduling more than one layout at once - in fact that's how it's intended to
work. Say you have two layouts, each that last a total of 40 seconds. If you wanted them to
show in sequence between 10:00 and 11:00am, you'd schedule both layouts to run from
10:00am to 11:00am on the same display. The client will automatically switch between the
two layouts every 40 seconds between those times.
If you want to mix in the default layout all the time, then set "Interleave Default" to true in
the Display Management menu and your default layout will be included in the cycle.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

The Calendar
Schedule Now

Schedule Now is a quick way to schedule a given layout on a display or display group.
1. From the Layouts screen, choose the "Schedule Now" button next to the layout you
want to show.
2. Enter how long you want the layout to be shown for in Hours, Minutes and Seconds.
It starts from the time you complete the form.
3. Ensure the correct layout is chosen in the Layout dropdown box.
4. Ticking Priority will give this layout priority over other scheduled layouts that do not
have the priority tick box checked.
5. Select the Displays or Display Groups you want the layout to be shown on from the
list on the right hand side.
6. Click Save

Scheduling Layouts
Layouts can be scheduled by double clicking within a day on the celendar, or single clicking
on the day number heading.
A form will be shown which gives the opportunity to specify a start time, end time,
layout/campaign, display group(s) / display(s) and also set the event to be recurring (daily,
weekly, monthly, etc).

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

You can also set whether or not this event is a priority event or not and specify a numerical
display order for the event to be shown in the cases where it will overlap with other events.

Editing Schedules
Deleting Events
Priority Schedules
Priority schedules are only available to users with Administrator privileges. Priority schedules
allow you to add a layout to the schedule that overrides all the other ones that are scheduled.
That could be useful for displaying temporary important notices, or overriding the schedule
for a specific event without having to cancel the layouts that would normally be running at
that time.
When adding a new schedule, or when editing an existing schedule, tick the "Priority" box to
make the schedule override the others. You may schedule multiple priority layouts at once.
They will be shown in a cycle in the same way as non-priority layouts would be.

Disediakan oleh: Noazman bin Musa PPD Cameron Highlands

Das könnte Ihnen auch gefallen