Knowledgebase

How can I display different layouts on different devices?

FAQ Bild

It often makes sense to display a portrait-format image for smartphones and a landscape-format image for all other devices. This is how you proceed:

  1. Place a Picture element on your page and select a portrait-format image
  2. In the Right Toolbar, under the Visibility tab, you will wee options for different devices
  3. Only select the option Show on phone
  4. The image has now disappeared from your preview area in the Website Builder. This is because you are currently displaying the page on your desktop computer.
  5. In the page structure you will still see the image - grayed out and in italics. You can select the image here to make changes.
  6. Next, drag an image element onto your page and select a landscape-format image
  7. In the Right Toolbar, under the Visibility tab, select the options Show on wide screen, Show on desktop and Show on tablet
  8. You have now defined a portrait-format image for mobile devices and a landscape-format image for all other device classes.

Was this answer helpful?

Related Articles

What controls are there in the Website Builder?

Main Toolbar with website elements Page Selection (drop-down menu) Template Menu (drop-down menu for changing and resetting the template) Undo...

How do I edit my website while the "Under construction" page is displayed?

While you are creating your website, you can display a "Our website is under construction" page.   You have not yet created a website Under...

How to use the Layout element?

Drag the Layout element from the Main Toolbar onto your website Select the desired layout composition Select one of the following layouts...

How do I use the Menu element?

Use the Menu element to add navigation to your website.   Drag the Menu element from the Main Toolbar to the desired position on your website...

How do I define text styles?

Go for the Settings menu and choose Styles On the left, select the text style that you want to edit on the right. Specify Font, Size, Line...