Shape
With shapes you can draw, rectangles, rounded rectangles, ovals and lines directly on your website.
You can add a shape to every page area or area template. To add a shape, edit the content of a page area or area template and drag the shape from the items to the editor.
Shapes are a good choise if you want to create the layout of your website. Shapes can contain rectangles, rounded rectangles, ovals or lines. Or nothing, if you just want to show a background image or color in the shape.
The property Shape > Has Shape defines if a shape is shown in the item and what kind of shape is used. Choose between rectangle, rounded rectangle, oval or line. It depends on your selection which other options are available.
Every shape has a fill color and a border. If you only want to have a rectangle with a background or one color, deactivate Has Shape and use the background of the item instead.
Properties for Shape
These properties can be set for a shape. Select a shape to show its properties.
| Item > Left | Sets the distance from the left side of the parent element in pixels. |
|---|---|
| Item > Top | Sets the distance from the top side of the parent element in pixels. |
| Item > Width | Sets the width of the item in pixels. |
| Item > Height | Sets the width of the item in pixels. |
| Item > Padding Left | Sets the distance from the left side of the item to the content in pixels. |
| Item > Padding Right | Sets the distance from the right side of the item to the content in pixels. |
| Item > Padding Top | Sets the distance from the top side of the item to the content in pixels. |
| Item > Padding Bottom | Sets the distance from the bottom side of the item to the content in pixels. |
| Item > Background Color | Select a background color for the item. |
| Item > Background Picture Clip | Select a background picture from the Goldfish Clips library. This option is only available if you have the Goldfish Clips library installed. |
| Item > Background Picture | Select a background picture for the item. With Repeat, you can choose how the picture will be displayed. |
| Item > Border Left Width | Displays a border on the left side of the item in the choosen width (pixels). |
| Item > Border Left Color | Select a color for the left border. |
| Item > Border Right Width | Displays a border on the right side of the item in the choosen width (pixels). |
| Item > Border Right Color | Select a color for the right border. |
| Item > Border Top Width | Displays a border on the top side of the item in the choosen width (pixels). |
| Item > Border Top Color | Select a color for the top border. |
| Item > Border Bottom Width | Displays a border on the bottom side of the item in the choosen width (pixels). |
| Item > Border Bottom Color | Select a color for the bottom border. |
Item > Add HTML Code  | Add custom html code to the item to extend Goldfish's functionality. |
| Item > Add CSS Code | Add custom css code to the item. The code will be stored in the css section of your website. You can't change the css code of internal items, but you can use the css code in your custom html code. |
| Item > Identifer (Id) | Sets the value for the id property. You can use this id to access the item with JavaScript. |
| Shape > Has Shape | Select the shape that should be shown. Deactivate this, if you don't want a shape. |
| Shape > Arc | Sets the arc for the round edges of a rounded rectangle. |
| Shape > Fill Color | Choose a fill color for the shape or the color of a line shape. |
| Shape > Size | Sets the size of a line shape in pixels. |
| Shape > Border Width | Sets the width for the border of the shape in pixels. |
| Shape > Border Color | Choose a color for the border of the shape. |
Did this help page answer your questions?
If you need additional assistance regarding this topic or if there's missing some information in this chapter, please write us.