Mega menu with CTA (call to action) buttons

You could make the call to actions a simple page type, and include that in your transformations. Then the customer just creates a new one the same way they create a page. Maybe have the page type include a name/text and a link.

Hi Joshua

This could be a possible solution. Do I have to use the ASCX transformations instead of the XML ? I'm using a hierarchical view webpart to render the menu.

You should be able to use either.

I like the page type idea. Here's what I recently did which is a little different

It was assumed those buttons or in your case the blue background area was part of any of the top level 1 pages. The top level pages are the ones you hover over or click on to get your mega menu to show up. So on the Page (menu item) page type I added 2 fields:

• Menu heading
• Menu image

On both of those fields, I set visibility so they could only be accessed at the top level when adding new pages. You can use this macro in the visibility field: EditedObject.NodeLevel == 1. In your case you might be able to add 3 or 4 button URL fields and 3 or 4 button text URL fields. I'd make sure you limit it to whatever your design can handle.

The menu is displayed in a Universal Viewer so I then adjusted my transformations to properly display the items as needed. Here's a sample of my transformation:

  <li class="dropdown">
      <a href="<%# GetDocumentUrl() %>" class="dropdown-toggle">
        <%# Eval("DocumentName") %>
      </a>
      <div class="dropdown-menu">
      <h4 class="droptitle"><%# Eval("MenuSummaryText") %></h4>
      <hr>
        <cms:SubLevelPlaceHolder runat="server" ID="plcSub" />
      <%# IfImage("MenuItemTeaserImage", "<div class=\"col-md-3\">" + GetImage("MenuItemTeaserImage", 0, 0, 0, Eval("DocumentName")) + "</div>", "") %>
      <%# If(Eval<bool>("NodeHasChildren"), "</div>", "") %>
</li>

This is simply an example as yours might be a bit different but it's another possible solution.

Hi Brenden

Thanks for your great response. I'm going to try your approach.

The page type idea is great too (I'll try that approach in my own time ;) )

I'll keep you posted !

Brenden

I'm using a pages data source webpart which gets several page types. So I had to add CTA fields to the existing page menu item (CONTENT_MenuItem). Now when I add those fields to the columns filter, I get the error these fields do not exist (although they do exist).

So I'm struggling with the naming convention of the fields

So Dennis any reason you're using a pages datasoure webpart vs. a control that already has that built-in like a repeater or a Universal or Hierarchical Viewer? Those webparts already have the pages datasource built in and you can include multiple page types with it. In my example I was pretty fortunate to only have a need for the CMS.MenuItem page type.

Wow, you are absolutely right. Stupid me :)
But the issue still remains.. unless I remove the columns and select everything

Is there a way to select table specific fields like you do in sql (select m.ctalink1 from content_menuitem m) ?

my other page types don't have these fields

Invalid column name 'CTALink1'.
Invalid column name 'CTALink1Text'.
Invalid column name 'CTALink2'.
Invalid column name 'CTALink2Text'.
Invalid column name 'CTALink1'.
Invalid column name 'CTALink1Text'.
Invalid column name 'CTALink2'.
Invalid column name 'CTALink2Text'.

I also get the message from sql query debug to only select the used fields, that's why I bumped into this problem:

Web part 'hvMain' used only 2 of 173 columns from the data source. Some of these columns might have been required automatically by the component. Restrict the columns in the web part properties to the following list if possible:
CTALink1, CTALink2

Hi I also posted this question to "Ask the experts 2", but I'm not completely satisfied with the answer. https://youtu.be/8YAWafwYGDA?t=510

Kentico performance tips tell you to use the column selector (otherwise you'll have 173+ columns), but the query that kentico creates does a join on a field that doesn't exist in my other page type.

Any thoughts?

Kind regards, D.

Hi Dennnis,

I would like to know how you implemented this mega dropdown menu in kentico. Looks interesting. Please assist me how to accomplish the same.

Regards, Arshad