Select image (1)
You can directly upload an image from your computer using the blue icon or you can upload an already uploaded image using the green icon from the administration. The red trash icon does not delete an uploaded image. It will only remove the link to the image. If you want to delete uploaded images, you have to call the image management directly.
The dark blue icon leads to our image database. Here you can access all images that we provide free of charge. By default, the "Content" section is selected when you call up the database, where you can access images in landscape and portrait format and in square form. These images are already optimized in size so that they can be used as decorative images on your page. The landscape images have a size of 533 x 300 px, the portrait images have a size of 300 x 533 px and the square images have a size of 400 x 400 px. Of course you can scale these images and make them smaller. Of course you can also access the other images in the archive. Images from the "Layout" section have the size of 1,400 x 500 px and are usually used for the header. "Background images" are the largest with a format of 2,560 x 1,440 px and are mainly intended to serve as decorative images for the background of your website. Tiles are 200 x 200 px and are especially good for filling in a background with a pattern.
The dark blue icon leads to our image database. Here you can access all images that we provide free of charge. By default, the "Content" section is selected when you call up the database, where you can access images in landscape and portrait format and in square form. These images are already optimized in size so that they can be used as decorative images on your page. The landscape images have a size of 533 x 300 px, the portrait images have a size of 300 x 533 px and the square images have a size of 400 x 400 px. Of course you can scale these images and make them smaller. Of course you can also access the other images in the archive. Images from the "Layout" section have the size of 1,400 x 500 px and are usually used for the header. "Background images" are the largest with a format of 2,560 x 1,440 px and are mainly intended to serve as decorative images for the background of your website. Tiles are 200 x 200 px and are especially good for filling in a background with a pattern.
Original size (2)
Here you can see how wide and how high the original image is that you uploaded. These values are for information only and cannot be changed. You should never display images larger than the original size, otherwise the quality suffers greatly.
Scaled to (3)
When you select an image, these two fields will fill with the values from the original image. You can click into the fields at any time and change the width and height. You can also use the triangles and change the size in 1 px steps. Depending on what you have set under "Resize image", these fields behave slightly differently.
Image resize (4)
You have two options. Either "Proportional" or "Freely scalable".
If you choose proportional and you change the width of the image, the height adjusts automatically so that the image is always displayed in the same aspect ratio and is not distorted. Likewise, if you change the height manually, the width will change as well.
If you have set the height to "freely scalable", you can change both fields independently of each other, which quickly leads to the image being distorted, unless you calculate exactly how high the image can be at a certain width. If you want to be sure that the image is not distorted, always use proportional.
If you choose proportional and you change the width of the image, the height adjusts automatically so that the image is always displayed in the same aspect ratio and is not distorted. Likewise, if you change the height manually, the width will change as well.
If you have set the height to "freely scalable", you can change both fields independently of each other, which quickly leads to the image being distorted, unless you calculate exactly how high the image can be at a certain width. If you want to be sure that the image is not distorted, always use proportional.
Alignment (5)
You can align the image to the left, center, or right of the page with one click, and strictly speaking, the alignment is always within the column. If the column is as wide as your page, the image will naturally be aligned to the width of the page. If you have two or more columns on the page, the image will always be aligned to the column it is in.
Design caption
Below an image you can place a text that is linked to the image and when you move the image element, the caption (7) will move with it. You can design this caption with the following options:
Font (8) = Here you can set a font family, a font size and a font color. This works very simple. Detailed description on the page "Basic functions".
Alignment (9) = The signature is aligned to the image, not to the area. The preview (6) tries to display the font true to scale to the image. This is only approximately the case, but it helps to get an idea.
Distance to image (A) = This sets the distance to the bottom edge of the image. The top edge of the font is used for the calculation.
Set image properties
Currently, the only option here is to place an image frame (B) around the image. You can set a frame style, a frame thickness, a frame color and transparency and a rounding. Detailed description on the page "Basic functions". If you set a high rounding and your image is square, you can make your image appear as a circle.
Link image
Link type (C)
You can choose between "Custom" and "Original size". By default, the selection is set to "Custom". In the next line you can specify a link (D). Click on the chain symbol and enter the appropriate values in the dialog that opens. You can link internal pages directly in this dialog or simply enter an external link.
If you select "Original size", you don't have to make any further entries. If a visitor clicks on the image, a new window will open and the image will be displayed in its original size if possible. Of course, this depends on the image size and the monitor on which the link is opened.
You can choose between "Custom" and "Original size". By default, the selection is set to "Custom". In the next line you can specify a link (D). Click on the chain symbol and enter the appropriate values in the dialog that opens. You can link internal pages directly in this dialog or simply enter an external link.
If you select "Original size", you don't have to make any further entries. If a visitor clicks on the image, a new window will open and the image will be displayed in its original size if possible. Of course, this depends on the image size and the monitor on which the link is opened.
Image SEO options
For search engines to know what kind of image it is, you should write an alternative text (E). This text will then be recognized and evaluated by Google. The tooltip (F) is displayed when a visitor moves the mouse over the image.