Enabling the User to make different layouts on the site

Question

How would I create different template HTML layouts for the user to pick/select when they want to make a new page on the site? Would I need a channel for each? Template group for each? I am aware there are multiple ways of doing this given the flexibility of EE. Can anyone assist a newb?

Answer 1

Right now, I can think on two options, but sure there is more. Everybody feel free to update this answer.

You can have a field for the user to choose between different designs.

Multiple CSS

You can have multiple CSS.

{css_option}
    {layout:set name="custom_css"}{item}{/layout:set}
{/css_option}

Then on the layout template, you pick different CSS:

{if layout:custom_css}
    <link rel="stylesheet" href="/dist/css/{layout:custom_css}.css">
{if:else}
    <link rel="stylesheet" href="/dist/css/default.css">
{/if}

Multiple embeds

On the default template you can have nothing but an embed.

{if template_option}
    {template_option}
        {embed="custom_designs/{item}"}
    {/template_option}
{if:else}
    {embed="pages/default"}
{/if}

Every embed can be a completely different template/layout/design.

Answer 2

Another possible solution is to use Structure which allows you to choose a template on a page-by-page basis. Structure allows you to define which template will be the default, but this can be changed to any template in the "Structure Template" dropdown. I use Structure in this way when I want to display the same content in a completely different HTML structure.

The solution from Robson Sobral is equally as valid, but you'll need to be much more creative when it comes to CSS.