본문 바로가기

티스토리 스킨 BASIC 1차 버전을 배포합니다. 
이번 BASIC버전의 특징이라면 반응형 웹으로 웹화면뿐만 아니라 모바일화면에서도 잘 보이도록 했습니다.

모바일 화면에서는 카드넘김 형태로 구현해서 좀 더 직관적이고 편리한 화면을 보실 수 있습니다.

웹 화면과 모바일 화면 스킨

데모 사이트

데모사이트는 현재 나만 모른는 이야기 에 적용 되어 있습니다. 
새로운 스킨을 개발하기 전까지는 여기에 적용하고 완성도를 높일 생각입니다.

특징

반응형 디자인

반응형 디자인으로 제작되어 다양한 디바이스에서 최적화된 화면을 보여 줍니다.

웹화면

웹화면의 매인페이지는 리스트형이 아니라 카드형의 UX를 제공하여 소중하게 작성된 글이 한눈에 보여지도록 가시성을 높였습니다.

모바일 화면

모바일 화면은 카드형태의 UX를 제공합니다. 화면을 위로 밀어 올리면 1개의 Post 단위로 보여집니다.

숨쉬는 프로필 사진

화면 상단 가운데 있는 나의 프로필 사진이 숨을 쉬듯 천천히 움직여 마치 살아있는 블로그처럼 표현했습니다.

사이드 메뉴에 아이콘을 표시

사이드 메뉴의 각 제목 앞에 적절한 아이콘을 표시할 수 있습니다. 
자세한 설정방법은 아래의 스킨 적용방법을 참조 하세요.

사이드메뉴 아이콘

가격

20,000원(40,000원 50% 할인) 구매하기

출시 후 1달 동안 50% 할인을 시작으로 매 달 10%씩 할인율이 줄어듭니다.

출시 후 기간1개월2개월3개월4개월5개월6개월 이후
할인율50%40%30%20%10%할인기간 종료
  • 자동이 아니고 수동으로 할인율을 조절하니 "할인된 금액이 아닌것 같다~" 싶으면 댓글을 통해 알려주세요 ^^ 
    (출시일은 2018년 11월 1일 입니다.)

공통 적용방법

스킨 적용방법

UXGJS_TistorySkin_B 스킨의 적용방법은 아래와 같습니다.
설정값은 <html>의 <head>영역에 있는 javascript skin_cfg에 정의되어 있습니다.

<html>
    <head>
        <script>

            var skin_cfg = { ... };

        </script>
    </head>
    <body>
    </body>
</html>

서브메뉴 아이콘 설정

서브메뉴는 우측에 서브메뉴 버튼을 누르면 보여지는 메뉴를 말합니다. 기본적으로 아이콘이 없는 단순 텍스트 메뉴만 보여집니다.
단순 텍스트 메뉴로만 나와도 문제 없이 사용할 수 있습니다. 다만 디자인적으로 좀 더 꾸미고 싶은 사용자를 위해 제공되는 기능입니다.

사이드바

서브메뉴의 아이콘은 xeicon을 활용합니다.
sidebar_icon 의 '번호' : '아이콘명'을 확인 후 xeicon에서 찾으신 아이콘 이름을 입력하시면 됩니다.

아이콘 이름

/****************************************************************
****************************************************************/
"sidebar_icon": {
    "1": "xi-home",
    "2": "xi-gift-o",
    "3": "xi-share-alt-o",
    "4": "xi-puzzle"
}

더 궁금한 사항은 해당 게시물의 댓글을 달아주세요.

배포버전

배포사이트 방문

  • [2018-11-01 배포] UXGJS_TistorySkin_B_v1.0.0


JOS39 블로그

여행과 맛집 그리고 일상에 대해 나만 몰랐던 이야기들..