최신 버전을 이용해 주세요.
다운로드
이 스킨은 인터넷 익스플로러와 완벽하게 호환되지 않습니다.
완전히 무료로 제공되는 스킨입니다.
스킨을 내려받으신 후, 이 글을 참조하시면 커스터마이징을 수월하게 하실 수 있습니다.
소개
Cool Summer 스킨
Lovely Heart 스킨
Snowy Snow 스킨
인덱스 페이지를 화면을 가득 채우는 사진과 로고 등으로 꾸미는 반응형 스킨입니다.
최대한 자유롭고 편하게 커스터마이징을 할 수 있도록 작업합니다.
카테고리 글 목록엔 masonry 디자인을 사용합니다.
페이지의 전환은 별도의 클릭이 필요 없이 스크롤을 아래로 내리면 다음 페이지의 글 목록을 불러옵니다.
스킨을 처음 적용하면, 이미지들을 제가 지정해놓은 크기로 불러오는 작업을 하느라 그런지 시간이 평소보다 조금 더 걸립니다.
배너에는 본인이 원하는 동영상을 사용할 수도, 대표 이미지를 불러올 수도 있습니다.
아래의 디자인을 사용하시고 싶은 경우에는, html에 "banner-alt"란 class를 추가한 뒤, #banner의 src를 제거해주세요. <div id="banner"></div>로 변경하셔도 됩니다.
기존의 사이드바보다 간단하게 닫을 수 있습니다.
화면의 검은 공간을 누르거나, 뒤로 가기 버튼을 누르면 사이드바가 닫힙니다.
유튜브 비디오를 반응형으로 화면에 꽉 맞게 맞춰줍니다.
1 | $(".youtubevid").parent().removeAttr("style"); | cs |
만약 화면이 깨진다면 아래 스크립트를 추가해주세요.
댓글을 입력할 때 이모티콘을 사용하실 수 있습니다.
그리고, 링크는 물론 이미지 / 비디오 / 유튜브 링크 / 오디오 네 가지를 해당 태그로 자동으로 치환해줍니다.
글을 작성하실 때 팝업창을 사용하실 수 있습니다.
1 2 3 4 5 6 7 8 | <button class="dialog__trigger"><span>Click Me!</span></button> <div class="dialog"> <span class="dialog__close icon-times"></span> <h2 class="dialog__title">제목</h2> <div class="dialog__content"> 까꿍 </div> </div> | cs |
Merry & Happy
비디오를 중심으로 한 포스트를 작성할 때 도움이 되는 비디오 포스트 기능이 있습니다.
제목을 비디오 아래로 내려주고, 비디오가 스크롤 밖으로 벗어나면 좌측 하단에 비디오를 고정합니다.
1 2 3 | <div class="video-post"> <iframe></iframe> </div> | cs |
이렇게 글을 작성하실 때 iframe을 video-post란 class를 지닌 요소로 감싸주시면 됩니다.
요소로 부드럽게 스크롤을 할 수 있습니다.
1 | <a href="#id" class="smt-scr">부드러운 스크롤</a> | cs |
.smt-scr이란 class는 해당 요소로 이동을, .smtscr이란 class는 해당 요소에서 헤더 높이를 뺀 만큼 이동합니다.
해당 링크로 가셔서 오른쪽 아래에 마우스 모양을 클릭해보시면 확인하실 수 있습니다.
마치며
상술한 내용 외에도 스킨을 편하게 사용하기 위한 기능들이 많습니다.
추가됐으면 하는 기능, 빼고 싶은 기능, 수정했으면 하는 디자인 등을 말씀해주시면 적극 반영하겠습니다.
댓글이나 방명록, 이메일(taengoo890309@naver.com), 디스코드(Marshall Ku #8417)로 편하게 연락해주세요.
