This section includes:
| ▪ | a layout of the page's configuration as it was defined in the Page Creation window; |
| ▪ | the list of available options. |
Select the row you want to work on and use the available options to define its format. The selected row will be shown in blue and its number appears in boldface.
There is a dot next to each row which is shown full or empty, depending on whether the row format has already been defined or not.
Consecutive rows can be linked together so they have the same format. It is also possible that rows are linked together automatically, as a result of how the objects are arranged in the page layout table or of how they are re-arranged in responsive websites.
The Toolbar placed above the grid reports the following commands:
  
|
Cut, Copy and Paste
You can set the same style you already defined for another Row (by cutting or copying it) for another (by pasting it). You will find the same commands in the context menu you can open by right-clicking on the Row itself.
|
|
Extend to the width of the browser window
With this command you can extend the style you defined for a Row to the full Browser width.
On the layout grid the Row for which the Extend function has been activated are easily to be identified because they are wider than the columns which build up the page. By clicking again on the Extend to the width of the browser window button, the Rows reduce their width and adapt to the Page width.
|
|
Anchor
This command creates an anchor and associates it with the object selected in the page layout table. If you click on the arrow next to the button, you will see a menu with these options: Insert Anchor..., Edit... and Remove.
|
An anchor is a reference that helps identify the position of an object within a page: it is used to set up links directly to the object. It can be set on an Object or a Row and it is used to create direct links to a specific section of the Page
|
|
|
Overlay
You can apply a colored filter, no matter the background you set. You can set the filter with the following commands:
| • | Color:this indicates the color to use for the background's overlay. |
| • | Opacity: this value indicates the transparency of the overlay color. Values closer to 0 increase transparency, letting the row's background show through. |
| • | Enable color transition: select this option if you want to animate the background's overlay. The animation is a loop transition from the initial color to the End Color, passing through the Intermediate Color., if there is one. |
|
|
Effect
This activates the parallax effect on the selected row. The parallax effect is a visual technique you can use to create a 3D illusion of depth and enrich your graphic layout by making the images move at different speed and perspectives. This effect turns the page scrolling into a more engaging experience for your visitors.
You can choose among different kinds of parallax effects:
|
The parallax effect is based on images moving at different speeds, therefore it cannot be used if the row's background is a solid color.
|
|
Once you have selected the row, or group of rows, to work on, the first thing to do is specify the type of Background you want for the row, and you can choose from:
|
Colored: the background is filled with a solid color.
|
|
Gradient: the background is filled with shaded color and you can specify the first and final colors, and the direction of the shading.
|
|
Image: an image is used as the row's background.
|
|
Image list: a slideshow is used as the row's background: the pictures appear one after the other, in a continuous cycle.
|
|
Animation: An animation is used as row background.
|
|
Video: a video is used as the row's background.
|
|
Map: a map is used as the row's background.
|
You can now specify the Settings for each background style. The possible options are:
| ▪ | Color: specifies the color to be used as the background filler color. |
| ▪ | Start Color / End Color: specify the first and final colors of the shading. |
| ▪ | Diffusion: indicates whether the first or final color is the most important, defining the space (as a %) in which the transition from the first and final color is to occur. |
| ▪ | Direction: set the angle width according to which the shade is oriented. |
| ▪ | Local File on PC: indicates the image file (.JPG, .GIF, .PNG.) for the picture to use as the background. You can import the image either from the files saved locally on your PC (by clicking on the Local File  button) or choose it from the files made available with the two online libraries (  Online Library). |
| ▪ | Repeat: indicates whether the page background image is to be repeated, or not. It can be repeated horizontally, vertically or in both directions so that it occupies all the available space. The background image can also be resized so that it adapts to the available space. |
| ▪ | Alignment: you can specify how the background image is to be aligned inside the row area. |
| ▪ | Add... / Remove: you can create a slideshow to use as the row's background, adding new files (in .JPG, .GIF, .PNG format) or removing selected files that have already been added. |
Click on the triangle in the Add... button to display a sub-menu with the Add Image... and Image from Online Library... items.
| ▪ | Move up / Move down: use these options to change the order of the pictures in the slideshow. |
| ▪ | View: this option specifies how the slideshow is displayed in the row's background. You can choose from: |
| • | Pictures in timed sequence: the pictures are displayed in sequence according to the effect and the timing you have freely set. |
| • | Pictures scrolled: the pictures are displayed one at a time, with no transition effect. Passage from one picture to the next is by manual scrolling. |
| • | Pictures overlaid: the pictures are all shown at the same time, one on top of the other. In this case, best results are obtained if you use pictures in .PNG format with transparency and apply the parallax effect. |
| ▪ | Video type: this indicates whether you are using a Local File on PC, a Internet file or a YouTube Video URL as the video for the background. |
| ▪ | Local File on PC / Internet file / YouTube Video URL: you will see one of these options, depending on the selected Video type, and you can now select the video file to import or type in its URL, if the video file is already online. |
| ▪ | Cover image: you can specify a preview picture to associate with the video. You can import the image either from the files saved locally on your PC (by clicking on the Local File button) or choose it from the files made available with the two online libraries ( Online Library). |
|
The preview picture appears before the video and fades out when this starts. Setting up a preview picture is, therefore, particularly useful for mobile devices where videos are never started automatically.
|
| ▪ | Address: this is the address to be shown on the map that is used as the row's background. |
| ▪ | Style: this indicates the type of map, which can be Roadmap, Satellite, Hybrid or Terrain. |
| ▪ | Zoom factor: this gives the zoom factor for displaying the map. |
| ▪ | Opacity: you can set the amount of transparency of the background color/shade/image/video/map. Values closer to 0 increase transparency, letting the page's background show through. |
|
Row Formats button in the toolbar of the page layout table in the Page Creation window. You can use the commands in this window to define the graphic format of the rows, where groups of objects are placed horizontally on the page.
