equeer_layout_scr.png

 

유료 버전 출시!

 

이퀴어 레이아웃의 유료 버전이 드디어 출시되었습니다! 레이아웃과 전용 콘텐츠 위젯 스킨을 포함하여 2만원부터 판매시작합니다. 출시 기념으로 equeer 1.x.x 버전은 무료로 전환되었습니다. 업그레이드된 레이아웃을 원하신다면 먼저 구매 정보를 확인해보세요!

 

유료버전 구매하기 유료버전 미리보기

 

 

 


 

 

 

 

제작자의 말

 

UI/UX 전공이지만 편집 프로그램만 다룰 줄 알았고, 직접 코드로 무언가를 만들어 본 적이 없었습니다. 작은 커뮤니티를 운영하게 되면서 만들게 된 자작 레이아웃을 기반으로 제 첫 작품을 공개합니다. 생활코딩으로 가볍게 배운 실력인지라 가독성을 높이고, 재사용성을 극대화하는 코딩에 대해 이해도가 부족합니다. 이점 양해해주세요.

 

레이아웃 소개

equeer layout ver.1.4.5 Updated!

 

 

커뮤니티 레이아웃을 기반으로 만들어졌기에 회원 가입을 받는 사이트에 적합합니다. 레이아웃 본연의 기능에 충실하고 필수 불가결한 요소들만을 남겨 여기에 적절한 색 조정과 애니메이션으로 멋을 냈습니다.

 

자바 스크립트를 최대한 지양하고 CSS3를 활용하여 사용자의 행동에 최대한 반응하는 UX를 구현했습니다. 마우스를 가져다대고, 누르는 과정에서 빛과 그림자, 모양이 동적으로 변합니다. 플랫한 디자인의 요소에 동적인 애니메이션을 활용하여 무게감, 입체감을 만들고 디자인에 생동감을 부여합니다.

 

btn.gif search.gif gnb.gif usermenu.gif

 

 

업데이트 내역

V.1.4.5 (2017-07-22)

  • 로고를 텍스트로 사용할 경우 로그인 팝업 내 로고도 텍스트로 변경됩니다.

V.1.4.4 (2017-07-21)

  • 본문의 가로폭을 넓히고 서브 메뉴의 가로폭을 줄였습니다.
  • 서브 메뉴 - 위젯 타이틀 URL을 입력해야만 타이틀에 MORE가 뜨도록 수정되었습니다.
  • 모바일에서 일부 패딩값이 개선되었습니다. (가로폭 100%)
  • 서브 메뉴에서 배너를 수정하지 않을 시 나타나는 배너 이미지가 변경되었습니다. 또한 서브 메뉴 배너의 기본 URL이 http://calvinsnax.xyz로 연결되도록 변경되었습니다.
  • layout.html 파일 내 쓸떼없는 태그를 제거했습니다. (DOCTYPE, html, head, body 등)

V.1.3.4 (2017-07-20)

  • 서브 메뉴 위젯 타이틀의 디자인이 개선되었습니다.
  • 모바일에서 상하 패딩값이 개선되었습니다.
  • 모바일에서 헤더 부분이 지원할 수 있는 가로폭이 소폭 늘어났습니다.
  • 모바일에서 네비게이션 드로어(서브 메뉴)와 유저 메뉴가 분리되었습니다. 이제 헤더 부분의 프로필 이미지를 누르면 유저 메뉴가 '팝오버'됩니다.
  • 모바일에서 네비게이션 드로어의 패딩값이 개선되었습니다.
  • 모바일에서 로그인 화면 내 "로그인 상태 표시 / 비밀번호를 잊어버리셨나요?" 문구가 가로폭이 너무 작을 시 겹치는 문제에 대해 문구를 두 줄로 변경하면서 해결되었습니다.
  • 모바일에서 로그인화면 내 회원가입 텍스트가 보이지 않는 문제 해결.
  • Samsung Pass 사용 시 로그인 후에도 Samsung Pass 인증이 뜨는 오류 해결.

V.1.2.3 (2017-07-20)

  • 사용자 메뉴에서 레이아웃 수정 메뉴 추가 (유경수님 의견 감사합니다.)
  • 모바일 화면에서 로고가 텍스트일 경우 밑으로 내려가는 문제 해결

V.1.2.2 (2017-07-20)

  • 반응형 모바일 지원
    (모바일 뷰 사용 안함 체크 또는 m.layouts에 넣어 사용. XE의 경우 모바일 레이아웃 설정에서 'PC와 동일한 반응형 레이아웃 사용'으로 변경)
  • 이제 서브 메뉴 최상단 및 최하단에 원하는 HTML 태그를 삽입할 수 있습니다.
  • 서브 메뉴에서 위젯 사용 여부를 설정할 수 있습니다. 또한 위젯 타이틀 링크를 수정할 수 있습니다.

V.1.1.2 (2017-07-19)

  • 서브 메뉴에서 배너 사용 여부 설정에서 사용안함을 체크해도 배너가 표시되던 문제 해결

V.1.1.1 (2017-07-19)

  • 새로운 버전명 규칙 적용 (대규모 업데이트 > 기능 추가 > 버그픽스 순서)
  • 메인 비주얼 표시 여부 설정 기능 추가
  • 메인 비주얼 배경 컬러 직접 설정 및 그라데이션/단색 설정 기능 추가
  • 메인 비주얼 이미지 등록 설명에 "(배경이 투명한 png 파일 추천)" 문구 추가
  • 메인 비주얼 이미지 사이즈 맞춤 선택 기능 추가 (원본크기, 맞춤, 채우기)
  • 서브 메뉴에서 배너 사용 여부 설정 가능 (사용함 기본값)
  • 포인트 위젯 표시안함 체크 시에도 포인트 위젯이 표시되는 버그 수정

V.1.0 (2017-07-16)

  • equeer layout 1.0 첫 배포

 

설치 방법

  1. 첨부 파일의 압축을 풀어주세요.
  2. equeer_layout 폴더를 ./layouts/equeer_layout 이 경로로 넣어주세요.
  3. 레이아웃 설정에서 공지사항 srl 및 서브 메뉴 위젯을 설정하여 본인의 입맛대로 커스터마이징하세요.
    ※ 공지사항 srl은 게시판 모듈의 고유번호를 뜻합니다. [관리자 > 게시판] 페이지에서 아래 이미지와 같은 곳에 마우스를 가져다대면 하이퍼링크에 module_srl 을 알 수 있습니다.

    srl.png

    srl_2.png

사용자 팝업 메뉴에서 포인트 위젯을 사용하기 위해서는 다음 과정 진행하세요.

  1. XE 자료실에서 포인트 현황 위젯을 다운받아 설치해주세요. (https://xe1.xpressengine.com/index.php?mid=download&package_id=18324347)
  2. equeer_point 폴더를 ./widget/point_status/skins/equeer_point 이 경로로 넣어주세요.

 

라이센스

레이아웃에 동봉된 이미지는 자체 브랜드 및 작가 Calvin Snax의 Artworks로 레이아웃 자체의 라이센스와 무관하게 Calvin Snax가 디자인 소유권을 가지고 있으며, 무단 사용 적발시 법적 책임을 물을 수 있습니다. 사이트 적용 시 꼭 수정하셔서 사용하시기 바랍니다.

(이미지를 마음대로 수정해서 쓰시라는 말이 아닙니다. 이미지 사용하지 마시라는 뜻입니다.)

snax

profile
안녕하세요! Digital Product Designer, Calvin Snax입니다.
제 작업물을 확인해보시거나 작업을 의뢰하고 싶으신 분들은 제 사이트를 방문해주세요.
https://calvinsnax.com

XE & Rhymix 제작 자료
#HASHTAG 레이아웃: https://calvinsnax.com/hashtag
Alice 게시판 스킨: https://calvinsnax.com/alice
Slow 테마 패키지: https://calvinsnax.com/slow
coronach 레이아웃: https://calvinsnax.com/coronach
equeer 레이아웃: https://calvinsnax.com/equeer
eden 게시판 스킨: https://calvinsnax.com/eden
  • profile

    .

  • profile profile
    구매해주셔서 감사합니다^^
  • ?
    정말... 좋은레이아웃입니다.. 감사합니다!!
  • ? profile
    마음에 드셨으면 좋겠습니다. 감사합니다!
  • ?
    메인 비주얼 이미지 사이즈가 어떻게 되나요?
  • ? profile
    가로 1080px / 세로 416px입니다.
    메인 비주얼 커스텀 팁 조금 드리자면,
    equeer.css 문서에서 .main-visual-wrap 클래스에 background: linear-gradient(135deg,#62c6ac,#75ffcc); 이 부분은 배경 색상입니다. 왼쪽 아래에서 오른쪽 위로 그어지는 그라데이션이며, 첫번째 색이 시작지점, 두번째 색이 마지막 지점의 색상입니다.

    등록하신 이미지가 꽉 채워지길 희망하신다면 .main-visual 클래스에 background-size: cover; 이 스타일을 지정해주세요. 메인 비주얼 전체에 꽉 채워집니다.
  • ?
    3차메뉴가 지원 안되는게 매우 아쉽군요 ㅠㅠ
  • ? profile
    GNB에 3뎁스를 적용하면 가독성이 떨어지기 때문에 지양하는 편입니다. 모바일의 태동기였던 2010년 이후부터 메뉴의 간소화가 중요시되었습니다.
  • ?
    와... 유료 레이아웃같은 레이아웃을 포인트로 받을수 있을줄이야... 감사합니다. ㅎ
  • ? profile
    감사합니다ㅎㅎ
  • profile ?
    메인 이미지 삭제는 못하나요?
  • ? profile
    메인 비주얼 부분 말씀하시는 건가요? 통째로 없애고 싶으시면 레이아웃 폴더 내 layout.html 파일에서 아래 부분을 삭제해주시면 됩니다.

    <!--@if($_is_indexmodule)-->
    <div class="main-visual-wrap">
    {@ $_main_visual_img = $layout_info->main_visual_bg}
    <div class="main-visual" style="background: url('{$_main_visual_img}') no-repeat center center"|cond="$_main_visual_img">
    <div class="row">
    <h1>
    <!--@if($layout_info->main_visual_text)-->
    {$layout_info->main_visual_text}
    <!--@else-->
    Hello, equeer.
    <!--@end-->
    </h1>
    <a class="btn_secondary_round" href="<!--@if($layout_info->main_visual_btn1_url)-->{$layout_info->main_visual_btn1_url}<!--@else-->{getUrl('')}<!--@end-->">
    <span>
    <!--@if($layout_info->main_visual_btn1_text)-->
    {$layout_info->main_visual_btn1_text}
    <!--@else-->
    LEARN MORE
    <!--@end-->
    </span>
    </a>
    <a class="btn_white_roundLine" href="<!--@if($layout_info->main_visual_btn2_url)-->{$layout_info->main_visual_btn2_url}<!--@else-->{getUrl('')}<!--@end-->">
    <span>
    <!--@if($layout_info->main_visual_btn2_text)-->
    {$layout_info->main_visual_btn2_text}
    <!--@else-->
    HOW TO USE
    <!--@end-->
    </span>
    </a>
    </div>
    </div>
    </div>
    <!--@end-->
  • ?
    ♥♥♥♥♥♥♥♥♥♥
    하 대박이에요
  • ? profile
    대박 감사합니다!ㅎㅋㅋ
  • ?
    감사합니다 !1
  • ? profile
    감사합니다!
  • profile
    감사합니다!
  • profile profile
    네 저도 감사합니다ㅎㅎ
  • profile
    정말 좋은 레이아웃 .. 감사합니다. ^^
  • profile profile
    감사합니다ㅎㅎ
  • profile
    좋은 레이아웃 감사합니다.
    기회가 있으시면 메인메뉴 3차메뉴기능도 부탁드립니다.
  • profile profile
    아쉽지만 3차 메뉴는 추후에도 지원할 예정이 없습니다. 아마 LNB 쪽에 3차 메뉴 지원을 고려하게 될 것 같습니다.
  • ?
    제가 쓰는 게시판 모듈이랑 어울려요! 감사합니다! 그런데 이 레이아웃 반응형이 맞....지요? 왜 모바일로 접속하면 저는 피시버전으로 잘려서 뜰까요ㅜㅜ.......
  • ? profile
    아쉽지만 본 레이아웃은 반응형이 아닙니다. 원본 사이트에서 사용하는 레이아웃은 다른 분 레이아웃을 조금 수정한 정도라... 추후에 모바일 레이아웃을 만들거나 반응형으로 제작하면 유료로 풀게 될 것 같습니다.
  • profile
    우와 짱입니다.
    세상에나 생활코딩으로 이렇게 만드시다니 훌륭합니다.
  • profile profile
    HTML이나 CSS에 대한 이해가 쉽게 되도록 잘 정리되어 있어서 편하게 배울 수 있었어요ㅎㅎ
  • profile
    멋지고 훌륭합니다. 저도 열공해볼께요...^^
  • profile profile
    감사합니다. 화이팅하세요!
  • ?
    수고하셨어요
  • profile
    정말 대박입니다...감사합니다
  • profile profile
    감사합니다ㅎㅎ
  • profile
    와..멋진 레이아웃 감사드립니다
  • profile profile
    감사합니다!
  • profile
    이건....유료였다고 해도 샀을 것 같네요.
  • profile profile
    허걱.. 어서 유료 버전을 만들어야겠군요ㅋㅋㅋ
  • ?
    감사합니다, 서브에 위젯쪽에 뭘 안적으면 최근게시글 최근댓글이 보이는거군요.
    회원 프로필에 마우스 올렸을때도 최근게시글 최근댓글이... 이건 안나오게 못하나요..?
  • ? profile
    말씀하시는 회원 프로필이 헤더 부분에 있는 사용자 아이콘이 맞나요? 팝오버는 헤더에 속해있어 헤더와 동일하게 z-index가 100입니다.
    혹 최근 게시글/최근 댓글 및 위젯 등이 회원 메뉴 위에 뜨은 현상이시라면 사용하고 계신 브라우저 환경을 말씀해주세요.
    개발은 Chrome 최신버전으로 진행하였으며, Opera에서 타 브라우저 호환 테스트를 진행했습니다.
    대표적인 크롬, 오페라, 파이어폭스, 사파리를 제외한 브라우저는 부득이하게도 지원하지 않으니 이점 참고 바랍니다.
  • ?
    감솨합니다.
  • ? profile
    감사합니다ㅎㅎ
  • profile
    포인트 올인했습니다 ㅎㅎ
  • profile profile
    감사합니다!ㅎㅎ
  • ?
    감사합니다. 그런데 로고 영역 폭이 좀 좁은데요 늘릴수 있는 방법을 알려주세요
  • ? profile
    레이아웃 폴더 내 equeer.css 문서에서
    .header .float-lef t> h1.logo-item div {
    아래에
    width:100px
    부분 수정해 주시면 됩니다. 추후에 레이아웃 설정에서도 이 부분 수정할 수 있도록 하겠습니다.
  • profile ?
    감사합니다.
  • profile
    정말 멋지고 가벼운 이런 레이아웃을 무료로 배포하시다니.. 너무 감사할 따름입니다. 잘 쓰겠습니다. ㅠㅠ7
  • profile profile
    요긴하게 쓰시길 바랄께요ㅎㅎ
  • ?
    http://calvinsnax.xyz/layouts/equeer_layout/img/subnav_banner_img.png 이게 안나오게 할수는 없을까요? 설정할때만 나오게요.
  • ? profile
    서브 메뉴에서 배너 표시 여부 설정 기능이 추가되었습니다.
    버그 픽스까지 된 equeer V1.1.2.zip 받아서 덮어씌워주세요.
  • profile ?
    앗 그렇군요. 감사합니다
  • ?
    와... 정말 감사합니다! 잘쓰겠습니다 :)
  • profile
    오류 확인좀 부탁합니다.
    메인에서 서브 메뉴 표시 여부에서 표시함에서 "표시안함(기본값)"으로 선택 해도 서브메뉴로 있어서요 메인으로 변경이 안되는것 같습니다. 확인요청합니다.


    로그인 정보안에 레이아웃 수정 버튼을 추가 해주시면 어떨까요 .(다음 업데이트시 의견)
    소스
    <li cond="$grant->manager"><a href="{getUrl('','module','admin','act','dispLayoutAdminModify','layout_srl',$layout_info->layout_srl)}" onclick="window.open(this.href);return false;"><i class="fa fa-pencil"> </i>LayoutEdit</a></li>
  • profile profile
    1.1.2 버전에서 해당 오류 해결되었습니다. 적용 이후에도 계속 같은 증상이 나타나신다면, 레이아웃 설정에서 레이아웃 삭제 후(레이아웃 초기화) 다시 시도해주세요!

    레이아웃 수정 버튼 참고하겠습니다.
  • ?
    와 정말 깔끔하고 좋습니다
  • ?
    반응형에서 가로폭 좁아질때 왼쪽 상단에 메뉴 아이콘 나타나면서 기존의 메뉴들이 로고 바로 아래쪽으로 붙는데 실제로 사용해보니 불편해요 아예 로고 밑에 메뉴를 좁은 폭에서는 없애는게 좋을 것 같아요. 드롭다운메뉴도 안나타나서 오히려 이용자들이 헷갈릴것 같아요.
    저는 다음과 같이 스타일 줘서 없앴습니다..
    @media only screen and (max-width: 767px) {
    .gnb-wrapper {display: none;}
    header, .header, .header .float-left {height: 60px !important;}
    }
  • ? profile
    반응형 디자인은 모바일에 특화되어 있습니다. 더 나아가 멀티 플랫폼을 위해서 존재하는 기술입니다.
    PC 환경(마우스를 사용하는)에서의 사용을 염두하고 제작하는 것이 아니라 스마트폰, 태블릿 등의 터치 방식 멀티 플랫폼을 지원하기 위해 만들어진 것입니다.
    가로폭이 좁아질 때 전체적인 디자인이 안드로이드 Material Design과 흡사한 형태로 변화하는데요. 이것은 모바일 유저(터치를 사용하는)의 환경에 맞춰 UX가 변화한 것입니다.
    되려 모바일 유저에게 팝오버 메뉴를 지원하게되면 호버의 개념이 오브젝트의 반응 정도로만 사용되고 직접적인 인터랙션으로 잘 이어지지 않는 모바일 환경에서는 되려 혼란과 불편을 초래할 수 있습니다.

    그리고 궁극적으로, 가로폭이 768px 이하로 내려갈 경우 메뉴의 개수가 해당 폭을 지원하기 어려워집니다.
  • profile
    역시 훌륭합니다. 멋지네요.. 반응형도..

    한가지 확인하시면 좋을 것 같습니다.
    가로폭 440px 이하에서는 로그인 단추가 나타나질 않네요.. ^^;;
    아무래도 사이트 제목 등과 겹치는 부분 때문에 설정하신 것 같은데..
    아니면 사이드 메뉴 쪽에라도 로그인 메뉴를 추가해 주시는 게 어떠실런지요..
  • profile profile
    사이드 메뉴에 로그인 메뉴 추가해보겠습니다.

    그리고 가로폭 440px이면 스마트폰 가로폭보다 훨씬 큰 편입니다. 로고 가로폭이 어느정도 이신가요?
    로고의 가로폭이 비정상적(140px 이상)으로 길 경우에만 로그인 버튼과 검색 버튼이 사라집니다.
    사용하신 브라우저(모바일 환경의 경우 OS와 브라우저 어플명)와 적용하신 사이트 주소 알려주시면 보다 정확하게 확인 가능합니다.
  • profile profile
    그렇군요.. 로고 가로 사이즈 때문이네요
    제 경우에는 이미지 로고가 아니라 텍스트로 되어 있어서요..
    http://undergo.kr 참고하시면 좋을 것 같습니다.

    사용환경
    노트5,
    삼성 브라우저, 크롬
    OS 누가

    그리고 말씀 드린 김에..
    요즘 삼성 스마트폰에서는 Galaxy Pass 라는 기능을 이용해 지문으로 자동 로그인하는데요..

    위 사이트 역시 자동 로그인하도록 설정했습니다.
    이전 레이아웃에서는 로그인되어 있으면 아무런 반응이 없고,
    비로그인 상태에서만 지문 로그인 하라는 창이 떴는데요.
    현재 레이아웃에서는 로그인, 비로그인 상태 관계없이 Galaxy Pass 지문 로그인 창이 뜹니다.
    할 수 없이 Galaxy Pass 설정에서 해당 사이트를 제외(삭제)하고 사용 중입니다.
    다른 레이아웃으로 바꾸면 정상 작동합니다.

    감사합니다.
  • profile profile
    최신버전(1.3.4) 나왔습니다. 적용해주세요.
    어느정도 큰 로고 사이즈에서도 대응할 수 있도록 지원 가로폭을 소폭 상향하였습니다. Samsung Pass 관련 이슈해결했습니다. 적용해보시고 확인 부탁드려요.
  • profile profile
    와우 감사합니다. ^^
  • ?
    본문 너비를 조절할려고 합니다. 위치좀 알려주시면 감사하겠습니다.
  • ? ?
    equeer.css 에서 268 라인

    .content-wrap {
    float: left;
    width: 70%;
    padding: 40px 15px 30px 0;
    }

    저기서 width: 70%; 이것으로 수정해보세요
  • ? profile
    사이트 전체 너비는 다음의 코드를
    @media (min-width: 768px) {
    .container-fluid {
    width: 1140px;
    padding: 0 30px;
    margin: 0 auto;
    }
    }

    서브 페이지의 본문의 경우 다음 코드 두 개를 수정해주세요. content-wrap과 subnav-wrap의 width는 두 값의 합이 100%가 되도록 해야합니다.
    .content-wrap {
    float: left;
    width: 70%;
    padding: 40px 15px 30px 0;
    }

    .subnav-wrap {
    float: right;
    width: 30%;
    padding: 40px 0 30px 15px;
    }
  • ? ?
    감사합니다 구미호님
  • profile ?
    감사합니다.
  • profile
    우와 끝내준다..!
    지원이 계속되는게 감동스럽습니다. 잘 사용하겠습니다. 멋쟁이~!!
  • profile
    정말 훌륭한 레이아웃입니다만 몇가지 개선점이 보여 건의드립니다.

    1. layout.html 파일에는 doctype, html 및 body태그가 있어서는 안됩니다. doctype, html 태그 및 body 태그는 XE에서 생성합니다.
    2. (필수 아님) meta 태그중 인코딩 태그는 XE에서 이미 삽입하고 있으므로 레이아웃에 정의될 필요 없는 부분이며 이외 meta태그는 {@ Context::addHtmlHeader('<meta name="viewport" content="width=device-width, user-scalable=no">'); } 처럼 XE함수로 추가해 주시는 것이 좋습니다.(하지 않으셔도 XE에서 알아서 head로 이동시키긴 합니다)
    3. fontawesome 아이콘을 메뉴에 사용할땐 fa-fw 클래스를 붙여주세요. 아이콘 너비가 일정하게 세팅되며 글자 위치가 들쭉날쭉한 현상을 수정할 수 있습니다. 수정전 https://puu.sh/wOoXs/2f0000d77a.png 수정후 https://puu.sh/wOoPn/e93871c85f.png
  • profile profile
    저런 함수가 있는 줄은 처음 알았네요! 팁 감사합니다ㅎㅎ
    fa-fw 클래스 진작 알았으면 좀 더 작업이 편했을텐데 쓸뗴없이 패딩값에 시간 낭비를 했네요ㅠㅠ
  • ?
    서브 메뉴 위젯 타이틀의 디자인이 개선되었습니다. 이 부분에서요.. more 나오지 않게 할수 있을까요? 최근 글 과 최근댓글로 사용하고 있거든요,. 업데이트 감사드립니다.
  • ? profile
    위젯 타이틀 URL을 입력하지 않으면 MORE가 뜨지 않도록 변경되었습니다.
  • profile
    계속 업데이트되고 있군요! 멋있는 레이아웃에 멋있는 제작자십니다!!
  • profile
    최근글 최근 댓글 위젯에서 지정된 게시판만 불러오도록 모듈 srl 값을 선택했으면 좋겠습니다.
  • profile profile
    따로 위젯을 제작한 것이 아니기도 하고, 확장성을 위해서 직접 위젯 태그를 삽입하는 형태로 제작되었습니다. 기본적으로 설정된 위젯은 테스트 용도로 삽입된 코드입니다. 위젯 태그 생성은 관리자 > 설치된 위젯에서 원하시는 위젯 선택하셔서 코드생성하시면 됩니다.
  • profile profile
    저야 위젯을 추가할 수도, 따로 레이아웃 파일을 수정해서 srl변수를 따로 넣어 수정할 수도 있습니다.

    하지만 제가 수정해서 마이너하게 사용하는것보다 기왕에 레이아웃에 최근글과 최신댓글 위젯이 달려있는 상태이니, 거기에 좀 더 사용자 편의성을 높히는 것이 좋을 것 같습니다.
    수정도 빠르게 반영해주시고, 개선도 매우 활발히 진행되어서 저도 사용자의 입장에서 약간 아이디어를 말씀드린겁니다. srl 목록을 변수로 만들어버리고 위젯 img 태그 안에 변수명을 넣어버리면 원하는 srl에서 불러오기가 가능할 것 같고, 다른 사용자들도 편하게 사용할 수 있을 것 같습니다.

    물론, 저도 매번 업데이트 할 때마다 수정하는게 아니라 아예 패치가 되면 더 좋을 것 같습니다.
    매우 감사하게 사용중입니다!!
  • ?
    사실 XE에서 무료 레이아웃을 이렇게 바로 바로 업데이트 해주시는것은 대단 하신겁니다
    제작자님 감사 합니다 ^^
  • profile
    잘쓰겠습니다~
  • profile
    워후, 다운 잘 받아갑니다 :)
  • ?
    정말 감사합니다. 너무나 깔끔하고 예쁜 레이아웃입니다. 잘 사용하겠습니다.
  • profile
    우왕... 메뉴 튀어나오는거 너무 이쁘당... ^^;;;;;
  • profile
    레이아웃과는 관계없는 질문이라 죄송합니다만...http://calvinsnax.xyz/board_aLBc07
    위 게시판은 어느 스킨을 사용하셨나요? injin 이라는 키워드로는 전혀 나오질 않아서...
  • profile profile
    XEmarket에서 판매 중인 Material XE 패키지 내에 포함된 모바일 스킨입니다.
  • ?
    완전 최고!!
  • ?
    감사합니다 잘쓰겠습니다!
  • profile
    안녕하세요. 혹시 이 레이아웃을 미디어위키용 스킨으로 제작해 사용해도 괜찮을까요..? 조심스럽게 여쭤봅니다...
  • profile profile
    해당 스킨의 라이센스는 재배포 금지입니다. 이점 숙지하시고 레이아웃을 커스텀하여 본인이 사용하시는 것이라면 괜찮습니다.
  • profile profile
    앗 감사합니다~
  • ?
    정말 깔끔한 심쿵하네요~!
  • profile
    감사합니다!
  • ?
    감사합니다. 잘쓸께요~
  • profile

    .

  • profile profile
    웹 표준과 트렌드를 지키는 사이트에 맞추어 디자인되어 있습니다. 이제는 대부분 사용하지 않는 아이디 로그인은 지원하지 않습니다. 정 수정하고 싶으시다면, 레이아웃 파일 내 login.html 파일을 참조하시기 바랍니다.

    정상적으로 설치하셨다면 서브 메뉴 - 위젯 2 사용 여부에서 사용 안함을 체크할 시 최근 댓글이 출력되지 않습니다. 관리자 페이지에서 레이아웃 삭제 후 재설정을 시도해보시거나 파일 버전 확인해주세요.

    위젯은 데모의 형태로 적용되어 있고, 확장성을 위해 원하는 위젯 코드를 추가하여 사용합니다. 위젯 내용에 원하는 위젯의 코드를 삽입하세요. 위젯 코드 생성은 관리자 페이지 > 설치된 위젯에서 가능합니다.
  • profile profile

    .

  • profile profile
    layout.html과 usermenu.html 에서 작성 댓글 부분 li 태그를 지워주세요. 에디터로 작성 댓글 검색하시면 됩니다.
  • profile profile

    .

  • profile profile
    해당 오류는 레이아웃의 문제가 아니라 회원 모듈 스킨(스케치북5 멤버 스킨)에 작성 댓글 디자인이 없어서 발생한 오류입니다.

    해당 레이아웃은 메뉴별 아이콘 적용을 위해 수기로 메뉴가 적용되어 있습니다. 따라서 회원 모듈에서 사용하지 않음을 체크하셔도 레이아웃 내에 메뉴는 사라지지 않습니다. 이전에 설명드린대로 layout.html와 usermenu.html 에서 원치않는 항목을 지워주시기 바랍니다. '작성 댓글' 이라고 써진 부분만 지우는 것이 아니라 해당 <li> 태그 전체를 지우셔야 합니다.
  • ?
    서브페이지에서 위젯영역을 나오게 않게 할때., 서브페이지가 전체페이지로 나오게 할수 없을까요? 혹은 전체페이지로 기능이 있으면 좋겠습니다.
    https://www.han.gl/font 에서 라이센스표기를 해야 하는데 좁아서 그렇습니다..
  • ? profile
    현재는 사이트 메인과 그 외 서브 메뉴를 자동으로 인식하도록 제작되어 있습니다. 추후에 이 부분도 커스텀 가능하도록 할 예정입니다.

    P.S. 서브 메뉴 위젯에서 CalvinSnax 디자인으로 배너(subnav_banner_img.png)를 만드셨는데 해당 디자인은 CalvinSnax(http://calvinsnax.xyz) 의 저작물로 디자인 수정이 불가능합니다.
    레이아웃 설명 하단에 라이센스 항목 참조해 주세요.
  • profile ?
    네 수정했습니다.
  • profile
    예뻐요~^^
  • profile
    핸드폰에서 로그인 버튼이 보이질 않네요.. 확인 부탁드려요
    사이트는
    http://꿈동산.com
    입니다.
  • profile profile
    로고 이미지 가로폭이 너무 커서 버튼이 밀린 겁니다. 권장 크기로 수정해주세요.
  • profile profile
    우왕ㅋ굳ㅋ
    너무 이뻐요!!!!
    잘 사용하겠습니다! 감사합니다!!!! >.<
  • profile
    최근 게시물에서 특정 몇개를 없애고 싶은데 방법을 몰라 헤매고 있습니다.
    게시판의 글이 아니고
    내용 직접올리기를 통해 올려서 그런지
    대표이미지가 적용이 안되고 이미지 내용이 빈 최근 게시물이 생성이 돼어 최근 4개를 빼거나 이미지 적용을 하고 싶어요.
    어떻게 하면 좋을까요? 몇시간째 헤매고 있어요.
    도움 부탁드리겠습니다;;;;;
  • profile profile
    해당 이슈는 콘텐츠 위젯 개발자 분께 문의드리거나, XE 타운 물어보기 메뉴를 통해 질문 부탁드립니다. 최근 게시물 위젯 내용이 없을 경우 데모 위젯이 출력됩니다. 이 위젯은 사이트 내에 식별되는 모든 게시물 리스트를 출력하도록 되어 있습니다.

    레이아웃 폴더 내 subnav.html 파일 안 위젯 코드에 module_srls="출력을 원하는 모듈의 srl" 속성을 추가하시는 방법을 사용할 수도 있습니다만, 직접 위젯을 추가하는 방법을 제일 권장합니다.
  • profile
    이렇게 훌륭한 레이아웃을 무료로 배포해주셔서 너무 감사드립니다.
    더불어 문의를 드리고 싶은게 있습니다.
    쇼셜XE 적용하였는데 카카오와 네이버만 로그인 버튼이 나오는데요.
    저는 5개 소셜사이트를 모두 적용하고 있습니다.
    어떻게 해야 쇼셜로그인 버튼이 나오는 것인지요?
    제가 따로 적용해야할 설정을 놓친게 있는지 아니면 제작자님이 수정을 해주셔야 하는 문제인지 궁금합니다.
  • profile profile
    본래 운영하던 사이트에서 사용하던 레이아웃이었는데 거기에 XE의 함수로 커스터마이징이 가능하도록 구현한 것이거든요. 기능을 적용하면서 디자인을 제작한 것이 아니기 때문에 레이아웃 설정 상에서 커스텀할 수가 없는 부분도 몇가지 존재합니다ㅠㅠ 소셜 로그인 부분처럼요.
    추후에는 좀 더 커스터마이징을 강화한 버전을 배포할 예정입니다. 어쩌면 해당 버전은 유료로 배포될 수도 있습니다.

    따라서 현재로는 해당 부분의 html과 css를 직접 수정해주어야 합니다. 간단한 html/css 수정이 가능하시다면,
    login.html 파일과 equeer.css를 수정해주세요.

    HTML 문서에서는 아래 코드를
    <a class="kk" href="{$oSocialxeModel->snsAuthUrl('kakao', 'login')}">Kakao</a>
    <a class="nb" href="{$oSocialxeModel->snsAuthUrl('naver', 'login')}">Naver</a>

    CSS 문서에서는 아래 코드를
    #loginForm .kk {background:#fedc00; margin-right: 2%}
    #loginForm .nb {background:#1ec800; margin-right:0}
    #loginForm .kk:hover {background: #e4c600}
    #loginForm .nb:hover {background: #1bb100}

    수정해 주시면 됩니다.
    클래스 명 변경해서 쓰셔도 문제없습니다.

    HTML에서는
    대소문자 구분하셔서 snsAuthUrl 안에 kakao, naver, facebook, google 등 원하는 SNS를 쓰시되, 대소문자 구분하셔야 합니다.

    kk와 nb는 각각 카카오와 네이버 로그인 버튼의 색상이며,
    그 아래 kk:hover와 nb:hover는 버튼 위에 마우스를 올렸을 때 변경될 색상입니다.
  • profile profile
    감사합니다. 참고해서 적용하겠습니다. ^^
  • profile
    equeer.css 수정

    #loginForm .tw {background:#0099ff; margin-right: 2%}
    #loginForm .fb {background:#3300cc; margin-right:0}
    #loginForm .gg {background:#ff0033; margin-right: 2%}
    #loginForm .kk {background:#fedc00; margin-right: 0}
    #loginForm .nb {background:#1ec800; margin-right: 2%}
    #loginForm .tw:hover {background: #0066ff}
    #loginForm .fb:hover {background: #330099}
    #loginForm .gg:hover {background: #ff0000}
    #loginForm .kk:hover {background: #e4c600}
    #loginForm .nb:hover {background: #1bb100}


    login.html 수정

    <a class="tw" href="{$oSocialxeModel->snsAuthUrl('twitter', 'login')}">Twitter</a>
    <a class="fb" href="{$oSocialxeModel->snsAuthUrl('facebook', 'login')}">Facebook</a>
    <a class="gg" href="{$oSocialxeModel->snsAuthUrl('google', 'login')}">Google</a>
    <a class="kk" href="{$oSocialxeModel->snsAuthUrl('kakao', 'login')}">Kakao</a>
    <a class="nb" href="{$oSocialxeModel->snsAuthUrl('naver', 'login')}">Naver</a>
  • profile
    만드시느라 고생 많으셨습니다!
  • ?
    너무 깔끔하고 좋아요!
  • ?
    감사합니다
  • ?
    잘쓰겠습니당!
  • profile
    감사합니다.
  • ?
    감사합니다
  • ?
    왓... 이건 XE스킨이 아니라 워드프레스 스킨이예요!
    XE스킨 중엔 싸고 맘에 드는 스킨이 없었는데,
    워드프레스는 기능이 없고.
    진짜 좋은 스킨입니다!
  • profile
    멋진 레이아웃 감사합니다.
  • profile
    너무 이쁘네요 감사합니다!
  • ?
    잘 사용 하겠습니다.
  • ?
    감사합니다.
  • profile
    감사합니다 ^^
  • ?
    안녕하세요! 처음으로 포인트마켓에서 구매해봅니다.
    깨끗하고 좋은 레이아웃이네요. 잘쓸께요
  • profile
    정말감사합니다. 잘쓰겠습니다.
  • profile
    아니 이런 고퀄이 무료라니 ㅠㅠ
  • profile
    진짜이쁘네요
  • ?
    안녕하세요 저는 equeer layout ver.1.4.5" 이것으로 설치 하였지만 서브 메뉴가 안나오네요 ㅠㅠ
  • ? profile
    equeer 레이아웃은 메인 페이지를 자동으로 인식해서 메인 비주얼과 서브 메뉴를 표시할지를 결정합니다. 서브 메뉴가 표시되지 않는 페이지가 메인페이지인지 확인해주시고, 메인페이지일 경우 레이아웃 설정에서 [메인에서 서브 메뉴 표시] 항목을 선택해주세요.
    레이아웃 설치와 설정이 정상적으로 되었는데도 해당 문제가 지속되신다면 사이트 링크와 사용 중인 CMS 버전(예: Rhymix 1.8.45)과 함께 문의해주셔야 원활한 답변이 가능합니다. 그리고 현재 이퀴어 레이아웃은 새로운 버전을 준비 중입니다. 대부분의 문제는 구버전의 XE에서 발생하는 문제이니 참고 바랍니다.
  • profile ?
    혹시 이 레이아웃이 "Rhymix" 전용인가요 ...?
  • ? profile
    css를 사용했기에 굳이 라이믹스 전용은 아닙니다. 오래된 XE 코어에서 지원되지 않는 기능을 레이아웃이 가지고 있을 수도 있기 때문에 가급적 최신 버전의 XE 또는 라이믹스를 권장하는 것입니다.
  • profile
    멋저요~
  • profile
    모바일메뉴 화면에서 위에 동영상처럼 포인트위젯이랑 로그인정보 출력은 어떻게 해야되나요?
  • profile profile
    모바일에서는 PC에서 사용하던 디자인을 그대로 쓰면 너무 공간 낭비가 심해서 이후 패치에서 햄버거 메뉴에 네비게이션 메뉴만 뛰우도록 변경했습니다. 새로운 UX를 구상하여 패치할 예정입니다.
  • ?
    감사합니다.
  • profile
    좋은 레이아웃 잘 쓸께요.
    다만 ㅠㅠ 사이트 전체적인 디자인과도 연관이 될 수 있는 부분은 각자 지정해주셨으면 더 좋았을텐데요..

    * {
    box-sizing: border-box;
    }
    글로벌에서 box-sizing을 잘못 지정하게되면 전체적으로 자체 XE와도 디자인이 틀어지는거랑.. 스케치북 스킨에서 이미지 등의 위치가 틀어지는 문제점이 크게보였었습니다 ㅠㅠ.. 필요한 곳에만 box-sizing 을 지정하도록 하여 디자인 되었으면 더 좋겠습니다 :)
  • profile profile
    어쩐지 그런거였군요. 좋은 팁 감사합니다!ㅎㅎ 이 레이아웃은 아예 코드부터 새로 짜고 있어요. 다시 보니 너무 극혐이라...ㅠㅠ
  • profile
    첫화면 최하단 공지사항에 글을 올리려면 어디서 등록해야하나요?
  • profile profile
    글을 등록하는 게 아니라 공지사항 게시판의 SRL을 등록해주시는 겁니다.
  • profile profile
    넵... 감사합니다!
    해결하였습니당~~ ^^
  • profile
    너무 예쁘네요 ㅠㅠ
  • profile
    너무예뻐요^^
  • profile
    모바일 레이아웃 찾아다니다가 너무 좋은 레이아웃을 발견했네요!
    아! 네이버 브라우저[모바일]에서 알림센터가 상단에 뜨지 않더라고요.(제가 잘못한걸수도 있으니 미리 사죄를..) 구글/파폭/오페라는 잘 나와요!ㅋ 네이버따위 안쓰겠습니다!ㅋㅋ
    레이아웃 쓰게 해주셔서 감사합니다!
  • profile
    그리고 작성댓글 클릭시에 잘못된 요청이라고 뜨네요. pc는 정상으로 표기되는데 모바일 레이아웃으로 쓰면 잘못된 요청이라고 뜹니다ㅠ
  • profile profile
    회원모듈에서 모바일용 스킨이 제대로 적용되었는지 확인해주세요. 회원모듈이 정상적으로 작동되는 한(작성글, 작성댓글 기능 사용 시) 레이아웃상의 문제로는 보여지지 않습니다. 경로 자체가 XE에서 지원하는 함수를 사용하니까요.
  • profile profile
    모바일용 회원 모듈 스킨은 스케치북 모바일 씁니다. 그리고 혹시몰라서 작성댓글 모듈에도 스케치북 스킨을 넣었어요. 혹시 몰라서 푸터메뉴로 작성댓글을 빼놓고 클릭해보면 정상적으로 뜹니다. 햄버거메뉴에 있는 경우에만 잘못된 경로라고 하네요ㅠ 물론 아예 스킨을 다 빼고도 해봤지만 역시나ㅠㅠ 중요한건 pc에선 되더라고요.
    모바일 레이아웃에 따로 넣고 적용한 결과 모바일에선 잘못된 경로라고 뜹니다. 현재는 작성댓글 부분을 아예 뺐습니다ㅠ
  • profile
    모바일 레이아웃으로만 사용할때 아이폰 로그인 지원 안되나요?ㅠ 아이폰 유저들 로그인이 안된다고 합니다. 안드로이드는 잘되고있습니다.
  • profile
    소셜 로그인만 됩니다. 아이폰일 경우.
  • profile profile
    로그인은 레이아웃과 관련이 없는걸로 알고 있습니다.
  • profile
    매우 깔끔합니다
  • profile
    포인트 모으기를 벼르고 있다가 드디어 구매했습니다!
    좋은 자료 올려주셔서 감사합니다 :)
  • ?
    대박입니당.. 잘쓸게요
  • ?
    안녕하세요 이렇게 좋은 자료 배포해주셔서 정말 감사합니다! 문의 드리고 싶은 게 있는데, 메뉴바를 닫을 때 콘텐츠(배너, 게시판 검생창 등등) 아래로 닫혀서 약간 어색하다는 느낌이 드는데 이걸 수정할 방법이 있을까요?
  • ? profile
    헤더 메뉴에서 마우스를 호버했을 때 다른 오브젝트들이 흔들리던가 그런가요? 정확한 파악을 위해서는 사이트 링크를 남겨주셔야 합니다만, 해당 이슈라면 로고, 메뉴가 과도하게 많아서 생기는 문제입니다. 애초에 헤더 영역에서 로고와 메뉴에게 주어진 영역을 다 써버리면 당연히 다른 요소들이 밀려날 수 밖에 없습니다.
  • profile ?
    이렇게 빨리 댓글이 달릴 거라고 생각 못 했는데 먼저 감사드립니다. 말씀해주신 문제보다는, 레이아웃 미리보기 홈페이지에서 모바일로 볼 시 사이드바가 닫힐 때 헤더와 배너 밑으로 내려가는 현상과 같습니다!
  • ? profile
    현재 업로드한 코드와 미리보기 사이트의 코드는 기반 자체가 다릅니다. 이곳에 업로드된 코드는 초기에 제작한 것이고 지금은 CSS 모듈화와 SASS를 사용하여 코드 자체를 갈아엎고 있어요. 미리보기에서 발생하는 문제는 이곳에 업로드된 파일에서 발생하지 않는 문제인 경우가 많습니다.
    미리보기는 웬만하면 이미지로만 참고해주시고, 직접 적용해보시는 편을 추천드려요.
  • ?
    좋아요 너무 좋아요
  • ?
    제가 말을 했었나요?
    포인트 상태 위젯 있잖아요.
    스킨을 default로 해야 인식이 됩니다.
  • ? ?
    아.. 그렇군요 어쩐지 작동이 안되더라구요
  • ? profile
    이퀴어 레이아웃용 포인트 위젯을 해당경로에 정상적으로 설치하셔야 합니다. 기본스킨이 편하시다면 그렇게 하셔도 문제는 없습니다.
  • ?
    멋진자료 감사합니다 ㅠㅠㅠㅠ
  • ?
    좋은자료 감사합니다.
  • profile
    만족도가 높은 레이아웃 입니다
  • ?
    와.. 갑자기 무료/!! 개이득
  • profile
    새로 웹호스팅(http://samjung.iwinv.net/)을 신청하고 라이믹스를 설치하여 멋진 레이아웃을 사용하고 싶은데 사이트 디자인 설정에서 아래와 같은 오류가 뜹니다
    AJAX communication error while requesting admin.procAdminInsertDefaultDesignInfo
    403 Forbidden (error)
    Forbidden
    You don't have permission to access /
    on this server.
    PC 설정저장이 안됩니다
    도와주십시요~~
  • profile profile
    FTP에서 권한설정 해보세요. 서버 또는 XE 코어 문제에 대한 질문은 삼가 바랍니다.
  • profile profile
    죄송합니다
    다른 레이아웃도 연결해보니 마찬가지라 여기 게시글을 삭제하려고 라이믹서로 글을 올리려고 들어오니 이미 댓글이 달려네요

    조금 후 삭제하겠습니다
  • ?
    좋아요
  • ?
    감사합니다!
  • ?
    깔끔하고 좋습니다.
  • ?
    감사합니다.
  • ?
    우와 감사합니다 지금 바로 써볼께요 +_+
  • profile
    혹시 반응형을 끌수는 없는건가용?
  • profile profile
    모바일 뷰 설정하시면 모바일 스킨 따로 가능해요. 반응형은 끄고 켜는 개념이 아닙니다.
  • profile profile
    아 그렇군요 감사합니다~
  • profile
    보다보면 계속 빠져드는 레이아웃 같습니다.
    너무 좋아서 구매까지 했네요 ㅋㅋ 감사합니다!
  • ?
    잘 쓰겠습니다!
  • profile
    안녕하세요 SNAX님! 좋은 레이아웃 배포해주셔서 정말 감사합니다.
    스킨을 사용하다 폰에서 접속할 때 로그인 버튼의 스타일이 제대로 적용되지 않는 것을 발견했는데 (같은 스타일이 적용된 다른 버튼들은 정상적으로 보입니다.) 제 얄팍한 지식으로는 도저히 이유를 알아낼 수 없어 덧글을 남기게 되었네요. 삼성 핸드폰 크롬 브라우저에서는 제대로 보이고 아이폰 6s와 6s+ 크롬 및 사파리 (iOS 버전 11.2.6과 11.3)에서 아래 첨부한 링크와 같은 문제가 일어나는 것을 확인했는데 문제 해결에 도움을 주실 수 있으시다면 정말 감사하겠습니다. 좋은 하루 되세요!
    참고 이미지: https://imgur.com/a/B0BYE

    +) 임시 방편으로 background: linear-gradient을 넣어 해결했습니다.
  • profile
    SNAX님 좋은 레이아웃을 무료로 배포해주심에 감사드립니다 :)
    다름이 아니라 적용중에 equeer.css 파일에 글로벌하게 선언된
    box-sizing: border-box; 로 인하여
    통합검색 결과 화면, content 위젯 여백등 지정하는 화면이 좀 깨지는 부분을 발견했는데요

    equeer.css 파일내 box-sizing 부분을 지운다면
    혹시 어떤 파일들에 해당 내용들을 기입해주면 될까요?
  • profile profile
    무료 버전은 기술지원하지 않습니다. 해당 문제는 유료 버전에서 이미 해결된 부분입니다.
  • profile profile
    앗.. 그렇군요 ㅎ 알겠습니다 제가 많은 것을 요구했네요~
    그냥 CSS 수정하고 깨지는 부분에 style 별도로 입혀서 조치하였습니다.
    다시한번 좋은 레이아웃 감사합니다!
  • ?
    이런예쁜 레이아웃이무료라니요 ^^ 기회되면 유료도구매하고싶습니다
  • ?
    감사합니다. ^^
  • ?
    깔끔하고 예쁜 레이아웃이네요. 잘 사용하겠습니다~~
  • ?
    감사해요~~~
  • profile
    유료로 구입했습니다. 만족합니다.
  • profile
    테스트 적용해 보려고 합니다. 갑사합니다.
  • profile
    잘쓰겠습니다.
  • profile
    감사합니다.
  • profile
    심플한 레이아웃 찾고있었는데 너무 좋네요.
    좋은 자료 감사합니다 :)
  • profile
    정말 너무 예쁘고 깔끔합니다ㅠㅠㅠㅠ 무료로 이런 레이아웃을 사용할수있다니!!! 정말 감사해요!!
  • profile
    안녕하세요 깔끔하고 너무 예쁘네요 ㅠㅠ! 유료구매를 위해 사이트에 접속했지만 이 스킨은 스토어에 없던데 혹시 다른 이름으로 변경이 된걸까요? 감사합니다.
  • profile profile
    이뉘어 유료버전은 작년을 끝으로 개발 및 판매가 중단된 제품입니다. 현재의 라이믹스 2.0과 호환되지 않습니다.
  • profile profile
    와, 빠른 답변 감사합니다. XE php 7.0 을 쓰고 있습니다만, 판매까지 중단되었다니 너무 아쉽네요 ㅠㅠ 이렇게 무료로 풀어주신 것에 대해 정말 감사드립니다! ㅠ
  • ?
    모바일에서 햄버거 메뉴버튼이 있는데, 하단에 또 메뉴 텍스트가 나옵니다.
    메뉴 텍스트 안보이게 설정할 수 있는지요?
  • profile
    감사합니다 !
  • ?
    감사합니다!
  • profile
    좋은 레이아웃 입니다.
  • ?
    너무 이뻐요~~^^