XeTown에 아래와 같은 질문이 올라와서 팁으로 남깁니다.
확장변수 슬픔 ,기쁨, 노여움 있다고 가정 할 때 슬픔을 선택한 글만 위젯으로 불러 올수 있는지요? 이미 구현되어 있는 위젯이 있다면 좀 알려주시고 어떦게 구현 해야 하는지 설명 주시면 감사하겠습니다
먼저 사용할 위젯을 선택합니다. 어떤 위젯이던 별 상관 없습니다.
지금 홈피에 사용중인 위젯 이라면 스킨을 따로 하나 만들어 적용하면 좋습니다.
보통 위젯의 skins 폴더에서 해당 스킨을 선택해 들어가면 외형틀.html 파일이 있습니다.
해당 파일이 list.html 이라고 가정하고 편집기로 열어보면 아래와 같은 foreach 문이 보입니다.(위젯별로 약간은 다를 수 있음)
<!--@foreach($widget_info->document_list as $oDocument)-->
이 부분 아래를 확장변수 ID 별로 선택 값 따라 출력되게 하는 방법입니다.
(확장변수 ID 가 select / 선택지가 슬픔, 기쁨, 노여움 3개)
<!--@foreach($widget_info->document_list as $oDocument)--> {@ $eid = $oDocument->getExtraEidValueHTML('select'); $eid_a = $oDocument->getExtraEidValueHTML('select')=='슬픔'; $eid_b = $oDocument->getExtraEidValueHTML('select')=='기쁨'; $eid_c = $oDocument->getExtraEidValueHTML('select')=='노여움'; } <div cond="$eid"> <div cond="$eid_a"> <span>내용 영역(해당 위젯에 따라 다르겠죠)</span> </div> </div> <!--@end-->
위와 같이 편집후 위젯 설정에서 대상모듈을 해당 게시판으로 지정하면
확장변수 ID 가 "select" 이고 값이 "슬픔"인 내용글만 출력됩니다.
cond="$eid_a" 이 부분만 $eid_b, $eid_c 로 바꾸어 주면 해당 값의 내용이 출력됩니다.
Mh Multi Widget 에서 List형식으로 일반적인 출력 입니다. 
적용부분이 확장변수 ID 이고 값으로 적용,변형, NO 중 "변형"값만 출력해 보면 아래와 같이 출력됩니다.

한가지 문제점이 리스트 목록수가 전체 목록수를 따라 갑니다.
더 나아가...
<div class="emotion-filters">
<button type="button" class="filter-btn" data-emotion="슬픔">슬픔</button>
<button type="button" class="filter-btn" data-emotion="기쁨">기쁨</button>
<button type="button" class="filter-btn" data-emotion="노여움">노여움</button>
</div>
<div class="content-area">
<!--@foreach($widget_info->document_list as $oDocument)-->
<!--@if($document_count[$oDocument->getExtraEidValueHTML('select')] < 5)-->
{@$document_count[$oDocument->getExtraEidValueHTML('select')]++}
<div class="content-item" data-emotion="{$oDocument->getExtraEidValueHTML('select')}">
<span>내용 영역(해당 위젯에 따라 다르겠죠)</span>
</div>
<!--@end-->
<!--@end-->
</div>
<script>
$(function() {
$('.filter-btn').click(function() {
var emotion = $(this).data('emotion');
$('.content-item').hide();
$('.content-item[data-emotion="' + emotion + '"]').show();
$('.filter-btn').removeClass('active');
$(this).addClass('active');
}).first().click();
});
</script>
<style>
.emotion-filters { margin-bottom:20px;}
.filter-btn { padding:8px 16px; margin-right:10px; border:1px solid #ddd; background:#f5f5f5; cursor:pointer;}
.filter-btn.active { background:#007bff; color:white; border-color:#0056b3;}
.content-item { margin-bottom:15px; padding:10px; border:1px solid #eee; display: none;}
</style>
위와 같이 코드를 짜면 해당 버턴 클릭시 각각의 내용물이 5개씩 출력됩니다.
https://moonhouse.co.kr/wtest

[ 위젯으로 만듬 ]
https://moonhouse.co.kr/xemy/595959
Tip이 도움이 되었다면 댓글과 평가 부탁합니다.
Tip에 대한 궁금한 점은 댓글로 남겨 주시면 성심껏 답변 드립니다. 
