| PHP | PHP 7.2 |
|---|---|
| CMS | Rhymix 2.0 |
안녕하세요.
과거 2단 레이아웃만 사용했었는데
이제 레아이웃 상단 메뉴 중 한 3 ~ 4단 깊이 정도되는
뼈대 레이아웃을 코드를 참고하여 레이아웃을 만들어 사용하려고 합니다.
<[email protected]($menu1->list as $key => $val)-->
<[email protected]($val['link'])--> 나 loop="$val['list']=>$key,$val
이런것들을 적절히 섞어 사용하여야 할 것 같은데 기존부터 제가 사용하던것은 항상 2단 레이아웃이라서 더 깊은 레이아웃의 샘플자료가 필요한 상황입니다.
혹시 3단 이상되는 뼈대만 있거나 참고할만한 레이아웃이 있으면 추천해주시면 대단히 감사드리겠습니다.
5단까지 넣은 코드의 모습
혹시 필요하신 분이 있으면 사용하시면 될 것 같습니다.
<ul class="nav">
<li loop="$global_menu->list=>$key1,$val1" class="dropdown"|cond="$val1['list']">
<a href="{$val1['href']}" target="_blank"|cond="$val1['open_window']=='Y'">{$val1['link']}</a>
<ul cond="$val1['list']">
<li loop="$val1['list']=>$key2,$val2" class="active"|cond="$val2['selected']" class="dropdown"|cond="$val2['list']">
<a href="{$val2['href']}" target="_blank"|cond="$val2['open_window']=='Y'">{$val2['link']}</a>
<ul cond="$val2['list']">
<li loop="$val2['list']=>$key3,$val3" class="active"|cond="$val3['selected']" class="dropdown"|cond="$val3['list']">
<a href="{$val3['href']}" target="_blank"|cond="$val3['open_window']=='Y'">{$val3['link']}</a>
<ul cond="$val3['list']">
<li loop="$val3['list']=>$key4,$val4" class="active"|cond="$val4['selected']" class="dropdown"|cond="$val4['list']">
<a href="{$val4['href']}" target="_blank"|cond="$val4['open_window']=='Y'">{$val4['link']}</a>
<ul cond="$val4['list']">
<li loop="$val4['list']=>$key5,$val5" class="active"|cond="$val5['selected']" class="dropdown"|cond="$val5['list']">
<a href="{$val5['href']}" target="_blank"|cond="$val5['open_window']=='Y'">{$val5['link']}</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
<li loop="$global_menu->list=>$key1,$val1" class="dropdown"|cond="$val1['list']">
<a href="{$val1['href']}" target="_blank"|cond="$val1['open_window']=='Y'">{$val1['link']}</a>
<ul cond="$val1['list']">
<li loop="$val1['list']=>$key2,$val2" class="active"|cond="$val2['selected']" class="dropdown"|cond="$val2['list']">
<a href="{$val2['href']}" target="_blank"|cond="$val2['open_window']=='Y'">{$val2['link']}</a>
<ul cond="$val2['list']">
<li loop="$val2['list']=>$key3,$val3" class="active"|cond="$val3['selected']" class="dropdown"|cond="$val3['list']">
<a href="{$val3['href']}" target="_blank"|cond="$val3['open_window']=='Y'">{$val3['link']}</a>
<ul cond="$val3['list']">
<li loop="$val3['list']=>$key4,$val4" class="active"|cond="$val4['selected']" class="dropdown"|cond="$val4['list']">
<a href="{$val4['href']}" target="_blank"|cond="$val4['open_window']=='Y'">{$val4['link']}</a>
<ul cond="$val4['list']">
<li loop="$val4['list']=>$key5,$val5" class="active"|cond="$val5['selected']" class="dropdown"|cond="$val5['list']">
<a href="{$val5['href']}" target="_blank"|cond="$val5['open_window']=='Y'">{$val5['link']}</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
자문 자답 으로
https://xe1.xpressengine.com/index.php?mid=download&package_id=22753835
아무래도 모바일 레이아웃이 3단을 지원하는 메뉴가 많은 것 같네요.
위 메뉴로 만들어보는것으로 우선 방향을 정하였습니다.
위 레이아웃의 코드를 살펴보면
<li loop="$main_menu->list=>$key1,$val1" class="active"|cond="$val1['selected']"><a href="{$val1['href']}" target="_blank"|cond="$val1['open_window']=='Y'">{$val1['link']}</a>
<ul cond="$val1['list']">
<li loop="$val1['list']=>$key2,$val2" class="active"|cond="$val2['selected']"><a href="{$val2['href']}" target="_blank"|cond="$val2['open_window']=='Y'">{$val2['link']}</a>
<ul cond="$val2['list']">
<li loop="$val2['list']=>$key3,$val3" class="active"|cond="$val3['selected']"><a href="{$val3['href']}" target="_blank"|cond="$val3['open_window']=='Y'">{$val3['link']}</a></li>
</ul>
</li>
</ul>
</li>
$key1,$val1
$key2,$val2
$key3,$val3
이런식으로 깊은 메뉴로 들어가는 것 같네요.
결론.
위 소스를 활용하여 아주 예쁘게 잘 적용하였습니다.