Is there a layout switcher in EE2?

Question

Ok so I have this dreamweaver extension called tab panel menu where each menu I can generate either a single column, 2 column, 3 column, 4 column, 5 column or sub menu. Now I wish to make use of this inside EE2 without having to do it on dreamweaver. I figured to make use of if:else statement for the html output. My problem if I want to generate column within channel entries? So if Field 1 = Layout Selection, Field 2-7 = Show field for Selected layout(Of course in horizontal order with labels' like For right sidebar, for left sidebar, for middle content).

So that if I were to write a new channel entry, I can just select layout and then fields for that layout will show up.

Example:
-On Channel Entry-
Field 1 - Layout Selection
(col-default
col-75-25
col-60-40
col-50-50
col-40-60
col-33-33-33
col-25-75
col-25-50-25
col-25-25-25-25
col-20-20-20-20-20)
Field 2 - Content A
Field 3 - Content B
Field 4 - Content C
Field 5 - Content D
Field 6 - Content E
Field 7 - Content F

 

-On template-
Some channel code here
{if layout_selection == "col-20-20-20-20-20"}
<div class="p7mgm-row mgm-col-20-20-20-20-20 col-sep">
<div class="p7mgm-Col p7mgm-percent20">
<div class="p7mgm-ColContent p7ehc-51">
{content_a}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent20">
<div class="p7mgm-ColContent p7ehc-51 border-left">
{content_b}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent20">
<div class="p7mgm-ColContent p7ehc-51 border-left">
{content_c}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent20">
<div class="p7mgm-ColContent p7ehc-51 border-left">
{content_d}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent20">
<div class="p7mgm-ColContent p7ehc-51 border-left">
{content_e}
</div>
</div>
</div>

{if:elseif layout_selection == "col-25-25-25-25"}
<div class="p7mgm-row mgm-col-25-25-25-25 col-sep">
<div class="p7mgm-Col p7mgm-percent25">
<div class="p7mgm-ColContent p7ehc-50">
{content_a}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent25">
<div class="p7mgm-ColContent p7ehc-50 border-left">
{content_b}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent25">
<div class="p7mgm-ColContent p7ehc-50 border-left">
{content_c}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent25">
<div class="p7mgm-ColContent p7ehc-50 border-left">
{content_d}
</div>
</div>
</div>

{if:elseif layout_selection == "col-25-50-25"}
<div class="p7mgm-row mgm-col-25-50-25 col-sep">
<div class="p7mgm-Col p7mgm-percent25">
<div class="p7mgm-ColContent p7ehc-49">
{content_a}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent50">
<div class="p7mgm-ColContent p7ehc-49 border-left">
{content_b}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent25">
<div class="p7mgm-ColContent p7ehc-49 border-left">
{content_c}
</div>
</div>
</div>

{if:elseif layout_selection == "col-25-75"}
<div class="p7mgm-row mgm-col-25-75 col-sep">
<div class="p7mgm-Col p7mgm-percent25">
<div class="p7mgm-ColContent p7ehc-44">
{content_a}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent75">
<div class="p7mgm-ColContent p7ehc-44 border-left">
{content_b}
</div>
</div>
</div>

{if:elseif layout_selection == "col-33-33-33"}
<div class="p7mgm-row mgm-col-33-33-33 col-sep">
<div class="p7mgm-Col p7mgm-percent33">
<div class="p7mgm-ColContent p7ehc-48">
{content_a}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent33">
<div class="p7mgm-ColContent p7ehc-48 border-left">
{content_b}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent33">
<div class="p7mgm-ColContent p7ehc-48 border-left">
{content_c}
</div>
</div>
</div>

{if:elseif layout_selection == "col-40-60"}
<div class="p7mgm-row mgm-col-40-60 col-sep">
<div class="p7mgm-Col p7mgm-percent40">
<div class="p7mgm-ColContent p7ehc-46">
{content_a}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent60">
<div class="p7mgm-ColContent p7ehc-46 border-left">
{content_b}
</div>
</div>
</div>

{if:elseif layout_selection == "col-50-50"}
<div class="p7mgm-row mgm-col-50-50 col-sep">
<div class="p7mgm-Col p7mgm-percent50">
<div class="p7mgm-ColContent p7ehc-43">
{content_a}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent50">
<div class="p7mgm-ColContent p7ehc-43 border-left">
{content_b}
</div>
</div>
</div>

{if:elseif layout_selection == "col-60-40"}
<div class="p7mgm-row mgm-col-60-40 col-sep">
<div class="p7mgm-Col p7mgm-percent60">
<div class="p7mgm-ColContent p7ehc-47">
{content_a}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent40">
<div class="p7mgm-ColContent p7ehc-47 border-left">
{content_b}
</div>
</div>
</div>

{if:elseif layout_selection == "col-75-25"}
<div class="p7mgm-row mgm-col-75-25 col-sep">
<div class="p7mgm-Col p7mgm-percent75">
<div class="p7mgm-ColContent p7ehc-45">
{content_a}
</div>
</div>
<div class="p7mgm-Col p7mgm-percent25">
<div class="p7mgm-ColContent p7ehc-45 border-left">
{content_b}
</div>
</div>
</div>

{if:elseif layout_selection == "col-default"}
<div class="p7mgm-row mgm-col-default">
<div class="p7mgm-ColContent">
{content_a}
</div>
</div>

{if:else}
What the?! where is my Content!!!
{/if}

Some channel code here

Answer 1

If I understood what you want, maybe one of these add-ons can help you:

• Entry Type - A dropdown fieldtype that shows/hides other fields on the publish page;
• Better Pages - Better Pages is an ExpressionEngine fieldtype designed to make using the Pages module significantly more end-user friendly;
• Entry Layout - Lets you link custom fields to any entry of your website. It will let you save a different publish layout for two different entries even if they come from the same channel. Useful for static pages such as contact, about pages, etc... Plus, its support member groups;
• Plates - This fieldtype for ExpressionEngine 2 is a drop in replacement for the native Pages Module or Structure Module ‘Template’ field;

Answer 2

You might find Template Snippet Select useful if you want to allow a way of choosing a layout template in the publishing form. Works well with snippets or full templates :)