Layouts Of MoonHouse

Mh Justice Layout V 1...

Mh Sideways Layout

Mh Gallery Layout & M...

문하우스 Simple 레이...

Mh Thomsander Layout ...

Mh White Layout V1.1

Mh LeftMenu 레이아웃 ...

MH FullPage 레이아웃 ...

MH Pointy Slider 레이...

MH_Sliding 레이아웃

사이트선택 전용 레이...

XE기본 Xedition레이아...

XE기본 Xedition레이아...

Widgets Of MoonHouse

Data Of MoonHouse

3 4 5 6 7

Layouts Of MoonHouse

    • Mh Justice Layout V 1.6 [ 2025. 06. 09 ] - Sale 제품
    • Mh Justice Layout is a one page html5 bootstrap template. This template comes with smooth a...
    • 2023.03.26
    • Mh Sideways Layout
    • [특징] •화면전환이 가로 방향으로 움직입니다. •홍보용 사이트 레이아웃에 적합합니다. •화면 좌...
    • 2022.05.16
    • Mh Gallery Layout & Mh Gallery Widget V2.2 [2022.05.22] - Sale 제품
    • [ V2.2 특징 ] •Colorbox Skin 추가 - 첫화면에 박스출력 - Auto Slide 지원 •본문 메뉴(GNB)를 ...
    • 2022.05.02
    • 문하우스 Simple 레이아웃 V 1.4 (2020.12.13 Up)
    • V1.4 수정내용(2020.12.13) 1. 코드정리 2. 자체 로그인 탑재 3. 메뉴 아래 "mh_simple 소식"은 M...
    • 2015.05.18
    • Mh Thomsander Layout V1.0
    • [특징] - 페이지안에서 부메뉴가 Box형식으로 열립니다. - 배경이미지를 슬라이드로 출력합니다. ...
    • 2019.09.12
    • Mh White Layout V1.1
    • [ V1.1 특징 ] 1. 본문 상단에 Accordions / TiltedContent 이미지박스 출력선택 - mwea.html 와 ...
    • 2019.04.04
    • Mh LeftMenu 레이아웃 V1.2
    • [특징] - Sub메뉴를 좌측 Wing영역에 배치하여 Sub메뉴의 활용도를 높였습니다. - 최대한으로 코...
    • 2019.01.07
    • MH FullPage 레이아웃 V1.2
    • 마우스 휠 한번 작동시 전체 화면 스크롤되는 FullPage 레이아웃입니다. [Tip] 페이지에 Youtube...
    • 2018.12.04
    • MH Pointy Slider 레이아웃
    • MH_Pointy-Slider 레이아웃을 공개합니다. 소스는 아래에서 제공 받아서 XE에서 작동하게끔 수정...
    • 2018.10.27
    • MH_Sliding 레이아웃
    • MH_Sliding 레이아웃을 공개합니다. 소스는 아래에서 제공 받아서 XE에서 작동하게끔 수정했습니...
    • 2018.10.20

XE Of MoonHouse

예전 XE시절에 사용하던 "글 상자 작성 Text Box" 에디터 컴포넌트를 약간의 기능을 추가하여 올립니다. XE공식 자료실에서 찾아보니 라이선스가 GPL v2 라 이렇게 올려도 별 문제가 없을 것 같네요. 2009년에 만들어 졌지만 지금 사용해도 괜찮은 기능을 가지고 있습니다. php8 이상에서도 잘 작동되게 수정했습니다. 설치 방법은 간단합니다. 다운받은 파일 압축을 풀어서 textbox폴더를 /modules/editor/components/textbox 에 업로더하고 관리자 설정 에디터에서 항목 체크해 주면 됩니다. 그럼 게시판 글쓰기 항목에 "글 상자 작성" 추가됩니다. 클릭해 보면 아래 처럼 출력됩니다. 그냥 보이는 옵션들 지정하면 됩니다. 제가 추가한 기능이 "빈칸 제거 기능"입니다. 이건 문서를 복사해 오는데 앞줄에 빈칸들이 있을때 앞줄 빈칸들을 제거해 줍니다. <var name="remove_whitespace" type="radio"> <title xml:lang="ko">빈칸 제거 기능</title> <description xml:lang="ko">글의 앞부분의 빈칸을 제거합니다.</description> <options value="N"> <title>제거안함(기본)</title> </options> <options value="Y"> <title>제거</title> </options> </var> <var name="remove_whitespace" type="radio"> <title xml:lang="ko">빈칸 제거 기능</title> <description xml:lang="ko">글의 앞부분의 빈칸을 제거합니다.</description> <options value="N"> <title>제거안함(기본)</title> </options> <options value="Y"> <title>제거</title> </options> </var> 링크 그리고 우측 상단에 "복사하기" 기능 추가했습니다. [ V1.2 ] - 형태를 유지한 체 앞 공백 제거 - 공백이 가장 적은 줄의 공백수 만큼만 모든 줄에 공백 제거 적용 - 검은색 배경색을 위해 "글 색상" 추가했습니다. - 박스 상단 좌측에 제목 입력 가능 [ V1.3 완성본] - 박스안 일부분 색상 지정 가능(span 태그시) - <br /> 테그 적용 - <a> 태그 적용 - <img> 태그 적용 - 복사 버턴 출력 유무 - 제목글 가로폭 초과시 overflow 색상(Gold) - 언어팩 추가
SketchBook5 게시판스킨에서 공지글을 클릭시 본문으로 이동하지 않고 폴딩형태로 아래로 내용이 나오게 하는 방법입니다. 예전에 문하우스 게시판스킨에서는 js파일로 복잡하게 구현했었는데 이제는 <details> 와 <summary>로 간단하게 구현할 수가 있다. 스케치북에서 공지사항 부분을 담당하는 파일이 _notice.html 이다. - 한 줄 공지 형식으로 선택시 <table class="bd_lst bd_tb_lst bd_tb common_notice"> <tr loop="$notice_list=>$no,$document" class="notice"> <td cond="$list_config['no']">{$lang->notice}</td> <td class="title"><a href="{getUrl('document_srl',$document->document_srl, 'listStyle', $listStyle, 'cpage','')}"><strong>{$document->getTitle($mi->subject_cut_size)}</strong></a></td> <td cond="$list_config['nick_name']"><a href="#popup_menu_area" class="member_{$document->get('member_srl')}" onclick="return false">{$document->getNickName()}</a></td> <td cond="$list_config['regdate']">{$document->getRegdate('Y.m.d')}</td> <td cond="$list_config['last_update']">{getTimeGap($document->get('last_update'), "y.m.d")}</td> </tr> </table> getTitle($mi->subject_cut_size)} 이 부분이 공지글 부분이다. 그럼 이 부분을 폴딩 처리하겠습니다. skin.xml 파일에 선택 추가 <var name="notice_view_slide" type="radio"> <title xml:lang="ko">공지사항 슬라이드 출력</title> <options value=""> <title xml:lang="ko">일반출력(기본)</title> </options> <options value="Y"> <title xml:lang="ko">슬라이드출력</title> </options> <description xml:lang="ko">공지사항 클릭시 슬라이드 형식 출력을 선택합니다.</description> </var> _notice.html 수정 <table class="bd_lst bd_tb_lst bd_tb common_notice"> <tr loop="$notice_list=>$no,$document" class="notice"> <td $list_config['no']">{$lang->notice}</td> <td class="title"> <!--// 공지사항 일반 출력 --> <a cond="$mi->notice_view_slide ==''" href="{getUrl('document_srl',$document->document_srl, 'listStyle', $listStyle, 'cpage','')}"><strong>{$document->getTitle($mi->subject_cut_size)}</strong></a> <!--// 공지사항 슬라이드 출력 --> <details cond="!$mi->notice_view_slide ==''" class="accordion"> <summary class="notice_fold"> <strong>{$document->getTitle($mi->subject_cut_size)}</strong> </summary> <p style="margin-top:10px"> <span>{$document->getContent(false)}</span> <div style="text-align:right; float:left; padding-bottom:5px; width:100%"> <div style="float:right"> <a href="{getUrl('document_srl',$document->document_srl, 'listStyle', $listStyle, 'cpage','')}" class="btn"><span>공지글 보기</span></a> <!--@if($grant->write_comment && $oDocument->isEnableComment() )--> <a href="{getUrl('act','dispBoardWriteComment','document_srl',$document->document_srl)}" class="btn"><span>{$lang->cmd_comment_registration}</span></a> <!--@end--> <!--@if($document->isEditable())--> <!--@if(!( !$grant->manager && $document->getCommentCount()))--> <a href="{getUrl('act','dispBoardWrite','document_srl',$document->document_srl,'comment_srl','')}" class="btn"><span>{$lang->cmd_modify}</span></a> <!--@end--> <!--@if(!( !$grant->manager && $oDocument->getCommentCount()))--> <a href="{getUrl('act','dispBoardDelete','document_srl',$document->document_srl,'comment_srl','')}" class="btn"><span>{$lang->cmd_delete}</span></a> <!--@end--> <!--@end--> </div> </div> <style> summary.notice_fold::-webkit-details-marker { display: none; } summary.notice_fold { display: block; } summary.notice_fold { position: relative; padding-left: 1.2em; cursor: pointer; } summary.notice_fold::before { content: ""; position: absolute; border-top: 0.5em solid transparent; border-bottom: 0.5em solid transparent; border-left: 0.75em solid yellowgreen; top: 0.2em; left: 0; transition: .25s transform; } details[open] summary:before { transform: rotateZ(90deg); } </style> </details> </td> <td cond="$list_config['nick_name']"><a href="#popup_menu_area" class="member_{$document->get('member_srl')}" onclick="return false">{$document->getNickName()}</a></td> <td cond="$list_config['regdate']">{$document->getRegdate('Y.m.d')}</td> <td cond="$list_config['last_update']">{getTimeGap($document->get('last_update'), "y.m.d")}</td> </tr> </table> <script cond="!$mi->notice_view_slide ==''" > <!--// 한개의 공지내용만 Open --> const detailsList = document.querySelectorAll('.accordion'); for (const details of detailsList) { details.addEventListener('click', () => { if (details.open) { // 현재 열려 있는 details가 아닌 다른 details를 찾아 닫습니다. for (const otherDetails of detailsList) { if (otherDetails !== details && otherDetails.open) { otherDetails.open = false; } } // 화면 최상단으로 스크롤 // window.scrollTo({ top: 0, behavior: 'smooth' }); // 현재 열려 있는 details의 상단 위치를 계산합니다. const detailsTop = details.getBoundingClientRect().top; // 스크롤 위치를 details 상단에서 30px 위로 이동합니다. window.scrollTo({ top: detailsTop - 30, behavior: 'smooth', }); } }); } <!--// 내용글 Open시 슬라이딩 효과 --> const $_details = $(".accordion"); const $_summary = $_details.find(".notice_fold"); $_summary.on("click", function(e) { e.preventDefault(); const $_this = $(this); const $_this_details = $_this.parent("details"); const $_this_details_p = $_this_details.find("p"); const $_this_details_open = $_this_details.attr("open"); if (! $_this_details_open) { $_this_details.prop("open", true); $_this_details_p.stop().slideDown(1000); } else { $_this_details_p.stop().slideUp(500, function() { $_this_details.prop("open", false); }); } }); </script> css와 script는 예제로 만들어 본 것입니다. 참조하시면 됩니다.

Xe Total

게시판 Category 제목 글쓴이 날짜 조회수
문하우스 SketchBook5 게시판스킨에 특정 확장변수(price)에 천 단위 쉼표(number_format) 적용하기 file 팔공산 2024.06.24 998
위젯 모듈형 webzine 스크롤 출력 - MH 모듈별 최근글 스킨 추가 file 팔공산 2024.05.29 1,316
문하우스 5 라이믹스 2.1.15 버전에서 "메뉴 아이콘" 사용방법 file 팔공산 2024.05.23 1,259
html 6 접기, 펼치기 folding기능 - <details> 와 <summary>로 간단하게 구현하기 file 팔공산 2024.05.23 33,298
css 스크롤 바(Scrollbar) 스타일링 file 팔공산 2024.05.13 728
문하우스 네이버 나눔스퀘어 네오 NanumSquareNeo 웹 폰트 적용하기 file 팔공산 2024.05.02 17,775
문하우스 2 OrangeDay 테마중 레이아웃 / 게시판스킨 - 문하우스 수정 V2.0 (25. 01. 11) file 팔공산 2024.04.30 884
스킨 OrangeDay 테마 (레이아웃, 게시판 스킨, 멤버 기타) file 팔공산 2024.04.30 662
문하우스 위젯에 확장변수 이용하여 시작날짜 ~ 종료날짜 출력하기 file 팔공산 2024.04.13 990
문하우스 SketchBook5 게시판 스킨 Tag 버그 수정 file 팔공산 2024.04.10 1,908