• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
0

liquid user manual menu

Participant ,
Feb 17, 2016 Feb 17, 2016

Copy link to clipboard

Copied

Im trying to setup my liquid menu.

The problem is the code here http://docs.businesscatalyst.com/user-manual/Menus/build-dynamic-menu-using-liquid#customize-your-li... is missing a close </li> list

<ul class="nav navbar-nav">

  {% if menu1.items %}

    {% for i in menu1.items %}

{% if i.items %}

<li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" href="{{i.url}}">{{i.label}}<span class="caret"></span></a>

{% else %}

<li>

<a href="{{i.url}}">{{i.label}}</a>      

{% endif %}

{% if i.items %}

            <ul class="dropdown-menu" role="menu">

            {% for j in i.items %}

                <li><a href="{{j.url}}">{{j.label}}</a>

                    {% if j.items %}

                    <ul>

                    {% for k in j.items %}

                        <li>

                            <a href="{{k.url}}">{{k.label}}</a>

                        </li>

                    {% endfor %}

                    </ul>

                    {% endif %}

                </li>

            {% endfor %}

            </ul>

            {% endif %}

      </li>

  {% endfor %}

  {% endif %}

</ul>

Is this correct?

because ive setup my menu in dreamweaver and its come up with the missing </li> error?

but the source code works out ok?

here is my menu

<!--NAVBAR-->

<nav class="navbar navbar-light navbar-full">

  <button class="navbar-toggler hidden-md-up" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar2"> &#9776; </button>

  <div class="collapse navbar-toggleable-sm" id="exCollapsingNavbar2"> <img src="../images/logos/flatout-logo-2016.svg" alt="LOGO" width="150"/>

    <!--apps menu-->

    {module_menu render="collection" menuId="1727703" template="" collection="app-menu"}

    <ul class="nav navbar-nav pull-right m-l-1">

      {% if app-menu.items -%}

      {% for i in app-menu.items -%}

      {% if i.items -%}

      <!--main dropdown-->

      <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" type="button" data-toggle="dropdown" id="dropdownMenu2-{{i.label}}" aria-haspopup="true" aria-expanded="false" href="{{i.url}}">{{i.label}}</a> {% else -%}

        <!--main nav items-->

  

      <li class="nav-item"> <a class="nav-link" href="{{i.url}}">{{i.label}}</a> </li>

      {% endif -%}

      {% if i.items -%}

      <!--dropdown nav items-->

      <ul class="dropdown-menu navbar-light dropdown-menu-right" aria-labelledby="dropdownMenu2-{{i.label}}">

        {% for j in i.items -%}

        <li class="dropdown-item"> <a href="{{j.url}}">{{j.label}} </a> {% if j.items -%}

          <ul>

            {% for k in j.items -%}

            <li class="dropdown-item"> <a href="{{k.url}}">{{k.label}}</a> </li>

            {% endfor -%}

          </ul>

          {% endif -%} </li>

        {% endfor -%}

      </ul>

      {% endif -%}

      {% endfor -%}

      {% endif -%}

    </ul>

    <!--main menu-->

    {module_menu render="collection" menuId="1709398" template="" collection="main-menu"}

    <ul class="nav navbar-nav pull-right m-l-1">

      {% if main-menu.items -%}

      {% for i in main-menu.items -%}

      {% if i.items -%}

      <!--main dropdown-->

      <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" type="button" data-toggle="dropdown" id="dropdownMenu1-{{i.label}}" aria-haspopup="true" aria-expanded="false" href="{{i.url}}">{{i.label}}</a> {% else -%}

        <!--main nav items-->

  

      <li class="nav-item"> <a class="nav-link" href="{{i.url}}">{{i.label}}</a> </li>

      {% endif -%}

      {% if i.items -%}

      <!--dropdown nav items-->

      <ul class="dropdown-menu navbar-light dropdown-menu-right" aria-labelledby="dropdownMenu1-{{i.label}}">

        {% for j in i.items -%}

        <li class="dropdown-item"> <a href="{{j.url}}">{{j.label}}</a> {% if j.items -%}

          <ul>

            {% for k in j.items -%}

            <li class="dropdown-item"> <a href="{{k.url}}">{{k.label}}</a> </li>

            {% endfor -%}

          </ul>

          {% endif -%} </li>

        {% endfor -%}

      </ul>

      {% endif -%}

      {% endfor -%}

      {% endif -%}

    </ul>

  </div>

</nav>

TOPICS
Content management and modules , Newbie Corner

Views

769

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 17, 2016 Feb 17, 2016

Copy link to clipboard

Copied

anyone?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Feb 19, 2016 Feb 19, 2016

Copy link to clipboard

Copied

The code looks fine,  can not test it at the moment, sorry.

DW doesn't understand liquid so it sees that your opening the li tag and then closing it two times.

That's because you can have 2 versions,  one menu item without children,  one with children (if i.items).

Paste the browsers source code in Dreamweaver and see if you have any html errors.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 20, 2016 Feb 20, 2016

Copy link to clipboard

Copied

Thanks for the reply Mihai I put the source code into dreamweaver and getting missing ??

Screen Shot 2016-02-21 at 3.09.23 PM.png

http://flatouttemplate.businesscatalyst.com/ 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 20, 2016 Feb 20, 2016

Copy link to clipboard

Copied

oh god!!! Is there a tutorial on how to post on this forum?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Feb 21, 2016 Feb 21, 2016

Copy link to clipboard

Copied

Why would you post the entire menu here?

You made modifications to the original as you added a closing li tag where it shouldn't be and removed it from the end of the script:

e.g You added a li tag HERE1, and removed it HERE2

<ul class="nav navbar-nav">

  {% if menu1.items %}

  {% for i in menu1.items %}

      {% if i.items %}

      <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" href="{{i.url}}">{{i.label}}<span class="caret"></span></a>

      {% else %}

      <li>

      <a href="{{i.url}}">{{i.label}}</a>HERE1

      {% endif %}

      {% if i.items %}

            <ul class="dropdown-menu" role="menu">

      {% for j in i.items %}

      <li><a href="{{j.url}}">{{j.label}}</a>

      {% if j.items %}

              <ul>

      {% for k in j.items %}

      <li>

                  <a href="{{k.url}}">{{k.label}}</a>

      </li>

      {% endfor %}

              </ul>

              {% endif %}

      </li>

      {% endfor %}

          </ul>

      {% endif %}

    </li>HERE2

     {% endfor %}

  {% endif %}

</ul>

Here is another example to get you started again (goes 3 levels down):

{module_menu render="collection" collection="mainMenu" menuId="XXXX" template=""}

{% if mainMenu.items -%}

    {% for i in mainMenu.items -%}

    {% if globals.get.ID == i.url -%}

    {% assign active = "active" -%}

        {% else -%}

        {% assign active = "" -%}

        {% endif -%}

        {% if i.items -%}

        <li class="dropdown {{active}}">

        {% else -%}

        <li class="{{active}}">

        {% endif -%}

        <a href="{{i.url}}">{{i.label}}</a>

            {% if i.items -%}

                <ul class="dropdown-menu">

                    {% for j in i.items -%}

                    <li class="dropdown-submenu">

                    <a href="{{j.url}}">{{j.label}}

                        {% if j.items -%} <em class="fa fa-angle-right"></em>

                        {% endif -%}

                        </a>

                        {% if j.items -%}

                        <ul class="dropdown-menu" role="menu">

                            {% for k in j.items -%}

                            <li><a href="{{k.url}}">{{k.label}}</a> </li>

                            {% endfor -%}

                        </ul>

                        {% endif -%}

                    </li>

                    {% endfor -%}

                </ul>

       {% endif -%}

        </li>

  {% endfor -%}

{% endif -%}

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 21, 2016 Feb 21, 2016

Copy link to clipboard

Copied

LATEST

was trying to paste the source code? Will give it a try and get back to you. Thanks

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines