본문 바로가기

컨텐츠/티스토리 스킨

반응형 포토갤러리 티스토리 스킨1 배포합니다.

메이슨리 자바스크립트 라이브러리로 제작한 포토갤러리 티스토리 스킨입니다.

웹브라우저 너비에 따라 1행에 표시되는 썸네일의 갯수가 자동 조정됩니다.

행당 표시되는 썸네일 갯수가 변하는데 따라 애니메이션이 되면서 레이아웃이 조정됩니다.


썸네일 이미지 크기는 300px x 300px 로 고정입니다.


글 제목과 내용 미리보기는 이미지에 마우스 커서를 가져가면 자동으로 표시됩니다.


모바일 화면에서는 화면을 스크롤하는데 따라 현재 표시되는 썸네일의 제목과 내용이 자동으로 표시됩니다.


사이드바 항목은 히든 메뉴로 감춰서 최대한 심플하게 보이도록 했습니다.


알림!

-------------------

메이슨리 기반의 포토갤러리 스킨은 글에 첨부된 이미지가 없을 경우 해당 글의 미리보기가 메인 목록에 출력되지 않습니다.

일반 반응형 스킨은 이미지가 없을 경우 해당 영역에 텍스트 본문 내용이 출력되어 자리를 차지하는데, 

메이슨리 기반 포토갤러리 스킨은 해당 글이 제외되고 나머지만 출력됩니다.

사진형 블로그를 운영하거나 포스트에 이미지가 첨부되는 글만 작성하는 경우에 적용하시기 바랍니다.



썸네일 이미지 300px x 300px

---------------------------------


스킨 미리보기


* 미리보기시 브라우저 창 크기를 줄이면 모바일 반응형 화면을 확인할 수 있습니다.


-------------------------------------

1.0.1 Patch - 이웃추가 링크에 버그가 있어 패치되었습니다.

-------------------------------------

reactive_photogallery1_1.0.1_blogpack.tistory.com.zip








썸네일 이미지 300px x 200px

---------------------------------


스킨 미리보기


* 미리보기시 브라우저 창 크기를 줄이면 모바일 반응형 화면을 확인할 수 있습니다.


-------------------------------------

1.0.1 Patch - 이웃추가 링크에 버그가 있어 패치되었습니다.

-------------------------------------

reactive_photogallery1b_1.0.1_blogpack.tistory.com.zip






  • 멋진 스킨 잘쓰고 있습니다.
    타이틀 밑에 홈버튼, 글쓰기 버튼 등 6개의 버튼이 있는데
    색상을 바꿀려면 어떻게 해야되는지요~
    아무리 찾아봐도 못찾겠네요 ㅎ
    배경색을 어두운것을 했더니 홈버튼은 좀 밝은 색이면 해서요~
    감사합니다~^^

    • css 147행을 보시면
      color:#3e3e3e
      가 탑 폰트어썸 아이콘 컬러 지정입니다.
      원하시는 컬러로 변경하면 됩니다.
      웹컬러 숫자 표기가 어려우시면

      https://www.w3schools.com/colors/colors_picker.asp

      요기서 원하는 컬러값을 찾아서 적으시면 됩니다.

      같은행의 font-size:20px 로 지정된 글꼴 크기 숫자를 조정하시면 해당 아이콘 크기로 세밀하게 조정하실 수도 있습니다.