아래의 소스에는 약간의 문제가 있습니다.
아래 기능을 본따 만든 애드온이 있습니다. https://xetown.com/691753
그걸 이용해주세요~
어저껜가 빵조각 메뉴 이야기가 나온 김에 제가 쓰는 빵조각 메뉴 소스를 공유해볼까 합니다.
스케치북 게시판 스킨에서 기본 제공되는 메뉴와는 다르게, '카테고리 제목'과 '문서 제목'까지 들어가는 빵조각입니다 ^^
1. 기본 설명
- 기존에는 'Home > 1차 메뉴 > 2차 메뉴 > 3차 메뉴' 이런 식으로만 나왔다면,
- 이 소스는 'Home > 1차 메뉴 > 2차 메뉴 > 3차 메뉴 > 카테고리 제목 > 문서 제목'까지 구현됩니다.
2. 어떤 때 사용하면 좋나요?
(1) 카테고리나 문서 주소를 '바로 가기' 메뉴로 사용할 때
- 하위 메뉴가 카테고리 주소나 문서 주소로 '바로 가기'일 경우에도 오류 없이 잘 구현됩니다.
(2) 메뉴 선택 이후 카테고리 제목도 빵조각으로 표현하고 싶을 때
- 현재 주소에서 카테고리를 선택했을 때, 최종 메뉴 이후에 카테고리 제목이 표시됩니다.
(3) 빵조각에 문서 제목도 표현하고 싶을 때
- 문서를 열었을 때, 최종 메뉴 또는 해당 메뉴의 카테고리 제목 이후에 문서 제목이 표시됩니다.
3. 어떤 점에 주의해야 하나요?
(1) 상위 메뉴 url과 하위 메뉴 url이 동일할 때
- 기존 소스에선 별다른 설정을 하지 않아도 상위 메뉴 제목은 평범하게 출력되고, 하위 메뉴 제목은 게시판 지정 색상으로 강조(em 태그)돼서 출력됐습니다.
- 카테고리와 문서 제목까지 출력하는 이 소스에선, 같은 url을 가진 하위 메뉴가 리스트 중에서 맨 앞에 오는 경우에만, 상위 메뉴는 평상 출력되고 하위 메뉴는 강조 출력됩니다. 그렇지 않으면 상위 메뉴와 하위 메뉴 모두 강조 출력되므로 유의하셔야 합니다.
- 따라서 ① 상위 메뉴와 같은 url을 가진 하위 메뉴를 리스트에서 맨 앞으로 가져오거나(권장), ② 아래 4-(1)번 소스의 5행과 8행에서 [0]으로 된 부분을 [1](리스트에서 두 번째)이나 [2](리스트에서 세 번째) 등으로 바꿔주시면 됩니다(가급적 비추).
(2) 문서 제목의 길이를 조정하고 싶을 때
- 현재 기본 길이는 20으로 되어 있습니다.
- 문서 제목 길이를 늘리거나 줄이고 싶으면, 아래 소스에서 {$oDocument->getTitle(20)}를 찾아 괄호 안의 숫자를 적당한 숫자로 바꾸시면 됩니다.
(3) 문서 제목은 출력하고 싶지 않을 때
- 아래의 4-(2)번 소스를 사용합니다.
- 단, 이 때엔 문서 주소로 '바로 가기'가 설정된 메뉴는 출력되지 않으므로 유의해야 합니다.
(4) 카테고리 제목은 출력하고 싶지 않을 때
- 아래의 4-(3)번 소스를 사용합니다.
- 단, 이 때엔 카테고리 주소로 '바로 가기'가 설정된 메뉴는 출력되지 않으므로 유의해야 합니다.
(5) 카테고리 제목과 문서 제목 모두 출력하고 싶지 않을 때
- 아래의 어떤 소스도 적용하지 않고, 스케치북 스킨의 빵조각 메뉴를 그대로 사용하면 됩니다.
- 단, 이 경우 카테고리 주소 또는 문서 주소로 '바로 가기'가 설정된 메뉴가 모두 출력되지 않으므로 유의해야 합니다.
(6) 그럼에도, '바로 가기'로 설정된 카테고리 제목과 문서 제목를 출력하고 싶을 때
- 위의 (3)~(5)의 유의사항에도 불구하고, '바로 가기' 메뉴에 한해 빵조각 메뉴로 출력하고 싶다면 별도의 코드를 짜셔야 합니다. ... (읭?)
- 나중에 기회가 되면 코드를 짜보도록 하겠습니다 ^^;;;
4. 예제 소스
- 다음 세 가지 중에서 필요한 경우를 골라, _breadcrumb.html 전체를 해당하는 소스로 대체하면 됩니다.
(1) 카테고리 제목과 문서 제목을 모두 출력하고자 할 때 (권장)
<div class="bd_bc fl">
<a href="{getSiteUrl()}"><strong>Home</strong></a>
<block loop="$main_menu->list=>$key1,$val1" cond="$val1['selected']">
<i class="fa fa-angle-right"></i>
<a href="{$val1['href']}"><!--@if($mid==$val1['url'] && !$category && !$oDocument->isExists() && $val1['text']!=array_values($val1['list'])[0]['text'])--><em>{$val1['text']}</em><!--@else-->{$val1['text']}<!--@end--></a>
<block loop="$val1['list']=>$key2,$val2" cond="$val2['selected']">
<i class="fa fa-angle-right"></i>
<a href="{$val2['href']}"><!--@if($mid==$val2['url'] && !$category && !$oDocument->isExists() && $val2['text']!=array_values($val2['list'])[0]['text'])--><em>{$val2['text']}</em><!--@else-->{$val2['text']}<!--@end--></a>
<block loop="$val2['list']=>$key3,$val3" cond="$val3['selected']">
<i class="fa fa-angle-right"></i>
<a href="{$val3['href']}"><!--@if($mid==$val3['url'] && !$category && !$oDocument->isExists())--><em>{$val3['text']}</em><!--@else-->{$val3['text']}<!--@end--></a>
</block>
</block>
</block>
<block loop="$category_list=>$key,$val" cond="!$oDocument->isExists() && $category && $val->selected">
<i class="fa fa-angle-right"></i>
<a href="{getUrl('','mid',$mid,'category',$category)}"><em>{$val->title}</em></a>
</block>
<block cond="$oDocument->isExists()">
<block cond="$oDocument->get('category_srl')">
<i class="fa fa-angle-right"></i>
<a href="{getUrl('','mid',$mid,'category',$oDocument->get('category_srl'))}">{$category_list[$oDocument->get('category_srl')]->title}</a>
</block>
<i class="fa fa-angle-right"></i>
<a href="{getFullUrl('','mid',$mid,'document_srl',$oDocument->document_srl)}"><em>{$oDocument->getTitle(20)}</em></a>
</block>
</div>
(2) 카테고리 제목까지만 출력하고 싶을 때 (문서 제목은 제외)
<div class="bd_bc fl">
<a href="{getSiteUrl()}"><strong>Home</strong></a>
<block loop="$main_menu->list=>$key1,$val1" cond="$val1['selected']">
<i class="fa fa-angle-right"></i>
<a href="{$val1['href']}"><!--@if($mid==$val1['url'] && !$category && $val1['url']!=array_values($val1['list'])[0]['url'])--><em>{$val1['text']}</em><!--@else-->{$val1['text']}<!--@end--></a>
<block loop="$val1['list']=>$key2,$val2" cond="$val2['selected']">
<i class="fa fa-angle-right"></i>
<a href="{$val2['href']}"><!--@if($mid==$val2['url'] && !$category && $val2['url']!=array_values($val2['list'])[0]['url'])--><em>{$val2['text']}</em><!--@else-->{$val2['text']}<!--@end--></a>
<block loop="$val2['list']=>$key3,$val3" cond="$val3['selected']">
<i class="fa fa-angle-right"></i>
<a href="{$val3['href']}"><!--@if($mid==$val3['url'] && !$category)--><em>{$val3['text']}</em><!--@else-->{$val3['text']}<!--@end--></a>
</block>
</block>
</block>
<block loop="$category_list=>$key,$val" cond="!$oDocument->isExists() && $category && $val->selected">
<i class="fa fa-angle-right"></i>
<a href="{getUrl('','mid',$mid,'category',$category)}"><em>{$val->title}</em></a>
</block>
<block cond="$oDocument->isExists() && $oDocument->get('category_srl')">
<i class="fa fa-angle-right"></i>
<a href="{getUrl('','mid',$mid,'category',$oDocument->get('category_srl'))}"><em>{$category_list[$oDocument->get('category_srl')]->title}</em></a>
</block>
</div>
(3) 문서 제목까지만 출력하고 싶을 때 (카테고리 제목은 제외)
<div class="bd_bc fl">
<a href="{getSiteUrl()}"><strong>Home</strong></a>
<block loop="$main_menu->list=>$key1,$val1" cond="$val1['selected']">
<i class="fa fa-angle-right"></i>
<a href="{$val1['href']}"><!--@if($mid==$val1['url'] && !$oDocument->isExists() && $val1['url']!=array_values($val1['list'])[0]['url'])--><em>{$val1['text']}</em><!--@else-->{$val1['text']}<!--@end--></a>
<block loop="$val1['list']=>$key2,$val2" cond="$val2['selected']">
<i class="fa fa-angle-right"></i>
<a href="{$val2['href']}"><!--@if($mid==$val2['url'] && !$oDocument->isExists() && $val2['url']!=array_values($val2['list'])[0]['url'])--><em>{$val2['text']}</em><!--@else-->{$val2['text']}<!--@end--></a>
<block loop="$val2['list']=>$key3,$val3" cond="$val3['selected']">
<i class="fa fa-angle-right"></i>
<a href="{$val3['href']}"><!--@if($mid==$val3['url'] && !!$oDocument->isExists())--><em>{$val3['text']}</em><!--@else-->{$val3['text']}<!--@end--></a>
</block>
</block>
</block>
<block cond="$oDocument->isExists()">
<i class="fa fa-angle-right"></i>
<a href="{getFullUrl('','mid',$mid,'document_srl',$oDocument->document_srl)}"><em>{$oDocument->getTitle(20)}</em></a>
</block>
</div>
