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　>

XE기본 Xedition레이아웃을 편집이 편리하도록 수정한 버전입니다. 1탄 file
XE 1.8 버전대 기본레이아웃인 Xedition을 사용자가 편집이 편리하도록 수정한 버전 [v5 업데이트 내용] 1. 스마트폰에 적용가능하게 css 수정 했습니다. - toggle들 히든, 졸졸이스토커 히든, wing영역히든, 하단 메뉴와 위젯 히든 등... [v4 업데이트 내용] 1. 본문의 가로폭 크기를 지정 할 수 있습니다 - 1200px(기본), 980px(예전형) 2. 'SocialXE 모듈' 설치시 로그인박스에 SNS로그인 기능 추가 3. 개인정보 팝업의 위치를 수정 - 잘 보이게 ^.^! [v3 업데이트 내용] 1. Font Awesome icon 정상적으로 작동 되게끔 수정 - 이전버전 에서 누락됨 2. 상단 토글영역 추가 - 전체메뉴, Html메뉴 3. Wing영역 위젯, 베너 추가 확장 4. 사이트 개인정보알림 메뉴 추가 - 화면 중앙 팝업으로 출력 [v2 업데이트 내용] 1. Sub형태시 Body 우측에 졸졸이메뉴 추가 - 메뉴, 이미지, html선택가능 2. 사용자정의 단계별로 정리 [특징] 1. 배경색상과 텍스트색상을 변경가능 2. 상단영역 이미지와 사용가능 3. Wing영역과 하단영역에 위젯추가 가능(토글기능 가능) 4. 최하단에 페밀리사이트 추가가능 단순하게 특징을 적었지만 위의 적용만으로도 많은 편집이 가능합니다. 참고로 Demo버전은 삭제 했습니다. p.s xedition_MH 폴더를 새로 만들어 적용을 하셔도 되고 xedition을 사용중이시라면 _MH를 삭제하고 기본 폴더에 그대로 적용하셔도 됩니다.(쉬운설치를 실행하면 기본으로 돌아갑니다)
Board 나의 RM Category 레이아웃스킨 2016.12.07 팔공산 R 2038
레이아웃에 원형메뉴 구현하기 file
위의 이미지에서 보는 것과 같이 마우스클릭시 6개의 원형메뉴가 레이아웃에 나타나게 하는 방법입니다. 적용할 레이아웃을 고릅니다. 1. ../conf/info.xml을 열어서 아래의 메뉴항목을 추가합니다. <var name="roundmenu" type="select"> <title xml:lang="ko">★원형 메뉴사용</title> <title xml:lang="en">★Total Bottom User</title> <description xml:lang="ko">하단 원형 메뉴를 출력합니다</description> <description xml:lang="en">Bottom User</description> <options value=""> <title xml:lang="ko">출력안함</title> <title xml:lang="en">Not Display</title> </options> <options value="Y"> <title xml:lang="ko">출력</title> <title xml:lang="en">Display</title> </options> </var> <var name="rm_text0" type="text"> <title xml:lang="ko"> ┖ 버턴메뉴명</title> <title xml:lang="en"> ┖ Button Menu</title> <description xml:lang="ko">버턴메뉴명을 작성하세요.</description> <description xml:lang="en">Button Menu Name</description> </var> <var name="rm_b_color" type="text"> <title xml:lang="ko"> ┖ 버턴색상</title> <title xml:lang="en"> ┖ Button Color</title> <description xml:lang="ko">버턴색상을 지정하세요(기본 블랙)</description> <description xml:lang="en">Button Menu Colore(Basic black(#000000))</description> </var> <var name="rm_text1" type="text"> <title xml:lang="ko"> ┖ 1번 메뉴</title> <title xml:lang="en"> ┖ 1 Menu</title> <description xml:lang="ko">1번 메뉴명을 작성하세요.</description> <description xml:lang="en">1 Menu Name</description> </var> <var name="rm_url1" type="text"> <title xml:lang="ko"> ┖ 1번 메뉴 url</title> <title xml:lang="en"> ┖ 1 Menu Url</title> <description xml:lang="ko">1번 메뉴 주소를 적어세요.</description> <description xml:lang="en">1 Menu Url</description> </var> <var name="rm_text2" type="text"> <title xml:lang="ko"> ┖ 2번 메뉴</title> <title xml:lang="en"> ┖ 2 Menu</title> <description xml:lang="ko">2번 메뉴명을 작성하세요.</description> <description xml:lang="en">2 Menu Name</description> </var> <var name="rm_url2" type="text"> <title xml:lang="ko"> ┖ 2번 메뉴 url</title> <title xml:lang="en"> ┖ 2 Menu Url</title> <description xml:lang="ko">2번 메뉴 주소를 적어세요.</description> <description xml:lang="en">2 Menu Url</description> </var> <var name="rm_text3" type="text"> <title xml:lang="ko"> ┖ 3번 메뉴</title> <title xml:lang="en"> ┖ 3 Menu</title> <description xml:lang="ko">3번 메뉴명을 작성하세요.</description> <description xml:lang="en">3 Menu Name</description> </var> <var name="rm_url3" type="text"> <title xml:lang="ko"> ┖ 3번 메뉴 url</title> <title xml:lang="en"> ┖ 3 Menu Url</title> <description xml:lang="ko">3번 메뉴 주소를 적어세요.</description> <description xml:lang="en">3 Menu Url</description> </var> <var name="rm_text4" type="text"> <title xml:lang="ko"> ┖ 4번 메뉴</title> <title xml:lang="en"> ┖ 4 Menu</title> <description xml:lang="ko">4번 메뉴명을 작성하세요.</description> <description xml:lang="en">4 Menu Name</description> </var> <var name="rm_url4" type="text"> <title xml:lang="ko"> ┖ 4번 메뉴 url</title> <title xml:lang="en"> ┖ 4 Menu Url</title> <description xml:lang="ko">4번 메뉴 주소를 적어세요.</description> <description xml:lang="en">4 Menu Url</description> </var> <var name="rm_text5" type="text"> <title xml:lang="ko"> ┖ 5번 메뉴</title> <title xml:lang="en"> ┖ 5 Menu</title> <description xml:lang="ko">5번 메뉴명을 작성하세요.</description> <description xml:lang="en">5 Menu Name</description> </var> <var name="rm_url5" type="text"> <title xml:lang="ko"> ┖ 5번 메뉴 url</title> <title xml:lang="en"> ┖ 5 Menu Url</title> <description xml:lang="ko">5번 메뉴 주소를 적어세요.</description> <description xml:lang="en">5 Menu Url</description> </var> <var name="rm_text6" type="text"> <title xml:lang="ko"> ┖ 6번 메뉴</title> <title xml:lang="en"> ┖ 6 Menu</title> <description xml:lang="ko">6번 메뉴명을 작성하세요.</description> <description xml:lang="en">6 Menu Name</description> </var> <var name="rm_url6" type="text"> <title xml:lang="ko"> ┖ 6번 메뉴 url</title> <title xml:lang="en"> ┖ 6 Menu Url</title> <description xml:lang="ko">6번 메뉴 주소를 적어세요.</description> <description xml:lang="en">6 Menu Url</description> </var> 2. ../layout.html에 아래 코드를 적당한 곳에 추가합니다. <block cond="$layout_info->roundmenu == 'Y'"><include target="roundmenu.html" /></block> 3. roundmenu.html파일을 아래와 같이 만듭니다. <style> .menu { width:80px; height: 80px; box-sizing: border-box; font-size:12px; } .menu-open { display: none; } .menu-open-button { border:5px double #ffffff; border-radius: 50%; width: 50px; height: 50px; margin-left: 0px; position: absolute; color: #FFFFFF; text-align: center; line-height: 50px; -webkit-transform: ranslate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: -webkit-transform ease-out 200ms; transition: -webkit-transform ease-out 200ms; transition: transform ease-out 200ms; transition: transform ease-out 200ms, -webkit-transform ease-out 200ms; } .menu-open-button { z-index: 12; cursor: pointer; box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.14); } .menu-open:checked + .menu-open-button { -webkit-transition-timing-function: linear; transition-timing-function: linear; -webkit-transition-duration: 200ms; transition-duration: 200ms; -webkit-transform: scale(0.8, 0.8) translate3d(0, 0, 0); transform: scale(0.8, 0.8) translate3d(0, 0, 0); } .menu-item { background: #555555; border-radius: 50%; width: 49px; height: 49px; line-height: 49px; position: absolute; color: #FFFFFF; text-align: center; text-decoration:none; margin:3px; z-index: 11;} .menu-item:hover { background: #EEEEEE; color: #3290B1; } .menu-open:checked ~ .menu-item { -webkit-transition-timing-function: cubic-bezier(0.935, 0, 0.34, 1.33); transition-timing-function: cubic-bezier(0.935, 0, 0.34, 1.33); } .menu-open:checked ~ .menu-item:nth-child(3) { transition-duration: 180ms; -webkit-transition-duration: 180ms; -webkit-transform: translate3d(0.08361px, -74.99997px, 0); transform: translate3d(0.08361px, -74.99997px, 0); } .menu-open:checked ~ .menu-item:nth-child(4) { transition-duration: 280ms; -webkit-transition-duration: 280ms; -webkit-transform: translate3d(60.9466px, -32.47586px, 0); transform: translate3d(60.9466px, -32.47586px, 0); } .menu-open:checked ~ .menu-item:nth-child(5) { transition-duration: 380ms; -webkit-transition-duration: 380ms; -webkit-transform: translate3d(60.9466px, 32.47586px, 0); transform: translate3d(60.9466px, 32.47586px, 0); } .menu-open:checked ~ .menu-item:nth-child(6) { transition-duration: 480ms; -webkit-transition-duration: 480ms; -webkit-transform: translate3d(0.08361px, 74.99997px, 0); transform: translate3d(0.08361px, 74.99997px, 0); } .menu-open:checked ~ .menu-item:nth-child(7) { transition-duration: 580ms; -webkit-transition-duration: 580ms; -webkit-transform: translate3d(-60.86291px, 32.62064px, 0); transform: translate3d(-60.86291px, 32.62064px, 0); } .menu-open:checked ~ .menu-item:nth-child(8) { transition-duration: 680ms; -webkit-transition-duration: 680ms; -webkit-transform: translate3d(-60.03006px, -32.33095px, 0); transform: translate3d(-60.03006px, -32.33095px, 0); } .bluer { background-color: #669AE1; box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.14); text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.12); } .bluer:hover { color: #669AE1; text-shadow: none; } .greenr { background-color: #70CC72; box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.14); text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.12); } .greenr:hover { color: #70CC72; text-shadow: none; } .redr { background-color: #FE4365; box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.14); text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.12); } .redr:hover { color: #FE4365; text-shadow: none; } .purpler { background-color: #C49CDE; box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.14); text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.12); } .purpler:hover { color: #C49CDE; text-shadow: none; } .oranger { background-color: #FC913A; box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.14); text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.12); } .oranger:hover { color: #FC913A; text-shadow: none; } .lightbluer { background-color: #62C2E4; box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.14); text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.12); } .lightbluer:hover { color: #62C2E4; text-shadow: none; } </style> <block cond="!$layout_info->rm_b_color">{@ $layout_info->rm_b_color = 'black'}</block> <div class="menu" style="margin:0px 0px 0px 0px;"> <input type="checkbox" href="#" class="menu-open" name="menu-open" id="menu-open" /> <label class="menu-open-button" for="menu-open" style="background: {$layout_info->rm_b_color};"> <span>{$layout_info->rm_text0}</span> </label> <a href="{$layout_info->rm_url1}" class="menu-item bluer">{$layout_info->rm_text1}</a> <a href="{$layout_info->rm_url2}" class="menu-item greenr">{$layout_info->rm_text2}</a> <a href="{$layout_info->rm_url3}" class="menu-item redr">{$layout_info->rm_text3}</a> <a href="{$layout_info->rm_url4}" class="menu-item purpler">{$layout_info->rm_text4}</a> <a href="{$layout_info->rm_url5}" class="menu-item oranger">{$layout_info->rm_text5}</a> <a href="{$layout_info->rm_url6}" class="menu-item lightbluer">{$layout_info->rm_text6}</a> </div> style="margin:0px 0px 0px 0px;" 이곳에 원형메뉴가 위치할 적당한 수치를 입력하세요.
Board 나의 RM Category Tip 2016.10.28 팔공산 R 936
CSS3로 메뉴에 hover 효과주기 - 회전하며 색상및문구변경 file
[크롬에서는 정상적으로 작동을 하나, 익스플로러에서는 마우스클릭이 어렵습니다] 아래의 메뉴에서 처럼 마우스오버시 회전하며 색상및 문구가 변경되게 하는 Tip을 XE메뉴에 적용하는 방법입니다. 반갑습니다 <style> .gnb { margin:0px Auto; text-align: center; padding:0 5px; } .gnb a { padding:0 5px 0 0px; font-weight:bold; font-size:1em; line-height: 25px; text-decoration:none; overflow:hidden; color:white;} .link-effect-1 a span { position: relative; padding: 0 5px; background:black; display: inline-block; vertical-align: middle; *vertical-align: auto; *zoom: 1; *display: inline; -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; transition: 0.3s; -moz-transform-origin: 50% 0 50%; -ms-transform-origin: 50% 0 50%; -webkit-transform-origin: 50% 0 50%; transform-origin: 50% 0 50%; -moz-transform-style: preserve-3d; -webkit-transform-style: preserve-3d; transform-style: preserve-3d;} .link-effect-1 a span::before { position: absolute; top: 100%; left: 0; width: 100%; height: 100%; background: gray; content: attr(data-hover); -moz-transition: background 0.3s; -o-transition: background 0.3s; -webkit-transition: background 0.3s; transition: background 0.3s; -moz-transform: rotateX(-90deg); -ms-transform: rotateX(-90deg); -webkit-transform: rotateX(-90deg); transform: rotateX(-90deg); -moz-transform-origin: 50% 0 50%; -ms-transform-origin: 50% 0 50%; -webkit-transform-origin: 50% 0 50%; transform-origin: 50% 0 50%;} .link-effect-1 a:hover span, .link-effect-1 a:focus span { -moz-transform: rotateX(90deg) translateY(-22px); -ms-transform: rotateX(90deg) translateY(-22px); -webkit-transform: rotateX(90deg) translateY(-22px); transform: rotateX(90deg) translateY(-22px);} .link-effect-1 a:hover span::before, .link-effect-1 a:focus span::before { background:white; color:black;} </style> <div class="gnb"> <!--@foreach($bottom_menu->list as $key => $val)--><!--@if($val['link'])--> <!--@if($val['selected'])--> {@ $menu_1st = $val } <!--@end--> <!--@if($val['selected'])--><!--@end--> <span class="link-effect-1"> <a href="{$val['href']}"<!--@if($val['open_window']=='Y')-->onclick="window.open(this.href);return false;"<!--@end-->>| <span data-hover="{$val['text']}">{$val['text']}</span></a> </span> <!--@endif--><!--@endforeach--> </div> 오렌지색 부분이 바탕색상 및 글꼴색상 변경하는 부분입니다. 파란색부분을 수정하면 가로,세로 배열을 바꿀 수 있습니다. span 대신에 div 하면 세로 정렬됩니다.
Board 나의 RM Category Tip 2016.06.11 팔공산 R 1530

My Xe - FirstThumb 스킨
Xe of Moonhouse　>

profile
팔공산
Nov 25 2018
Lightbox 전용 Slideing 위젯 file
위젯에서 썸네일 클릭시 이미지가 화면위에 출력되는 Lightbox기능 전용 Slideing 위젯입니다. [특징] 1. 기본설정으로 두면 250*200의 썸네일 한개씩 5개의 게시물 이미지가 슬라이드로 출력 2. 썸네일을 클릭하면 이미지가 화면 중앙부위에 Lightbox로 출력 3. Lightbox 좌,우로 Nav버턴 과 이미지 아래 좌측에 게시글제목과 우측에 X 버턴으로 닫기 적용 4. 설정을 잘 이용하면 여러개의 이미지 출력도 가능하며, 제목글 내용글등도 출력가능합니다. 5. 반응형(모바일)기능도 잘 작동합니다.(한개의 썸네일만 출력 / Lightbox 이미지는 지정 수 만큼) 6. 게시글에 이미지파일이 없으면 위젯에 게시글이 출력되지를 않습니다. [Lightbox 위젯] [썸네일 클릭시 출력되는 프레임]
profile
팔공산
Nov 24 2018
MH Multi V3.3 - 최신글+내용글+댓글+썸네일(링크, 줌, Lightbox) file
최신버전 바로가기 이전 버전에서 설명을 보고 오시면 편합니다. [주의사항] 페이지기능을 선택했을시 위젯캐시를 주면 페이지기능이 작동을 하지 않습니다. [V3.3 특징] 1. 내용글 세로 칸 수를 지정해서 공간의 여백을 최소화 https://moonhouse.co.kr/463054 2. 마우스 Hover시 배경 색상지정 가능 3. Skin별로 겹쳐지는 images와 css, js 통합 4. 썸네일 클릭시 "Lightbox 형식" 추가, 총3가지 선택 가능합니다.(링크, Zoom) https://moonhouse.co.kr/wp 의 아래 썸네일 클릭시 Lightbox형태로 출력됩니다.

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

2007.08.31 웹진형 게시판의 최근글 위젯 스킨입니다. 6,045
웹진형 게시판의 최근글 위젯 스킨입니다. 조회수: 266, 추천수: 4, 2007.08.29 23:52:57 게시글 주소 : http://www.zeroboard.com/13548654 엮인글 주소 : http://www.zeroboard.com/13548654/trackback 바람처럼822 1) 이 위젯은 기본으로 제공되는 xe_official(XE 공식 레이아웃용 최신글 스킨)을 거의 베겨서 만들었기 때문에 다른 xe_official 스킨들과 같이 사용하실 때 잘 어울립니다.(베낀자의 변명 ^^*) 2) 많은 문제점이 있을 수 있습니다. ^^ 3) 적용예 : http://inote.byus.net/zbxe/ 사용법 1) 압축을 풀어서 "제로보드XE의 설치경로/widgets/new_document/skins 폴더" 안에 넣으면 됩니다. 2) 이후사용방법은 다른 최근글 적용법과 동일합니다. 3) 첨부한 소스중 list.html에서 (1)숫자로 썸네일 이미지의 크기조정, (2)의 getSummary(100)안의 숫자로 가져올 본문의 글자수를 조정 하실수 있습니다. ★ 이미지 크기를 조정하실 경우 (1)은 3곳을 모두 고치셔야 깨끗한 이미지를 얻으실수 있습니다. 4) 이미지나 글자수를 조정하신 뒤에 이미지가 크거나 글이 길어서 잘려나가거나, 반대로 이미지나 글자수가 작어서 갖격이 너무 벌어지는 경우에는 css폴더의 css 파일중 .news_latest_white ul li { position:relative; height:90px; padding-left:10px; overflow:hidden; } 이 부분의 height 의 수치를 조정해 주십시오. 기본은 90px입니다. 그리고 글의 위치가 너무 밑으로 내려가는건 <td valign="top">으로 조정해 보세요 <추신> 아래 대물꾼 뚝새님이 스킨의 그림크기와 본문의 글자수 조정이 잘 안된다고 하셔서 실험을 해 봤는데... 저는 잘 되는데요 ㅠㅠ (아래에 댓글을 달려니까 이미지는 다른 곳에 두고 링크만 걸어야되서 그냥 여기에 이여서 적었습니다.) 첨부 : news.zip (3.6KB)(4)
2007.08.30 최근게시물 New 아이콘 출력 위젯 2 5,294
최근게시물 New 아이콘 출력 위젯 조회수: 445, 추천수: 1, 2007.08.26 17:44:19 게시글 주소 : http://www.zeroboard.com/12942796 엮인글 주소 : http://www.zeroboard.com/12942796/trackback 현재 잡다한 몽상백서 메인화면에 보면 최근게시물 타이틀 옆에 new 아이콘이 붙어 있는것을 볼 수 있을 것이다. http://jobdahan.net 이 아이콘 이 아이콘은 글 작성한지 24시간동안 보여지게 되는것이다. 즉, 글을 등록하면 24시간동안 저 아이콘이 보여지게 된다. 이 아이콘을 출력하는 소스는 아래에서 참고 하면 되겠다. zbxe/widgets/newst_document/skins/default/list.html 파일 소스이다. [첨부파일 업로드 위치 : zbxe/widgets/newst_document/skins/default ] 그냥 아이콘 하나 출력 시키는것이라 기본 디폴트 스킨폴더명을 그대로 사용함. 기존 사용중인 디폴트 폴더를 지우고 업로드 하셔도 되고, 첨부파일을 압축을 푼뒤 폴더명과 skin.xml 파일에서 타이틀을 바꾸고 사용해도 됨. <!-- 설정된 컬러셋의 종류에 따라서 css파일을 import 합니다 --> <!--@if($colorset=="normal"||!$colorset)--> <!--%import("normal/style.css")--> <!--@elseif($colorset=="blue")--> <!--%import("blue/style.css")--> <!--@end--> <div class="newest_document_default_{$colorset}"> <div class="newest_document_default_box"> <div class="title_box"> <div class="title">{$widget_info->title}</div> <!--@if($widget_info->module_name)--> <div class="more"><a href="{getUrl('','mid',$widget_info->module_name)}">more</a></div> <!--@end--> </div> <!--@foreach($widget_info->document_list as $oDocument)--> <div class="document_box"> <div class="document"> {@ $write_time=$oDocument->getRegdate("Y-m-d H:i") } {@ $time_check=str_replace(" ","-",$write_time) } {@ $time_check=str_replace(":","-",$time_check) } {@ $time_check=explode("-",$time_check) } {@ $write_time2=mktime($time_check[3],$time_check[4],$time_check[5],$time_check[1],$time_check[2],$time_check[0]) } {@ $now_time=mktime(date("H"),date("i"),date("s"),date("m"),date("d"),date("Y")) } {@ $time_pass=($now_time-$write_time2) } <a href="{$oDocument->getPermanentUrl()}#{$oDocument->getCommentCount()}"> {$oDocument->getTitleText($widget_info->subject_cut_size)} <!--@if($time_pass < 86400)--> <img src="./new.gif" align=absmiddle> <!--@end--> </a> <!--@if($oDocument->getCommentCount())-->  <span class="comment"><a href="{$oDocument->getPermanentUrl()}#comment">*{$oDocument->getCommentCount()}</a></span> <!--@end--> <span class="writer"> - {$oDocument->getNickName()} </span> </div> <div class="regdate">{$oDocument->getRegdate("Y-m-d")}</div> </div> <!--@end--> </div> </div> 붉은 부분이 추가됨으로써 new 아이콘이 출력이 되는 것이다. 여기서 24시간 대신 다른 시간으로 설정하려면 86400 부분을 고쳐주면 된다. 24시간=60초*60분*24시간 =86400 이 되는것이다. (24시간을 초단위로 환산한것이다.) 12시간=60초*60분*12시간-43200이 되겠죠.. ^^ 첨부 : default.zip (5.0KB)(60)
2007.08.30 [버그수정] whiteeye_binamu_newest_02 최근 문서 출력 위젯 공개 2,768
[버그수정] whiteeye_binamu_newest_02 최근 문서 출력 위젯 공개 조회수: 599, 추천수: 4, 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님 정보를 넣어야 했는데, 그 수정과정에 넣은 문자 하나 때문에 안 보이는 것이었습니다.. ㅠ.ㅠ;;; 1 / 14 loading images... whiteeye_binamu_newest_02_01.png 직접 홈페이지에서 확인하시고 싶으신 분은 아래의 주소에서 확인 바랍니다.(다만, 이 위젯의 경우 14색이나 되기 때문에 홈페이지에서 모든 색을 다 볼 수는 없습니다... ^^;;;;;;;) http://edu.binamu.com/bbs/ 첨부 : whiteeye_binamu_newest_02.zip (188.7KB)(56)
2007.08.30 제로보드5의 최근글 스킨을 뽑아왔습니다. 3,455
제로보드5의 최근글 스킨을 뽑아왔습니다. 조회수: 3517, 추천수: 2, 2007.08.13 13:04:41 게시글 주소 : http://www.zeroboard.com/3992300 엮인글 주소 : http://www.zeroboard.com/3992300/trackback 나이스투 기본적으로 내장되있는 녀석들은 normal과 blue 였죠. zb5에 있던 녀석들을 더 뽑아와봤습니다. 1 / 1 loading images... skins.jpg zbxe가 설치된 폴더 내에 widgets-newest_document-skins-default 안에 압축을 풀어주시면 됩니다. 첨부 : zb5_skin.zip (10.0KB)(214)
2007.08.30 Eond Blu > Default_Round Style 로그인 위젯입니다. 3,403
Eond Blu > Default_Round Style 로그인 위젯입니다. 조회수: 247, 추천수: 8, 2007.08.26 12:13:36 게시글 주소 : http://www.zeroboard.com/12906828 엮인글 주소 : http://www.zeroboard.com/12906828/trackback Eond Blu 홈페이지의 로그인 부분입니다. 이름을 뭘로 할까 고민했는데 eond_blu 로 하려다가 나중에 더 추가 수정하면 그 때 쓰고 이번에는 default 스킨을 가지고 수정한 거니깐 그냥 default_round 로 했습니다. XE 사용자공간 > 사용자 팁에 로그인 수정하는 팁을 올린 적이 있는데 그 결과물 로그인 위젯 입니다. 파이어폭스에서 작업했고 IE에서도 살짝 몇 픽셀 정도는 차이가 납니다. ^^; 이 로그인위젯이 색상과 스타일면에서 가장 대중적이지 않을까 생각되네요. 쿄쿄쿗~ 추천 많이 해주세요 ㅎ [스킨 받기] 다운받으실 때 추천 한 방씩만 눌러주세요 ㅋ http://eond.com 실제 로그인이 사용되는 홈페이지입니다. 참고로 저도 구글애드센스 달았는데 3년 동안 5달라 모았다나 어쨌다나.. ( ''); 센스 있는 추천 좀 해주세요. ^^ 로그인 위젯에서 1등 되는 게 꿈이에요!; 꿈이 있는 센스, 부탁해요;; 첨부 : default_round.zip (12.9KB)(70)

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

게시판 제목 종료일 위치 글쓴이 날짜 조회수 지도
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,551 나의 RM 5 전광판위젯 변형해 보기 file
　┖ 멋집니다 그런데 한줄 전광판 에서 정사각형 박스형 전광판으로 바꿀수는 없는지좀 알... 멋쟁이
　┖ 위에 팔공산님이 설명해주신 대로 하시면 사각 박스형이 스크롤도 됩니다. 저역시 팔공... 숙지황
　┖ 숙지황님이 답을 해 주셨네. 감사합니다. 원래 아래에 있던 이미지가 이미지가 아니라 ... 팔공산
　┖ 저거는 가로 면적을 너무 많이 잡아 먹고 5개의 게시물이 있네요 정사각형안에 하나 의... 멋쟁이
　┖ 그렇게 할려면 손이 많이 가야 겠네요. 그리고 내용 나오는 부분도 글자수 조절을 해야... 팔공산
팔공산 2008.03.25 16,438
2,550 RM 자료 5 언제나 졸졸 스토커 애드온 0.2
　┖ 아래로 이동은 설정을 어떻게 하나요? html에 #bottom 넣어줘도 되지않네요. 제로공식... 강영곤
　┖ html에 #bottom 하면은 되는데요. 저는 그렇게 작동합니다. 저의 stalker.html소스입니... 팔공산
　┖ 감사합니다. 좋은 참조가 되겠네요. 새해 복 많이 받으십시오. 강영곤
　┖ 80산님 쫄쫄이 스토커 0.3버젼을 설치해는데 잘 되는것 같아요 근데 이미지를 바꾸고 ... 스트라이
　┖ 졸졸이 스토커는 애드온버전에서 위젯버전으로 최종마무리 되었습니다. 제가 사용하는 ... 팔공산
팔공산 2008.02.02 5,806
2,549 나의 RM 5 로고에 플래시파일 사용하기
　┖ layout 에서 위 소스로 바꾸었지만 아직 XE 로그가 그대로 나오는데.... 레이아웃 설정... 알라뷰
　┖ 늦게 봤네요.^.^ 죄송 위에 설명한 것을 따라해 보세요. 만약 변경이 되지 않으면 레이... 팔공산
　┖ 소스제공 정말고맙습니다. 헌데 화면붙여넣기가 안돼서 일일이 소스를 베껴쓸려고 하니... 물사랑
　┖ 죄송합니다. 몰랐네요. 초창기에 시험삼아 우측마우스 금지 소스 넣어 놓은걸 지우지 ... 팔공산
　┖ <div id="header"> 부분전체를 찾으신후아래것으로 치환하세요 <div id="header"> <h1>... 물사랑
팔공산 2007.09.26 12,718
2,548 나의 RM 5 MH통합게시판위젯 V1.2 file
　┖ 통합보드 위젯은 제가 바라던 부분을 100%이상 만족시켜주는 프로그램입니다. 위 빨갛... 모르지오
　┖ 모르지오님 반갑습니다. 와! 그런 세밀한 부분까지 보시다니 대단하십니다. 저도 님의 ... 팔공산
　┖ 위 내용대로 수정했습니다. 아울러 통합보드기능에서 단일모듈선택시 more기능과 write... 모르지오
　┖ 원래 위젯에는 님이 말씀하신 기능이 들어있습니다. 그런데 xe 1.1.5가 되면서 모듈선... 팔공산
　┖ 아~ 그런 수고로움이 있다면 참았다가 xe업버전에서 다시 한 번 시도 해봐야 겠네요. ... 모르지오
팔공산 2009.02.03 43,064
2,547 QNA 5 도와 주십시요!! file
　┖ 죄송 합니다만 점검좀 부탁 드려도 될런지요? 숙지황
　┖ 숙지황님 아이디와 비번 지웁니다. 첫화면에 나오는군요 mh_simple레이아웃이 ie7에서... 팔공산
　┖ 역시 고수님 께서는 한방에 진단 을 마치시는군요.. 감사 합니다. 이쁘게 정돈도 다 해... 숙지황
　┖ IE6에서는 위치들이 약간씩 어긋나는 경우가 생깁니다. 되도록이면 IE7이나 FF사용을 ... 팔공산
　┖ 팔공산님 참 친절하게 잘 가르쳐 주셔서 고마운 마음을 감출 수 없습니다. 실력 좋으신... 감로수
숙지황 2009.03.01 24,699

 

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