icon lightspeedLightspeed platform


CHOOSE: (Dashboard) > Design > Headlines

In general

The "headlines" are the key images at the top of the homepage ('key visuals' or 'hero images'). The headline images can be shown as a "carousel" (so as a slider with several headline images in a carousel), or as 1 still image (in case just one big headline image is used). The headlines are highly effective in giving your website a quite unique, recognizable appearance. Also, it gives you the possibilities to attrack the visitor's attention to e.g. special offers, and you can link a headline image to a specific webshoppage (for example a special offer product page, or a category you want to highlight.

scrnshot fe berlin headline fullwidth nlExample of headlines as full-width images, no slideshow.
scnshot fe berlin headlines grid3Example of headlines with right the 2 "headline banners", and with main headline image (on the left) as slideshow.

With theme "Berlin" you can choose how to use these headlines: as 1 big 'key visual', static; as a slideshow with several headlines in a carousel, or as a combination of several images within a slideshow and 2 smaller "headline banners" on the right.

Pixel dimension full-width "headlines" (homepage): 1160 pixels (width). Height: when not using headline banners (so in case of full width headlines) the headline image height is free to choose. We advise somewhere between 350 and 700 pixels (at width of 1160px).
When headline banners are being used, the main headline image should measure at least 777 x 442 pixels.

Pixel dimension right side "headline banners" (homepage): 375 pixels (width). Height: 216 pixels.
For best results, upload only images that are this pixel size (width) or bigger (bigger pixel sizes will be scaled back automatically).

scrnsht bo berlin headlines00
As soon as you upload more than 3 images as headlines, they will automatically be shown as a slideshow.  If you upload only 1 headline image and turn off the setting "Show headline banners"), then this image will by default be used as the one big static "hero image", covering the total width of the design (width maximum 1160 pixels).
The settings for the "headlines" that are shown on the homepage.

Headline settings

See 03b. HOME PAGE: Headlines (slider)

The first main setting is the choice whether you want to use the 2 "headline bannes", or whether you want the headline image(s) to be full-width. This choice determines where the uploaded images will be placed, and in which size.

03b show headline bannersThe setting to choose whether or not to use the 2 right hand "headline banners"

If you choose to use full-width headlines

  • make sure the setting for "Show Headline Banners" is de-activated
  • now, all uploaded headline images will be displayed as full-width (make sure to upload images of at least 1160 pixels width). If you upload just 1 image, then the result will be 1 full-width headline, no slideshow. If you upload in this configuration more images, these will automatically be displayed in a full-width slideshow.

If you choose to use the "headline banners" (right hand side)

In "Berlin" the first 2 images that are uploaded as headline, will be used for the 2 smaller "headline banners" on the right side of main headline (key visual). The next headline images are being used for the key visual, in a carousel or as a static key visual, depending on how many images you upload. If you only upload 3 headline images, then he result will be 1 main key headline on the left hand side, and 2 smaller headline banners on the right. If you wish to make use of a slideshow, make sure to upload 4 or more headline images; from the 3rd image on they will be shown as a carousel of images.

Note: The order of the headlines in the back office determines which headline image is used in which place. If your set up is using the headline banners (right), then the first image in the back office order will be the top headline banner; the second will be shown right beliw that one, the 3rd will be the first key visual on the left hand side.
scrnshot fe berlin headlines01 nl
Headline image #1 and #2 are used as "headline banners" (rechts); the following images as bigger key headline images (in a carousel, if configured that way).
headlinesettingsThe first 2 headline images are meant for the smaller "headline banners" on the right; from the 3rd headline image on they will be shown as bigger key headline or headlines (in a carousel). After uploading the images you van reorder them to decide which position each headline image will get in the final setting.
Note: on smaller devices (less than 1024 pixels width) the "headline banners" are hidden automatically, to avoid taking up space (and data). The alternative "main banners", positioned halfway the homepage, will stay visible. Please make use of these "main banners" if you want to use banners to promote messages that need to be visible all the time.

Headline settings and headline texts ("captions")

The whole headline section (with headline slideshow and headline banners) can be de-activeted through the preset in the back office under section "03b. HOME PAGE: Headlines (slider)". All headlines and headline banners will not be visible anymore then. See settings below.

 03b slideshowsettingsSettings for section "HOME PAGE: Headlines (slider)"

Note on "controller buttons" for headlines and dots to show number of slides:  
if you want to use the slider, you can show the controller buttons and the dots to show the amount of slides there are; use the settings "Show dots for slides" (see 03b. HOME PAGE: Headlines (slider)) to activate these buttons and dots. 

Link headlines to pages

The "headlines" can be linked to a specific page, e.g. a category page (product overview), a brand page, or a certain product page. But you can also link them to a custom web address (url). 

headline linksettings
Every "headline" image can be linked to a product page, brand page or category page, or any other page of your choice.