MH Justice Latout Manual
X 24 시간 닫기 X

MH Multi Widget

  1. Shopping
  2. 주문상태
  3. 주문QA
  4. Demo
  5. 메뉴얼
  6. 제작의뢰
  7. XE작품
  8. 가입인사
1.0x

My Xe - 웹진스킨 - LightBox
Xpressengine of Moonhouse　>

마우스오버시 우측으로 펼쳐지는 내용 및 메뉴 file
마우스오브시 상단의 이미지와 같이 로그인메뉴가 나오고 알림글이 우측으로 펼처져 출력되게 하는 방법입니다. 아이디어에 따라서 다양한 출력이 가능하겠죠. * 먼저 css파일에 추가할 코드 /* Accordion Toggle */ .ubt { text-align:left; list-style: none; padding:5px; margin:0 Auto; } .ubt { zoom: 1; } .ubt:before, .ubt:after { content: ''; display: table; } .ubt:after { clear: both; } .ubt a { text-decoration:none; } .ubt li { position: relative; float: left; margin: 0; } .ubt li:active { margin-top: 1px; margin-bottom: 7px; } .ubt li:after { content: ''; z-index: 2; position: absolute; top: 10px; right: -2px; width: 5px; height: 6px; opacity: .95; background: #eb6b22; border-radius: 3px 0 0 3px; -webkit-box-shadow: inset 1px 0 #99400e; box-shadow: inset 1px 0 #99400e; } .ubt span { position: absolute; top: 1px; left: 100%; z-index: 2; overflow: hidden; max-width: 0; height: 24px; line-height: 21px; padding: 0 0 0 2px; color: white; text-shadow: 0 -1px rgba(0, 0, 0, 0.3); background: #eb6b22; border: 1px solid; border-color: #d15813 #c85412 #bf5011; border-radius: 0 2px 2px 0; opacity: .95; background-image: -webkit-linear-gradient(top, #ed7b39, #df5e14); background-image: -moz-linear-gradient(top, #ed7b39, #df5e14); background-image: -o-linear-gradient(top, #ed7b39, #df5e14); background-image: linear-gradient(to bottom, #ed7b39, #df5e14); -webkit-transition: 0.3s ease-out; -moz-transition: 0.3s ease-out; -o-transition: 0.3s ease-out; transition: 0.3s ease-out; -webkit-transition-property: padding, max-width; -moz-transition-property: padding, max-width; -o-transition-property: padding, max-width; transition-property: padding, max-width; } .ubt p, s, .ubt span { display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .ubt p, s { height: 26px; line-height: 23px; padding: 0 9px 0 8px; font-size: 12px; color: #555; text-decoration: none; text-shadow: 0 1px white; background: #fafafa; border-width: 1px 0 1px 1px; border-style: solid; border-color: #dadada #d2d2d2 #c5c5c5; border-radius: 3px 0 0 3px; background-image: -webkit-linear-gradient(top, #fcfcfc, #f0f0f0); background-image: -moz-linear-gradient(top, #fcfcfc, #f0f0f0); background-image: -o-linear-gradient(top, #fcfcfc, #f0f0f0); background-image: linear-gradient(to bottom, #fcfcfc, #f0f0f0); -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7), 0 1px 2px rgba(0, 0, 0, 0.05); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7), 0 1px 2px rgba(0, 0, 0, 0.05); } .ubt p:hover span { padding: 0 7px 0 6px; max-width: 1000px; -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15), 1px 1px 2px rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15), 1px 1px 2px rgba(0, 0, 0, 0.2); } .ubt s:hover span { padding: 0 7px 0 6px; max-width: 1000px; -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15), 1px 1px 2px rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15), 1px 1px 2px rgba(0, 0, 0, 0.2); } .greena li:after { background: #65bb34; -webkit-box-shadow: inset 1px 0 #3a6b1e; box-shadow: inset 1px 0 #3a6b1e; } .greena span { background: #65bb34; border-color: #549b2b #4f9329 #4b8b27; background-image: -webkit-linear-gradient(top, #71ca3f, #5aa72e); background-image: -moz-linear-gradient(top, #71ca3f, #5aa72e); background-image: -o-linear-gradient(top, #71ca3f, #5aa72e); background-image: linear-gradient(to bottom, #71ca3f, #5aa72e); } .bluea li:after { background: #56a3d5; -webkit-box-shadow: inset 1px 0 #276f9e; box-shadow: inset 1px 0 #276f9e; } .bluea span { background: #56a3d5; border-color: #3591cd #318cc7 #2f86be; background-image: -webkit-linear-gradient(top, #6aaeda, #4298d0); background-image: -moz-linear-gradient(top, #6aaeda, #4298d0); background-image: -o-linear-gradient(top, #6aaeda, #4298d0); background-image: linear-gradient(to bottom, #6aaeda, #4298d0); } 1. 로그인메뉴 추가방법 <style> .ubt s:hover span { width: 230px; } </style> <div cond="$layout_info->b_menu_Login == 'Y'" class="ubt"> <li><s>LogIn <i class="fa fa-sign-in" aria-hidden="true" style="color:#ff6600;"></i><span> <!--@if($logged_info)--> <a href="{getUrl('act','dispMemberLogout')}" style="color:{$layout_info->bt_text_color};">Logout |</a> <a href="{geturl('act','dispMemberInfo')}" style="color:{$layout_info->bt_text_color};">MyInfo |</a> <!--@else--> <a href="{getUrl('act','dispMemberLoginForm')}" style="color:{$layout_info->bt_text_color};">Login |</a> <a href="{getUrl('mid',$layout_info->target_mid,'act','dispMemberSignUpForm')}" style="color:{$layout_info->bt_text_color};">Join |</a> <!--@end--> <!--@if($logged_info->is_admin == "Y")--> <a href="{getUrl('act','dispLayoutAdminEdit','layout_srl',$layout_info->layout_srl)}" style="color:{$layout_info->bt_text_color};">Edit |</a> <a href="{getUrl('act','dispLayoutAdminModify','layout_srl',$layout_info->layout_srl)}" style="color:{$layout_info->bt_text_color};">Modify |</a> <a href="{getUrl('','module','admin')}" " onclick="window.open(this.href); return false;" style="color:{$layout_info->bt_text_color};">Admin |</a> <!--@else--> <a href="javascript:bookmarksite('{$layout_info->fa}', '{$layout_info->index_url}')" style="color:{$layout_info->bt_text_color};">Bookmark |</a> <!--@end--> </span></s></li> </div> 2. 알림내용 추가방법 <style> .ubt p:hover span { width:{$layout_info->bodyWrap_width-80}px; } </style> <ul cond="$layout_info->b_text_toggle == '' && $layout_info->b_text1" class="ubt greena" style="width:{$layout_info->bodyWrap_width}px;"> <li><p>Notice <i class="fa fa-bullhorn" aria-hidden="true" style="color:green"></i><span>{$layout_info->b_text1}</span></p></li> </ul> <ul cond="$layout_info->b_text_toggle == '' && $layout_info->b_text2" class="ubt bluea" style="width:{$layout_info->bodyWrap_width}px;"> <li><p>Notice <i class="fa fa-bullhorn" aria-hidden="true" style="color:blue"></i><span>{$layout_info->b_text2}</span></p></li> </ul> 레이아웃설정 코드는 알아서 주셔야 합니다. {$layout_info->b_text1} [중요] 1. 상단의 이미지와 같이 2개 이상의 버턴을 출력할려면 .ubt s, .ubt p와 같이 s 와 p 같은 분류자로 나누어 주어야 가로 넓이를 다르게 줄 수 있습니다. 2. 색상출력 class="ubt" - 오렌지색상 class="ubt greena" - 그린색상 class="ubt bluea" - 블루색상
Board 나의 RM Category Tip 2016.04.26 팔공산 R 1245
Wing영역 아코디언메뉴 생성하는 방법 file
레이아웃의 본문 좌,우측 Wing영역에 이미지파일 하나도 사용하지 않고 스타일리시하게 3차 Menu부터 아코디언처럼 펼쳐지는 메뉴설정 방법입니다. 1. 메뉴를 추가할 레이아웃의 layout.html안에 Wing영역의 메뉴부분에 아래의 코드를 추가합니다. 제가 사용중인 파일도 올립니다. wingmenu.html-x 올리고 보니 .html 확장자 뒤에 무조건 -x가 붙네요. 참고하세요. <style> .wmtop a { color:#ffffff; } .wmtop a:hover { color:#ff6600; } .wmsub a { color:#ffffff; } .wmsub a:hover { color:#ff6600; } </style> <nav> <ul> <!--@foreach($main_menu->list as $key => $val)--><!--@if($val['link'])--> <!--@if($val['selected']&&$val['list'])--> {@ $menu_1st = $val } <li class="wmtop"<!--@if($val['selected'])-->class="on"<!--@end-->><a href="{$val['href']}" <!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@end--> >{$val['link']}</a><span></span> </li> <!--@end--> <!--@end--><!--@end--> <!--@foreach($main_menu->list as $key => $val)--><!--@if($val['link'])--> {@ $menu_1st = $val } <!--@if($val['selected']&&$val['list'])--> <!--@foreach($menu_1st['list'] as $key => $val)--><!--@if($val['link'])--> {@ $menu_2nd = $val } <li class="wmsub"<!--@if($val['selected'])-->class="active"<!--@end-->><a href="{$val['href']}" <!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@end-->> {$val['link']}</a> <!--@if($val['list'] && ($val['expand']=='Y'||$val['selected']) )--> <ul> <!--@foreach($val['list'] as $k => $v)--><!--@if($v['link'])--> <!--@if($v['selected'])--> {@ $menu_3th = $v } <!--@end--> <li<!--@if($v['selected'])-->class="on"<!--@end-->><a href="{$v['href']}" <!--@if($v['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@end-->>{$v['link']}</a></li> <!--@if($v['list'] && ($v['expand']=='Y'||$v['selected']) )--> <!--@foreach($v['list'] as $k => $v4)--><!--@if($v4['link'])--> <!--@if($v['selected'])--> {@ $menu_4th = $v4 } <!--@end--> <li<!--@if($v['selected'])-->class="on"<!--@end-->><a href="{$v4['href']}" <!--@if($v4['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@end-->>{$v4['link']}</a></li> <!--@end--><!--@end--> <!--@end--> <!--@end--><!--@end--> </ul> <!--@end--> </li> <!--@endif--><!--@endforeach--> <!--@end--> <!--@endif--><!--@endforeach--> </ul> </nav> 2. style.css 다운받은 css파일안의 코드를 해당 레이아웃css파일안에 추가합니다. 3. 색상변경 * 메뉴글 색상 <style> .wmtop a { color:#ffffff; } .wmtop a:hover { color:#ff6600; } .wmsub a { color:#ffffff; } .wmsub a:hover { color:#ff6600; } </style> * 메뉴바탕 색상 - css안에 - 전체메뉴배경 색상 nav ul li { background: -webkit-linear-gradient(top, rgba(75,78,88,1) 0%,rgba(63,66,74,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(75,78,88,1) 0%,rgba(63,66,74,1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(75,78,88,1) 0%,rgba(63,66,74,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, #4B4E58 0%,#3F424A 100%); /* W3C */ box-shadow: rgba(255,255,255,0.1) 1px 1px 0 inset; border-bottom: #292b30 1px solid; } - 3차 아코디언배경 색상 .wmsub ul li:hover { background: -webkit-linear-gradient(top, rgba(58,96,209,1) 0%,rgba(44,72,194,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(58,96,209,1) 0%,rgba(44,72,194,1) 100%); /* Opera 11.10+ */background: -ms-linear-gradient(top, rgba(58,96,209,1) 0%,rgba(44,72,194,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, #ffffff 0%,#eeeeee 100%); /* W3C */ box-shadow:#5173d5 1px 1px 0 inset; } 진한 부분들을 적절히 수정하면 됩니다. rgba값들도 같이 수정을 해 주시면 좋습니다. 제가 귀찮아서~~~^.^
Board 나의 RM Category Tip 2016.04.26 팔공산 R 1571
메뉴 클릭시 화면 중앙에 팝업으로 띄우기 file
위의 이미지와 같이 해당 메뉴를 클릭시 화면 중앙에 팝업으로 띄우는 소스입니다. "개인정보취급방침" 같은 메뉴를 띄울때 사용하면 좋겠죠... 1. privacy라는 임의의 페이지mid를 생성해서 문구를 작성합니다. 아래의 소스를 해당 레이아웃의 적당한 곳에 배치를 합니다. <a href = "javascript:void(0)" onclick = "document.getElementById('light_01').style.display='block';document.getElementById('fade').style.display='block'" style="color:black">개인정보취급방침 l</a> <div id="light_01" class="white_content"> <a href = "javascript:void(0)" onclick = "document.getElementById('light_01').style.display='none';document.getElementById('fade').style.display='none'"><i class="fa fa-times-circle fa-2x" aria-hidden="true"></i></a> <iframe src="/privacy" frameBorder=0 width=100% height=500px scrolling=auto></iframe> </div> <div id="fade" class="black_overlay"></div> 2. css파일에 아래의 소스를 붙여 넣습니다. /* Privacy */ .black_overlay{ display: none; position: absolute; top: 0%; left: 0%; width: 100%; height: 1500px; background-color: black; z-index:1001; -moz-opacity: 0.8; opacity:.80; filter: alpha(opacity=80); } .white_content { display: none; position: absolute; top: 25%; left: 25%; width: 50%; height: 510px; padding: 0 16px 16px 16px; border: 16px solid orange; background-color: #ffffff; z-index:1002; overflow: auto; style="margin-top:30px;"} .white_content a { position: absolute; top: 2%; right: 5%; color:orange } 여러개의 메뉴가 존재한다면 light_01 이 부분을 메뉴별로 다르게 주면 됩니다. 물론 mid와 메뉴명도 달리 주어야 겠죠. 그리고 x표시는 fortawesome웹폰트를 적용했습니다. 그냥 Close라는 문구로 바꾸셔도 됩니다. 게시판형식도 가능합니다. 대문페이지 하단에 "가입인사" 메뉴를 눌러보세요.
Board 나의 RM Category Tip 2016.04.21 팔공산 R 1751

My Xe - FirstThumb 스킨
Xe of Moonhouse　>

profile
팔공산
Oct 25 2018
MH PageSwitch 위젯 file
갤러리슬라이드를 다양한 형태로 제공하는 PageSwitch Widget입니다. [특징] 1. Slide의 형태가 120가지 입니다. 2. 제목, 내용, 날짜, 글쓴이 출력 유무 가능합니다. 3. 스마트폰에서도 잘 작동합니다. 4. 마우스 휠로 이전 다음 작동 슬라이드의 형태가 너무 많아서 설정에는 기본되는 10가지만 넣었습니다. /widgets/mh_pageswitch/skins/default/list.html 안에 보시면 120가지의 형태가 있습니다. 페이지 잘라 내기 효과 fade scroll scroll3d scrollCover scrollCoverReverse scrollCoverIn scrollCoverOut scrollX scroll3dX scrollCoverX scrollCoverReverseX scrollCoverInX scrollCoverOutX scrollY scroll3dY scrollCoverY scrollCoverReverseY scrollCoverInY scrollCoverOutY slide slideCover slideCoverReverse slideCoverIn slideCoverOut slideX slideCoverX slideCoverReverseX slideCoverInX slideCoverOutX slideY slideCoverY slideCoverReverseY slideCoverInY slideCoverOutY flow flowCover flowCoverReverse flowCoverIn flowCoverOut flowX flowCoverX flowCoverReverseX flowCoverInX flowCoverOutX flowY flowCoverY flowCoverReverseY flowCoverInY flowCoverOutY slice sliceX sliceY zoom zoomCover zoomCoverReverse zoomCoverIn zoomCoverOut zoomX zoomCoverX zoomCoverReverseX zoomCoverInX zoomCoverOutX zoomY zoomCoverY zoomCoverReverseY zoomCoverInY zoomCoverOutY skew skewCover skewCoverReverse skewCoverIn skewCoverOut skewX skewCoverX skewCoverReverseX skewCoverInX skewCoverOutX skewY skewCoverY skewCoverReverseY skewCoverInY skewCoverOutY flip flip3d flipClock flipPaper flipCover flipCoverReverse flipCoverIn flipCoverOut flipX flip3dX flipClockX flipPaperX flipCoverX flipCoverReverseX flipCoverInX flipCoverOutX flipY flip3dY flipClockY flipPaperY flipCoverY flipCoverReverseY flipCoverInY flipCoverOutY bomb bombCover bombCoverReverse bombCoverIn bombCoverOut bombX bombCoverX bombCoverReverseX bombCoverInX bombCoverOutX bombY bombCoverY bombCoverReverseY bombCoverInY bombCoverOutY 해당 형태를 적용해 볼려면 list.html파일안에 {$wi->slide_type}부분을 지우고 해당 형태를 대입해 보면 됩니다. <script> var reg=location.search.match(/ts=([^&]*)/), ts=reg&&reg[1]|| '{$wi->slide_type}',
profile
팔공산
Oct 20 2018
MH_Sliding 레이아웃 file
MH_Sliding 레이아웃을 공개합니다. 소스는 아래에서 제공 받아서 XE에서 작동하게끔 수정했습니다. http://www.htmldrive.net/items/show/1848/Sliding-preview-images-Panels-Template-with-jQuery [특징] - 화면을 4등분해서 각각 메뉴로 작동합니다. - 각 화면의 배경을 이미지로 지정 가능 합니다. 이미지로 지정하지 않을시 배경색상으로도 지정 가능합니다. - 각 화면을 클릭시 전체 화면으로 슬라이드되며 배경아래에 설명문을 작성할 수 있습니다. - 상단 메뉴와 슬라이딩 메뉴를 출력할 수 있습니다. - 로고이미지와 관리자버턴(로그인/관리/기타)을 출력할 수 있습니다. - 텍스트영역의 높낮이를 설정할 수 있습니다.

Xe Data - 카멜레온스킨
Xe Datas of Moonhouse　>

2007.08.27 로그인 체크 애드온 v0.1 & 사용자 출력 위젯 v0.1 3,869
로그인 체크 애드온 v0.1 조회수: 121, 2007.08.26 22:35:06 게시글 주소 : http://www.zeroboard.com/12975225 엮인글 주소 : http://www.zeroboard.com/12975225/trackback VHAIN 현재 로그인 한 사용자 목록을 출력 하려고 할때 필요해서 작성합니다. zb5beta와는 달리 session 테이블이 없더군요.. last_login 으로 하자니, 이는 페이지 이동시에는 갱신되지 않고, 처음 로그인시에만 갱신되더군요.. 그래서, 페이지를 이동할때 마다 계속하여 로그인정보를 기록해주는 애드온을 만들었습니다. 우선, 애드온 관리 페이지에서 아래와 같이 "사용"으로 변경하게 되시면, 우선, 애드온은 테이블을 하나 만들게 됩니다. login_check 라는 이름으로요. 이 테이블은 두개의 column을 가지고 있습니다. 하나는 member_srl, 그리고 다른 하나는 login_time 입니다. member_srl에는 해당하는 Member의 Srl이, login_time에는 해당 Member가 최근으로 페이지를 갱신한 때를 유닉스 타임 스템프 형식으로 저장해 놓도록 하였습니다. 일단 저는 현재 로그인한 사용자목록만 만들었으나, 이를 무한하게 활용할 수 있지 않을까 라고 생각됩니다. 제로님의 v0.1.1 배포 이후로 애드온에서의 executeQuery가 가능해져서 만들어봤습니다 ^^ 다운로드 (.zip) 현재 로그인한 사용자 출력 위젯 v0.1 조회수: 176, 추천수: 1, 2007.08.26 22:41:16 게시글 주소 : http://www.zeroboard.com/12976666 엮인글 주소 : http://www.zeroboard.com/12976666/trackback VHAIN 음... zb5beta에는 있었는데, xe에는 없어서 만들었습니다. 우선, 이 위젯이 동작하기 위해서는 애드온자료실에 있는 로그인 체크 애드온이 꼭 활성화 되어있어야 하구요.. 스킨의 경우, 특정 그룹 멤버 출력의 스킨을 그대로 가져왔습니다... 음..우선 이 위젯을 추가하시면 아래와 같은 모습으로 추가되구요.. 현재로부터 x분전까지 갱신한 사람들의 목록을 출력합니다. (x의 경우 위젯 설정에서 설정이 가능합니다.) 아래는 위젯 설정창의 모습입니다. 다운로드 (.zip)
2007.08.27 whiteeye_binamu_newest_02 최근 문서 출력 위젯 공개 2,894
whiteeye_binamu_newest_02 최근 문서 출력 위젯 공개조회수: 434, 추천수: 2, 2007.08.25 14:45:40 게시글 주소 : http://www.zeroboard.com/12784443 엮인글 주소 : http://www.zeroboard.com/12784443/trackback 비나무 먼저 원 그래픽 이미지 저작권자인 whiteeye님(http://whitefree.com/)께서 배포를 허락해 주신 점 감사드립니다. 배포문 단상 열기 배포문 단상 닫기 제가 일부 수정하고 컨버팅한 이 위젯 사실 우여곡절이 많은 녀석들입니다. 클베에 들어가면서 CSS를 공부하기 시작했고, 제로보드XE에 적응하기 위해서 익힌 CSS를 하나 하나 적용해 나가는 과정에 시험삼아 잠깐 손을 본 적이 있었습니다. 그 때까지만 해도 일부 문제가 있긴 해도 파폭에서 비교적 제대로 보이는 것만 확인하고 난 후, 삭제를 해버렸었고요. (그 때는 어디까지나 공부 목적이이었습니다... 하하하) 그리고 오픈베타 후 당연히 제로보드XE용으로 많이 컨버팅이 될 거라 생각을 했는데 생각보다는 최근 문서 출력 위젯이 안 올라오더군요... 그러다 기다리기 힘들어서(제 개인 홈페이지와 제가 근무하는 학교 홈페이지를 이번에 XE용으로 전부 새롭게 디자인을 하려고 했거든요.. ^^) 제가 직접 개인적으로 사용할 목적으로 그 때의 기억을 되살려 이것저것 손을 다시 보고 그 당시 문제가 있었던 부분을 손을 보고 해서 파폭과 IE6에서 잘 보이는 것(http://www.zeroboard.com/zbxe_user_review/12576277)을 확인하고 바로 적용하려고 했었습니다. 그러다 IE7에서 최근 글이 안 보인다는 백성찬님의 제보로 혹시 IE의 박스모델 버그를 해결하기 위해 사용한 핵이 IE7과 충돌이 나는 것으로 생각을 했다가, 비엔유(BNU)님의 조언(http://www.zeroboard.com/home_freeboard/12665353)을 통해서 파폭과 IE6에 문제가 없던 부분이 IE7에서는 문제점을 나타낸다는 것을 알고 최종 수정하여 정상적으로 출력되는 것을 확인(http://www.zeroboard.com/home_freeboard/12740430)한 후 몇몇 분의 공개요청으로 whiteeye님의 허락을 받고 공개하는 겁니다. 이 위젯을 테스트해 주시고, 조언 주신 모든 분께도 감사드립니다!!!! 두번째 배포하는 위젯은 whiteeye_binamu_newest_02입니다. 원 이미지 저작권자분의 이름을 명시해야 겠기에 저렇게 이름을 정했습니다. (결례를 용서하십시오. 배포문을 보시면 아시겠지만 저도 워낙 고생을 한 지라 제 닉네임도.... ^^;;;;;;;) 출력되는 형태는 아래와 같습니다. 압축을 푸신 후 폴더통째로 widgets/newest_document/skins의 경로에 업로드하시면 됩니다. 먼저 다운로드 받으신 분들은 다시 받아서 덮어씌워주세요.. ㅠ.ㅠ;;; 스킨정보 파일에 사용해서는 안 되는 문자가 있나 보네요. 그 문자 하나 때문에 제대로 인식을 못한 듯 합니다. 스킨을 배포하려니 whiteeye님 정보를 넣어야 했는데, 그 수정과정에 넣은 문자 하나 때문에 안 보이는 것이었습니다.. ㅠ.ㅠ;;; 14 / 14 loading images... whiteeye_binamu_newest_02_14.png 직접 홈페이지에서 확인하시고 싶으신 분은 아래의 주소에서 확인 바랍니다.(다만, 이 위젯의 경우 14색이나 되기 때문에 홈페이지에서 모든 색을 다 볼 수는 없습니다... ^^;;;;;;;) http://edu.binamu.com/bbs/ 첨부 : whiteeye_binamu_newest_02.zip (188.7KB)(19)
2007.08.26 라이트박스 애드온 ver 0.5.7 (업데이트) 4,462
라이트박스 애드온 ver 0.5.7 (업데이트) 조회수: 293, 추천수: 3, 2007.08.25 03:47:01 게시글 주소 : http://www.zeroboard.com/12735299 엮인글 주소 : http://www.zeroboard.com/12735299/trackback 베니 주의: 0.5 버전을 다운 받으셨던 분은 이전 버전을 서버에서 삭제하신 후 다시 업로드 해주시면 감사하겠습니다. 불편을 드려서 죄송합니다. ^^;; (이 애드온의 최신판 업데이트는 XE 공식사이트와 제 블로그의 라이트박스 애드온 포스트 에서 하도록 하겠습니다. ^^) 이 애드온은 현재 Zeroboard XE 0.1.1에서 테스트되었습니다. 현재 이 애드온의 버전은 0.5.7입니다. (하루만에 3번 릴리즈 -_-) 0.5.7: 예기치 않은 비정상 작동으로 페이지/게시판/블로그 편집시 문제가 발생하는 현상을 수정했습니다. 0.5.6: 0.5.5 배포본 안의 실수 약간을 수정. 문제가 생길만한 부분 수정 0.5.5: 0.5의 문제 수정 버전. 스크립트를 LightBox에서 그 Modification인 Lytebox로 교체 0.5.0: 첫 릴리즈 이 애드온은 제로보드 XE로 만든 웹사이트에 포함된 이미지를 자동으로 라이트박스 모듈과 연결시켜줍니다. 아울러 제로보드 XE에 기본적으로 포함된 이미지 자동축소 루틴을 라이트박스 모듈과 연결시키는 루틴으로 교체해줍니다. 라이트 박스란?? 라이트 박스는 그림을 팝업형식으로 띄우면서도 윈도우창을 별도로 열거나 하지 않으면서 그림을 예쁘게 출력해주는 가장 인기있는 자바 스크립트중 하나입니다. 최근에는 이 라이브러리 자체의 덩치도 꽤 커져서 그냥 만들어 쓰시는 분들도 계십니다만 전 세계적으로 많이 쓰는 스크립트중 하나이기 때문에 브라우저간 호환성이나 프로젝트 진행속도가 가장 나을것 같아서 이것을 선택하였습니다. 단, 0.5.7 버전은 오리지널 라이트박스의 경량판이면서도 동일한 효과를 가지는 Lytebox 3.2 스크립트를 사용하고 있습니다. Markus F. Hay씨의 Lytebox 3.2 사이트 Lokesh Dhakar씨의 Lightbox 2.0 사이트 이 애드온을 설치하시면 XE의 게시물이나 블로그의 사진들이 위처럼 나옵니다. 아울러 이 애드온은 바로 윗 사진처럼 레이아웃을 깨뜨리지 않기 위해 자동으로 축소된 이미지의 출력 방식 역시 제로보드 XE코드를 라이트박스 코드로 갈아치웁니다. (깔아보시면 이해하실 수 있을겁니다... 아마도) 뿐만 아니라 모듈 인스턴스(보통 위젯에서 타겟 모듈이라고 칭하는)간에 선택적으로 적용이 가능하므로 '사진 게시판'이나 기타 그림과 관련된 게시판에만 기능을 적용시킬 수 있습니다. 설치방법 1) 본 문서에 첨부된 파일을 다운로드 받습니다. (ZIP 포맷, TAR.GZ 포맷) 2) 압축을 해제합니다. 압축이 풀린 디렉토리 아래에 'digist_lightbox'라는 디렉토리가 생겨있음을 확인하실 수 있습니다. 3) 서브디렉토리까지 모두 포함하여 digist_lightbox 디렉토리 내용 전부를 제로보드 XE의 Addons 디렉토리에 업로드합니다. 예를 들어 zbxe라는 디렉토리에 제로보드가 설치되어 있다면 경로는 다음과 같습니다. (/zbxe/addons/digist_lightbox) 4) Admin 화면에 들어가서 애드온 메뉴를 누릅니다. 적합하게 설치되었다면 "DIGIST 라이트박스 활성화 애드온"이라는 애드온이 목록에 출력될 것입니다. 애드온을 활성화 시키기 위하여 "사용"상태로 만들어 주십시오. 주의: 만일 이전에 0.5 버전을 설치하셨던 분은 불편하시더라도 이전 버전을 완전히 삭제하신 후에 재설치 해주시기 바랍니다. 세부설정 이 애드온은 부가적인 사용자 설정을 지원하고 있습니다. 좀 더 원활한 사용을 위하여 본 애드온의 설정방법에 대해 숙지하시기 바랍니다. (정 모르시겠다면 설정을 하지 않고 그냥 쓰셔도 되긴 합니다.) XE관리자 메뉴의 애드온 설정화면에서 본 애드온의 "설정" 버튼을 클릭하시면 위와 같은 창이 뜹니다. - 대상 모듈은 실제로 모듈 그 자체가 아닌 모듈의 인스턴스를 가리키고 있습니다. 쉽게 말해서 게시판이나 블로그의 아이디를 써주시면 됩니다. (board 모듈로 만든 freeboard 게시판. mid값으로 설정되는 freeboard라는 이름이 바로 이 아이디입니다.) - 대상 모듈을 공란으로 비우면 제로보드 XE 영향하에 구동되는 모든 모듈의 인스턴스(페이지 포함)가 렌더링될때 이 애드온이구동됩니다. - 대상 모듈을 한정하고 싶다면 mid값을 차례대로 기록하되 이름끼리 쉼표(,)로 연결하시기 바랍니다.(예: freeboard,myblog) 이렇게 mid가 지정되면 해당 mid값을 가진 블로그나 게시판, 페이지만이 라이트박스를 이용하여 모든 이미지를 볼 수 있게 됩니다. - 대상 모듈로 지정되지 않은 게시판이나 블로그, 페이지에선 그림을 클릭해도 라이트박스가 뜨지 않습니다. 단, 이미지가 커서 자동으로 축소된 이미지는 라이트박스가 구동되어 원본 이미지를 보여줍니다. - 만일 작동방법 필드에 "resizedOnly"라고 쓰시면 대상 모듈에 상관없이 무조건 사이트의 이미지 중에 자동으로 축소한 이미지만을 라이트박스를 이용하여 보여주게 됩니다. ※ 제목을 출력시킬수도 있습니다. 그림을 본문에 삽입할 때 에디터에서 "설명입력"을 하시면 그것이 제목으로 나오게 됩니다. 참고 1) 이 애드온은 Lightbox의 경량판으로 Markus F. Hay씨가 작성한 Lytebox 3.2 버전 스크립트를 사용합니다. 2) 이 스크립트는 제로보드 XE 1.0.1과 테스트 되었습니다. 제로보드가 업그레이드되어 정상적인 작동을 하지 않을 수 있음에 유의해주십시오. 만일 이 애드온 때문에 사이트의 작동이 불안하다면 제로보드 XE 설치 디렉토리 아래의 /files/cache/activated_addons.cache.php 파일을 FTP로 삭제후 다시 웹사이트를 로딩하시면 됩니다. 3) 이 애드온의 라이센스는 GPL입니다. 참고로 Lytebox 3.2의 라이센스는 Creative Commons License 3.0입니다. 4) 문의나 건의가 있으시면 답글 달아주십시오. 메일이나 쪽지는 잘 보지 못합니다. 5) /lytebox/lytebos.js 파일의 상단부 몇가지 변수를 고치면 그림이 펼쳐지는 속도를 빠르게 하거나 애니메이션을 꺼버릴 수 있습니다. 31번째 라인: var resizeSpeed = 10; // 이것을 1~10사이의 값으로 셋팅합니다. 10이 가장 빠릅니다.(라이트박스는 7) 34번째 라인: this.autoResize = false; // 이것을 true로 하면 창에 비해 너무 거대한 그림을 자동으로 축소합니다. 이 애드온은 오리지널 Lightbox와 동일한 효과를 가지기 위해 기본값이 false로 변경되어 있습니다. 35번째 라인: this.doAnimations = true; // 이것을 false로 하면 그림이 커지는 효과가 사라집니다. 이 버전은 오페라, 파이어폭스, IE 6 및 IE 7에서 정상 작동됩니다. 적용예 (테스트 사이트가 아니니 부디 테스트글을 올리진 마시기 바랍니다. -_-) 버그리포트나 문의사항은 이쪽으로 몇가지 단점 및 문제점 1) 블로그 같은 경우에 적용시키면 프로필 사진 같은것에 함께 적용되는 아쉬움이 있습니다. 아직 거기까진 어떻게 처리를 못했습니다. (그냥 지금 정도로도 괜찮다고 생각합니다. 갠적으로 블로그는 이 애드온의 타겟 모듈에서 제외시켜 버렸습니다.) 사진을 블로그 자체에 올리시는 분들이라면 프로필 사진을 사용하지 마시거나 스킨에서 <IMG>태그가 아닌 CSS background로 처리해주시면 이런 문제가 생기지 않게 됩니다. 2) 현재로선 정해진 모듈 이외에 제로보드 XE원래의 처리 방법으로 구동하게 만드는 출력방식은 지원하지 않고 있습니다. (귀찮기도 하고 괜히 옵션만 마구잡이로 늘것 같아서...) 3) 이건 이 애드온의 문제가 아니라 제로보드 XE 에디터의 문제입니다만... 현재로선 사진을 삽입한 다음에 그림만 선택하고 문단에 대한 좌측/우측/가운데 정렬을 하게 되면 <IMG>태그 양쪽에 <DIV>가 생기면서 출력시 그림이 리사이즈 되지 못합니다. 큰 그림을 삽입하실때엔 문단 정렬을 따로 누르지 않으시는게 좋습니다. ※ 참고로 문단정렬을 하지 않고 그림 자체의 정렬 방법만 대입하면 오페라에선 정렬된 내용이 보이지 않더군요. :( 사용에 대한 어떤 예기치 않은 '위험'에 대해서도 책임지지 않습니다. (별일 있겠습니까만은.... ^^;;) 부디 도움이 되시기를 바랍니다. =) digist_light.0.5.7.zip (45.7KB)(8) digist_lightbox.0.5.7.tar.gz (37.9KB)(4)
2007.08.23 특수문자 입력기 0.3 3,380
특수문자 입력기 0.3 조회수: 293, 추천수: 2, 2007.08.19 17:04:30 게시글 주소 : http://www.zeroboard.com/5134425 엮인글 주소 : http://www.zeroboard.com/5134425/trackback Simulz 각종 특수 문자를 분류별로 나누어 입력할 수 있습니다. 실험해보기 아래 링크에서 ※ 아이콘을 누르면 컴포넌트 창이 열립니다. http://k10206.oranc.co.kr/zbxe/?mid=guestbook 내려받기(2) (2007.08.22) 첨부파일을 /zbxe/modules/editor/components/special_character 폴더에 풀어주세요. ※ IE7, FF2에서 정상 작동 됨 업데이트 내용 · 완성형(KS) 문자표를 참고하여 특수문자를 재정렬 하였습니다. · KS 코드 A1A9를 - (빼기) 기호로 대체하였습니다. · Webdings 특수 문자를 추가하였습니다.(적용 하기전 컴포넌트는 special_character.zip 파일) 스마티 템플릿 때문에 } 글자는 제외 했는데 }를 어떻게 표시해야 하나요... 첨부 : special_character.zip (11.2KB)(6) special_character(2).zip (12.1KB)(22)
2007.08.22 그라데이션 텍스트 beta 3,305
그라데이션 텍스트 beta 조회수: 278, 추천수: 1, 2007.08.18 15:27:07 게시글 주소 : http://www.zeroboard.com/4979469 엮인글 주소 : http://www.zeroboard.com/4979469/trackback Simulz 테스트 페이지 아이콘을 누르고 글을 입력해보세요. http://k10206.oranc.co.kr/zbxe/guestbook muhwa님의 자바스크립트 소스를 XE에 맞게 변경하였습니다. 문장에 컬러 그라데이션 색상을 적용할 수 있습니다. Download 압축파일을 /zbxe/modules/editor/components/text_spectrum 폴더에 풀고 XE의 위지윅 에디터 관리 페이지에서 text_spectrum 컴포넌트를 활성화 하면 됩니다. ※ 오류: 적용된 글을 다시 컴포넌트로 불러올 때 줄바꿈이 되는 오류가 있는데 원인을 모르겠습니다. ※ 오류2: 파이어폭스에서 스펙트럼 적용이 안됩니다. 소스 변경 중... 적용 예제 PHP 관련 정보는 상단의 PHP 메뉴로 들어가시면 됩니다. 왼쪽 메뉴 설명 Classic Midi 247개의 클래식 미디 파일을 다운로드 할 수 있습니다. Web Editor 웹에서 문서를 작성할 때 사용되는 에디터입니다. 첨부 : text_spectrum.zip (5.0KB)(39) P000.png (328Byte)(6)

지도 바로가기 - 스케치북 리스트스킨

게시판 제목 종료일 위치 글쓴이 날짜 조회수 지도
Map 충청 충주 중앙탑 file 충주 중앙탑 팔공산 2024.03.20 113
Map 서울 서울 이순신장군 동상 file 서울 이순신장군 동상 팔공산 2024.03.20 102
Map 전라 쏠비치 진도 file 쏠비치 진도 팔공산 2024.03.20 123
Map 강원 정동진 모래시계공원 file 정동진 모래시계공원 팔공산 2024.03.20 95
Map 대구 종료 앞산공원 전망대 file 2025-04-30 앞산공원 전망대 팔공산 2023.03.29 129

댓글 많은순

No 게시판 제목 글쓴이 날짜 조회수
2,561 Free 4 오늘은 로또 1등이 2번이나 ㅋ
　┖ 전 진짜 로또를 말하는줄 알고 충격을 먹었습니다^.^ 근데 사이트 로또였네요 ㅎㅎㅎ ... 팔공산
　┖ 아핫~~ ㅎ 그래도 기운이라도 받으셨으면 좋은거죠 ㅋ 랩퍼투혼
　┖ 이런 아이콘은 어디서 구하나요? 참 귀엽네요. 風文
　┖ 글 작성에서 이모티콘2 아이콘 누르면 짝 나옵니다. https://moonhouse.co.kr/xemy/930... 팔공산
랩퍼투혼 2024.07.27 2,809
2,560 Free 4 로그인이 지속되면 자동출석이 안되는 버그
　┖ 수정했는데 내일이 되어봐야 알 수 있을 듯 합니다. 팔공산
　┖ {@sticker:538334|538337} 랩퍼투혼
　┖ 이런 ㅋㅋ 글을 썼는데 스티커랑 같이 들어가는줄 알았는데 따로 되는거군여 ㅠㅠ 이런... 랩퍼투혼
　┖ 자동 출석 되네요 팔공산
랩퍼투혼 2024.03.29 3,400
2,559 Free 4 컨텐츠이용 편의성에 대한 건의 file
　┖ 우! 와~ 긴 글 감사합니다. 님의 좋은 조언들은 저에게 많은 참고가 되고 있습니다. 근... 팔공산
　┖ {@sticker:538384|538385} 랩퍼투혼
　┖ 마음 속 우편함 세상 모든 사람들은 각자의 마음속에 우편함을 하나씩 두고 있다. 그 ... 이은주
　┖ 같은 글 세 개는 삭제 했습니다 팔공산
랩퍼투혼 2023.12.26 2,766
2,558 달집의 팁 4 천박사 퇴마 연구소 설경의 비밀 한글자막 file
　┖ 이걸 자막이라고 올렸나 차라리 없느니만 못한 자막 ㅂㅈㄷ
　┖ ai로 만든 자막이라 허접할 수도 있습니다. 제가 테스트겸 올린 자막이라 피드벡이 궁... 팔공산
　┖ ㅋㅋㅋ 영화가 묘할거 같다 허준호~~~진지하지만 웃길거 같은 캐릭 랩퍼투혼
　┖ 웃긴 케릭터는 아닙니다. 절대악입니다. 팔공산
팔공산 2023.11.19 1,888
2,557 Webui Tip 4 KoreanDollLikeness file
　┖ 로라 제작하는데 전기 많이 잡아먹는다는데 대단하네요 ㅋㅋ 하루
　┖ 구글 코렙에서 작업하는데도 내 컴퓨터가 전기를 많이 먹는가요? 팔공산
　┖ 아뇨 코랩은 구글이 책임지죠. 로라는 보통 집컴으로 개인들이 수시간 학습시켜서 만드... 하루
　┖ 아하! 그 말씀이군요. 팔공산
팔공산 2023.05.06 1,580

 

Mh_Multi Widget 특징

 

It's a multi widget that we've been creating since the XE super window, so you can output widgets in almost any form.

 

mhmulti-001.jpg

 

 

[업그레이드 내용]

•문서내의 모든 이미지를 썸네일로 출력 기능 추가(선택가능)

Screenshot 2020-10-05 at 13.00.27.jpg

 

 1. Mh_multi Widget 에 총 5가지 Skin이 포함되어 있으며 Skin 마다 각각 고유의 형테로 구성    

    • 완벽히 위젯별로 작동합니다.

       - 동일 Skin 으로 한페이지에 다수의 위젯을 생성할시 위젯설정에 "위젯 NO"를 다르게 적용

       mhmulti016.jpg 

 

  2. 거의 완벽한 반응형(모바일형)으로 츨력이 가능

    • 함께 배포되는 mhstyle 위젯스타일 적용시

       - https://moonhouse.co.kr/xetip/469297

     mhmulti-008.jpg

 

  3. 간단한 설정 으로 색상변경 가능

    • 총 9가지 색상 선택

     mhmulti-009.jpg

    • 위젯 타이틀, 게시물 제목, Hover 테두리, more색상등 변경

     line.jpg

    • 설정 옵션들에서 자신만의 컬러로 변경 가능 

 

  4. 거의 완벽한 설정으로 각 위젯이 카멜레온처럼 변형이 가능 

    • 페이지기능으로 Total게시판 기능으로 활용

       - ajax 기능으로 화면 리플레쉬 없이 작동합니다.

    • 모든 항목을 추가, 제외 가능 - 썸네일, 테두리, 위젯타이틀, 제목, 내용, 글쓴이, 날짜등

    • 모든 항목의 색상 지정 가능 - 테두리, 제목, 내용, 바탕색, Hover색상등

 

  5. 썸네일 클릭시 3가지 형태로 츨력가능 

    • 기본적으로 게시판으로 연결

    • Right Box 형식으로 출력

     mhmulti-010.jpg

    • Zoom 형식으로 출력

     mhmulti-011.jpg 

 

  6. 다양한 설정

    • 대상 모듈의 대상 분류 srl값으로도 출력 가능

    • 내용글 세로 칸 수를 지정해서 공간의 여백을 최소화

    • 댓글 출력가능

     mhmulti-012.jpg

    • 그룹별, 포인트별, 레벨별로 출력 가능

     2021-09-23 123907.jpg

    • 모듈명, 분류명 출력 가능

     mhmulti-014.jpg

    • 확장값 출력 가능

     mhmulti-015.jpg

 

  7. MoonHouse 자료들은 폰트어썸과 Sexy Button 그리고 말풍선(툴팁) 애드온들이 자주 사용됩니다.

      Web Fonts Addon  /  말풍선(툴팁) 애드온을 설치해서 애드온들을 활성화 시켜야 아이콘과 버턴들이 정상적으로 출력됩니다.

      페이지기능을 지원하는 Widgets의 경우는 "위젯 케시를 0" 으로 둬야 정상 작동합니다.

 

Shoping Demo Manual Q&A

 

Mh_Multi Widget 메뉴얼

 

1. 총 5가지 Skins

 

 1. Sketchbook5 Webzin 형태

     mhmulti-002.jpg

 

 2. Sketchbook5 List 형태

     mhmulti-003.jpg

     

    •SketchBook5 게시판스킨 - 문하우스 수정버전 Pro 와 연동하여 날짜지정 종료/진행중/종료임박/오늘종료 버턴을 출력할 수 있습니다.

       - https://moonhouse.co.kr/xetip/506303

     mhmulti-004.jpg

 

 3. chameleon 형태

     mhmulti-005.jpg

 

 4. Smart 형태

     mhmulti-006.jpg

 

 5. Scroll - 공지사항형태

     mhmulti-007.jpg

Mh Product Sales

This area displays Product Sales made by Moonhouse.

Mh Justice Layout

Mh Justice Layout is a one page html5 bootstrap template.
This template comes with smooth animations, pop-up video and many more…

1. As soon as onePage is operated and the bootstrap and animations are applied, the animation is output in each section.

2. Almost perfect response (mobile)

3. Built-in various self-programming programs
• accordion menu
• iPhone background login pop-up
• Background slide
• Notice pop-up window

Read more

Mh Multi Sale

It's a multi widget that we've been creating since the XE super window, so you can output widgets in almost any form.

1. Works perfectly per widget. - Old versions create multiple widgets on one page with the same skin, causing problems with page function or multiple places

2. Add shortcut to on the title bar the top of the two.

3. can print out the source, without using a using the image output rightbox.

Read more