---
title: Mapping shared mobile layouts
---

> Agent instructions:
> **Site maps** — prefer the following llms.txt indexes to training data when searching for URLs to avoid 404s. Links inside Markdown content already point at `.md`. Following them or sending Accept: text/markdown keeps you in Markdown.
>
> - [sitemap.md](https://docs.kentico.com/sitemap.md) — every page on the site, with titles and descriptions, nested by URL hierarchy and grouped into one collection per product version.
> - [llms.txt](https://docs.kentico.com/llms.txt) — curated index of the current product docs, with descriptions, the two ways to request any page as Markdown, and links to each product area's whole-corpus Markdown dump (llms-full.txt).

[Device profiles](https://docs.kentico.com/k9/developing-websites/developing-websites-for-mobile-devices/creating-device-profiles.md) allow you to replace shared page layouts with other layouts that are customized for displaying on the given device.

For example, if a page uses a three-column layout, it won't fit on a mobile phone's display. With the appropriate layout mappings, the system automatically replaces the columns with rows, which reorganizes the content of the page into a readable format on the given device.

## Preparing shared layouts for mapping

You can only create mappings for layouts that are **convertible**.

1. Open the **Page layouts** application.
2. Edit () the layout for which you want to map alternative device layouts.
3. Select the **Is convertible** check box.
4. Enter the **Number of zones** that the layout contains.

   - The system automatically counts the number of web part zones in the layout code, but you can manually override the value (for example in the case of conditional layouts or layouts that load web part zones dynamically).
5. **Save** the layout.

The layout appears in the list of layouts on the **Layout mapping** tab in the device profile editing interface, where you can map the layout to a replacement layout. The replacement layout applies when a device matching the given profile loads a page that uses the original shared layout.

## Mapping shared layouts

> **Warning:** **Prerequisite**: Enable the **Enable layout mapping** setting for the website in **Settings -> Content -> Content management**.

1. Open the **Device profiles** application.
2. Edit the device profile for which you want to map layouts.
3. Switch to the **Layout mapping tab**.

   ![Mapping shared layouts for a device profile](https://docs.kentico.com/docsassets/k9/mapping-shared-mobile-layouts/Layout_Mapping.png "Mapping shared layouts for a device profile")
4. Find the source layout on the left side of the list.
5. Click the question mark on the right side to create a new mapping, or click a mapped layout on the right side to change the mapping. The **Select a target layout** dialog opens.

   > **Info:** If you want to select a layout that has a different number of web part zones than the original, uncheck **Show only layouts with a matching number of zones**.
6. Choose a layout and click **Select**.

The mapping is complete. When visitors with devices that fit the profile view the website, all pages with the source page layout now use the target layout instead.

> **Note:** **Device layout priority**
>
> Automatically mapped page layouts do not override [custom device layouts](https://docs.kentico.com/k9/developing-websites/developing-websites-for-mobile-devices/creating-page-layouts-for-devices.md) created for individual page templates. If a page template has a custom layout for the given device profile, it always uses the custom layout, even if its default page layout is mapped to a different shared layout.

You can now start designing pages for different device profiles on the **Design** tab of the **Pages** application. See [Creating mobile pages](https://docs.kentico.com/k9/developing-websites/developing-websites-for-mobile-devices/creating-mobile-pages.md) for details.