Documentation
Barisco Helpcenter
Video Tutorial – How to use Interactions
Using free background patterns in Barisco
How to prepare designs in Photoshop for Barisco
Video Tutorial – Explanation of Barisco’s editor user interface
Video Tutorial – How to use the scroller
Video Tutorial – How to create overlays or pop-ups
Video Tutorial – How to create groups
Video Tutorial – How to use the Position & Size panel
Free interface templates in Barisco
Different interfaces for different platforms.
What features are not supported in Internet Explorer?
How can I optimize the load time of my project?
Why do fonts appear differently across different browsers and de
How to add your own domain name?
Does Barisco support Android?
How to duplicate pages to a different edition
Video Tutorial – Interfaces 2/2 – How to design a custom interfa
Video Tutorial – Interfaces 1/2 – Using default interfaces
Release 2.0.0.0
Optimize your publication for SEO
Direct Share to Social Media Channels
Embed your Project
DOOH (Narrowcasting)
Release 2.1
Improved Group settings for desktop and mobile views using one U
Improvements Release 2.2.5
How to create pixel perfect mobile web pages without coding?
Making a mobile ready site in 5 steps:
Reset your Profile
Animate Layers in the Scroll when Visible
Use now animated GIF in Barisco.
Integrating YouTube video’s in your Barisco projects is easy!
How to create a landing page or vertical scrolls in a page.
Release 2.0.1.0
Implement Youtube original player (control)
New! Dimensional scrolling features for landing pages micro site
UX improvements
Orientation options on publication settings
New Features for creating templates in the restricted editing
Video Tutorial – How to create groups
Intro
Welcome to this Barisco tutorial! In this tutorial we are going to look at Groups in the editor and how we can use them.
Part 1 – The Basics
A group is an object that allows you to contain other objects. The group can then be moved without having to move each object individually. Besides being able to move the group, you also change other properties that can be found on most other objects. Such as opacity, width, height or add interactions.
Creating a group is easy. All you need to do is select one or multiple objects and then click on Group at the Ribbon Menu. As you can see now, the objects that I had selected have now been moved inside the newly created group.
Now, when I drag the Group across the Stage Area; the objects inside the Group move along with the Group as a single object.
The objects that are now inside the group can still be modified if I open the Group. To open a Group, you need to double click on the Group. You can also open the Group by using the Layers Panel.
Part 2 – Positioning child objects
When you create a group the group assumes the size of the objects that you had selected. If you then change the size or position of the objects inside the group; the group will not adapt to the size of these changes. This is because a Group is an object by itself and has its own position and size.
For example if I move the image inside this group, you can see that the size of the group is indicated by the dashed line. The image that I had moved now has a negative top and left position. If I exit the group and then select the group; you can see that the image is protruding from the group.
Objects inside a group will use the size of the group as an offset point. This means that if I set the image to use the bottom position and then resize the group. The image will maintain the bottom position that I had given it.
Part 3 – Group Layouts
Group layouts determine the behavior of the child objects inside the group. The default layout is Normal. And vertical and horizontal will position the child objects in a list. This feature is especially useful when you have some objects that need to appear this way. For example: a list of images.
Below the Layout dropdown menu, there are 2 options available: Spacing and Align.
Spacing allows you to control the spacing between the child objects and align allows you to set the alignment in case the child objects don’t have the same size.