VSCODE 블로그포스팅/블로그포스팅 설명서 2022. 2. 10.
Tistory API 생성하는 방법
[nJo2] markdown blogPosting tistory-blogger for vsce 소개 바로가기 티스토리에 원격으로 글을 쓰기 위해서는 API를 사용해야 하는데 그냥 API를 사용하는것이 아니라 티스토리 측에 API를 사용하겠다고 승인을 받아야만 사용이 가능합니다. 여기서는 티스토리 API를 승인받는 방법에 대해서 작성을 하려고 합니다. 일단 티스토리에 가입이 되었다는 가정입니다.티스토리 API 신청하기로그인을 먼저 합니다.티스토리 화면의 하단 Footer영역에 보면 오픈API라는 메뉴가 있는데 이 메뉴를 클릭합니다. 오픈API URL : https://www.tistory.com/guide/api/manage/register 앱등록먼저 오픈 API를 사용하겠다는 요청을 아래와 같이 해야 합..
VSCODE 블로그포스팅/블로그포스팅 설명서 2022. 2. 10.
config-blogger.js 설정파일 작성 방법 - [nJo2] markdown blogPosting tistory-blogger for v
[nJo2] markdown blogPosting tistory-blogger for vsce 소개 바로가기 [nJo2] markdown blogPosting for vsce을 설치하게 되면 아래 1개 또는 2개의 파일에 대해 설정을 해줘야 합니다. .vscode > config-blogger.js : 구글 블로거에 대한 설정을 하는 파일 .vscode > config-tistory.js : 티스토리에 대한 설정을 하는 파일 이중에 이 포스팅에서는 .vscode > config-blogger.js 설정에 대해서 자세히 설명을 하려고 합니다. 먼저 아래의 전체 코드를 보여드리고 하나씩 부분 부분 설명을 하도록 하겠습니다.전체 코드// config-blogger.js module.exports = { /**..
VSCODE 블로그포스팅/블로그포스팅 설명서 2022. 2. 10.
Google Blogger API 생성하는 방법
[nJo2] markdown blogPosting tistory-blogger for vsce 소개 바로가기 Blogger에 원격으로 글을 쓰기 위해서는 API를 사용해야 하는데 그냥 API를 사용하는것이 아니라 Google Blogger 측에 API를 사용하겠다고 승인을 받아야만 사용이 가능합니다. 여기서는 Blogger API를 승인받는 방법에 대해서 작성을 하려고 합니다.Blogger 가입하기일단 먼저 Blogger에 가입을 해야 합니다. https://blogger.com 에 접속을 하고 가입을 합니다.아래에 블로그 이름을 작성하고 Blogger을 생성합니다.Blogger API에 대한 설명이므로 Blogger에는 가입했다고 치고 다음 설명으로 넘어가겠습니다. ^^Blogger API 신청하기Bl..
VSCODE 블로그포스팅/블로그포스팅 설명서 2022. 2. 10.
마크다운으로 VS Code를 사용하여 티스토리와 구글 블로거에 글쓰기
[nJo2] markdown blogPosting xxxxx for vsceFeatures마크다운(.md)으로 티스토리 블로그와 구글 블로거에 글을 쓸 수 있게 도와주는 Visual Studio Code의 익스텐션입니다. 또한 포스팅한 글을 내 컴퓨터에 체계적으로 보관하고 관리할 수 있어서 블로그가 폐쇄되거나 다른 블로그로 옮겨 탈 때 내 콘텐츠를 그대로 활용할 수 있는 장점이 있습니다. Visual Studio Code를 사용하여 마크다운(Markdown) 글을 작성할 수 있어서 굳이 티스토리나 블로거를 열어서 글을 작성할 필요가 없습니다.구매하기이 익스텐션은 아래의 위치에서 구매를 할 수 있습니다. https://shop.njo2.com 구매를 하게 되면 해당 블로그에서 익스텐션 설치 파일인 njo2..
티스토리 스킨/T스킨 설명서 2022. 2. 10.
판매/구매 안내
T스킨은 티스토리에 사용할 수 있는 스킨입니다.구매 진행 절차 [구매자] nJo2 미니샵 또는 티스토리 미니샵 에서 구매 신청합니다. [구매자] 지정된 계좌로 무통장 입금 하거나 QR코드를 활용하여 입금합니다. [판매자] 입금 확인 후 다운로드 권한을 승인합니다. [구매자] nJo2 미니샵의 MY탭 또는 티스토리 미니샵의 MY탭이나 상품의 상세보기의 다운로드 탭에서 스킨파일을 다운로드하여 사용합니다. 설치하기스킨 설치에 대해서는 티스토리 스킨 설치하기를 참고하세요.지원안내저작물의 오류에 대해서는 최대한 빠른 시간에 수정하고 배포할 것입니다.오류가 아닌 기능 추가, 코드 변경 등의 수정 요청에 대해서는 공식적으로 지원하지 않습니다. 다만 공통적으로 필요한 기능일 경우 차후 버전에 추가로 기능개발 하도록 하..
IT이야기/Google프로그램 2022. 2. 9.
Google 스프레드시트로 구글캘린더에 일정 연동하는 방법
저는 구글 제품을 많이 사용하는 편입니다. 제 주력 캘린더도 Google 캘린더 고요. 이번에 모임의 임원을 맡게 되면서 회원들의 생일을 캘린더에 등록해야 할 일이 생겼어요. 그냥 하나하나 등록을 하는 도중 "내가 지금 뭐하고 있나.." 라는 자괴감이 들기 시작했어요. 구글 시트에 있는 날짜 정보(생일)을 한 번에 쉽게 일괄 등록할 수는 없을까라는 생각이 뇌리를 스쳤습니다. 그래서 찾아봤더니.. 약간의 매크로 프로그램을 작성하면 가능할 것 같더라고요. 그래서 열심히 개발을 해봤습니다. 1시간이면 등록할 것을 8시간 걸려서 프로그램을 짜 봤어요. 결과적으로는 더 비효율적이었네요. ㅠㅠ 그러나... 나에게는 비효율 적이었지만 이코드를 공개하면 다른 사람에게는 큰 도움이 될 수 있겠구나 생각을 하고 코드를 공..
WEB개발이야기/웹퍼블리싱 2021. 10. 20.
자식 컴포넌트의 CSS(SCSS)를 정의할 수 있는 딥셀렉터(v-deep) 설정하는 방법
Vue 프로젝트를 진행하다 보면 vuetify나 quasar 등 매우 다양한 프레임워크나 컴포넌트를 사용하게 됩니다. 그러면서 그 컴포넌트를 내 Vue 프로젝트의 자식 컴포넌트로 불러와서 사용하는 경우가 있는데 그 컴포넌트를 어떻게 CSS를 적용해서 내 입맛에 맞추어 스타일을 변경하고 싶으나 그게 생각처럼 되지 않는 경우가 있습니다. 그걸 되게 하는 방법을 설명해 보려고 합니다. 자식 컴포넌트의 CSS에 쉽게 접근이 되지 않는 이유이렇게 되는 이유는 웹 컴포넌트의 중요한 측면인 스타일 캡슐화때문이라고 합니다. 다시말해서 현재 컴포넌트에 적용된 css(scss)가 현재의 컴포넌트에만 적용되고 다른 컴포넌트에는 간섭이 되지 않도록 하기 위함이라고 보시면 됩니다. 그래서 Vue컴포넌트에서 그런데 scoped를..
WEB개발이야기 2021. 6. 5.
Docker로 Quasar framework 개발 환경 세팅하기
Docker와 docker-compose를 사용하여 Web 또는 App을 개발하는 환경을 세팅해 보려고 합니다. 이 세팅으로 여러사람, 또는 여러 장소에서 개발, 빌드의 환경을 동일하게 가져갈 수 있습니다. 일단 Windows 환경(WSL2)에서 Docker데스크톱이 설치되어 있다는 전제 입니다. Quasar 프로젝트 초기 파일 생성하기 (스캐폴딩 - Scaffolding)아무것도 없는 상태에서 Quasar 프로젝트를 시작하려면 먼저 스케폴딩을 파일을 가져와야 합니다. 보통 vue init나 quasar create로 생성해야 하며 이것도 Docker의 기능을 활용해서 가져오면 됩니다. 먼저 CMD창을 열고 프로젝트로 사용할 폴더를 만들고 해당 폴더로 이동합니다. # 프로젝트 폴더 생성 mkdir myp..
WEB개발이야기 2021. 2. 17.
headless CMS인 STRAPI 설치하기
이전시간에 프론트앤드 개발자에게 꼭 필요한 백앤드를 책임질 STRAPI 라는 제목으로 소개에 대한 포스팅을 했었습니다. 이번에는 STRAPI를 설치하는 방법에 대해서 포스팅을 하려고 합니다. STRAPI 설치하기strapi를 설치하기 위해서는 이미 컴퓨터에 npm 5.2.0이상 버전이 설치되어 있거나 yarn이 설치되어 있어야 합니다. 해당 패키지매니저를 설치하는 방법은 따로 설명하지 않겠습니다. Strapi 패키지는 yarn 또는 npx를 통해 설치할 수 있으며 여기서는 yarn으로 설치하는 방법만 작성합니다. 1. 프로젝트 폴더에 설치하기yarn의 아래 명령어로 Strapi의 프로젝트를 설치합니다. yarn create strapi-app my-project --quickstartcreate stra..
WEB개발이야기 2021. 2. 17.
프론트앤드 개발자에게 꼭 필요한 백앤드를 책임질 STRAPI
예전에는 그냥 퍼블리셔로 통칭 되었을텐데 현재는 프론트앤드 개발자라는 아주 중요한 직업군으로 형성되어 있습니다. Web개발의 패러다임이 javascript와 Node.js로 인해 백앤드에서 프론트앤드쪽으로 넘어오게 되면서 프론트앤드 기술을 구현할 수 있는 개발자의 몸값이 상당히 높아지고 있는 것이 사실입니다. 그래서 많은 사람들이 프론트앤드로 전향을 많이하고 있는 추세인데.. 그런 프론트앤드 개발자에게 한가지 걸림돌이 있습니다. 프론트앤드를 주력으로 하지만 어찌되었든 백앤드도 구비를 하고 있어야 한다는 점입니다. Firebase, Amazon, Express 등등.. 백앤드를 구비하는 여러가지 방법이 있으나 그중에서 아주 쉽고 직관적이며 무료로(유료도 있음) 사용할 수 있는 STRAPI라는 백앤드 툴이 ..
WEB개발이야기/Vue.js 2021. 1. 11.
Vue의 Vuetify로 대규모 프로젝트 SCSS(CSS) 진행하는 방법
안정성이 입증되었는지 요즘에는 Vue로 대규모 프로젝트를 많이 하는 추세인것 같습니다. 저도 대규모 프로젝트에 퍼블리셔로 참여하면서 얻은 경험을 기록 차원에서 포스팅을 해보려고 합니다. Vue는 하나의 파일에 구조(Template)와 구현(javascript), 표현(CSS)을 모두 다 담고 있기 때문에 풀스택(Full Stack) 개발자에게는 더할 나위 없이 편한 구조이지만 대규모 프로젝트 처럼 개발자, 디자이너, 퍼블리셔가 별도로 존재하는 경우에는 상당히 불편할 수 있는 구조를 가지고 있습니다. 개발자가 개발하는 파일을 퍼블리셔도 동일한 파일의 이번 포스팅에서는 Vue로 대규모 프로젝트를 진행할 때 퍼블리셔 관점에서 퍼블리셔와 프론트앤드 개발자와 협업을 원활히 하는 방법에 대해서 기술하려고 합니다. ..
WEB개발이야기/Git 2021. 1. 7.
Git 레파지토리 별로 사용자 지정하기
하나의 PC에서 여러 군데의 Git 레파지토리를 운영할 때 레파지토리 별로 사용자 이름과 이메일을 달리 사용해야 하는 경우가 있습니다. 보통은 글로벌하게 설정하여 사용하기 때문에 모든 레파지토리에서 커밋과 푸시를 하게 되면 동일한 이름이 사용되게 되어 있습니다. 모든 레파지토리에 글로벌하게 적용아마도 대부분 글로벌하게 적용하는 이 방법은 아시리라 생각됩니다. $ git config --global user.name "이름 1" $ git config --global user.email "이메일주소 1"하나의 레파지토리에만 적용하지만 하나의 레파지토리에만 다른 이름과 이메일을 적용하는 방법은 잘 모르시는 경우가 있습니다. 바로 --global 을 --local로만 변경해 주면 됩니다. 원하는 레파지토리의 ..
티스토리 스킨/T스킨 설명서 2020. 11. 10.
티스토리 관리자 기능 중 수익 적용하기 (애드센스)
[ 2023.09.15 티스토리 공식 애드센스 적용과 개별 애드센스 적용에 대한 충돌 문제 관련 ]티스토리에서 애드센스를 공식 적용하면서 개별적으로 애드센스를 달았던 사람(커스텀 스킨)과 충돌이 발생하고 있었습니다. 저희 Tskin도 충돌이 있었으며 V3.0.1에서 이부분에 대해서 해결을 하였습니다. 에러는 잡았는데, 영향도에 대해서는 좀 더 지켜봐야 할것 같습니다. 관련하여 아래 공지사항을 확인해 주시기 바랍니다. 커스텀 스킨의 애드센스와 티스토리 공식 애드센스의 충돌 문제 해결 했습니다. 바로가기 [ 2020. 11 .4 공지 내용(블로그 이전에 따른 재등록) ]이번에 티스토리에서 카카오 로그인과 수익 기능을 업데이트 했습니다. 수익기능 중 애드센스적용에 대해서 설명하려고 합니다. 추가로 T스킨에 특..
티스토리 스킨/T스킨 공지사항 2020. 11. 3.
T스킨BASIC V2 Version 2.5.2 배포합니다
안녕하세요. 오랜만에 스킨 업데이트(Version 2.5.2)를 했습니다. 티스토리에서 이번에 카카오 로그인 방식을 반영했고 수익이라는 기능이 추가가 되었습니다. 그에 따라 T스킨도 적절히 반영하였습니다. [스킨 다운로드 바로가기]내용 변경티스토리의 카카오 로그인과 수익(애드핏, 애드센스) 기능 추가에 따른 스킨 현행화 반영 적용 태그 결과 리스트 화면 표현 수정 본문 좌측 댓글 화면 기능 개선 Hotfix모바일 화면 카드형 리스트 화면 정리 수정된 파일 skin.html style.css images script.js vendor.js
티스토리 스킨/T스킨 설명서 2020. 10. 6.
17. 본문 포스팅에 탭기능 구현하기
T스킨은 부트스트랩을 기본 베이스로 사용합니다. 그 이야기는 무엇이냐 바로 본문에 부트스트랩의 기능을 쉽게 사용할 수 있다는 뜻입니다. 그중에 이번에는 Tab기능을 구현하는 방법을 설명하도록 하겠습니다. 사전지식글쓰기를 하실 때 아래에 대한 약간의 사전지식이 있어야 원활하게 사용하실 수 있습니다. HTMLCSSBootstrap ( https://getbootstrap.com/ )구현된 모습첫번째 탭두번째 탭세번째 탭 첫번째 탭 내용.. 두번째 탭 내용.. 세번째 탭 내용.. 글쓰기 구현하기먼저 글쓰기 창으로 이동합니다. 글쓰기는 새로운 글쓰기를 기준으로 설명하겠습니다. ▲ 우상단에 있는 글쓰기 모드 중에 HTML로 변경을 합니다. HTML 모드에서는 바탕색이 검정색으로 나타납니다. 이 모드에서는 작성하는..
티스토리 스킨/T스킨 공지사항 2020. 9. 25.
T스킨BASIC V2 Version 2.5.1 배포합니다
안녕하세요. T스킨 BASIC V2 Version 2.5.1을 배포합니다. 내용 변경 리스트 화면에서 카테고리명과 날짜의 위치 변경 Hotfix 검색창 포커스 시 테두리 검정 색상 수정 게시판템플릿 사용 시 글 수정 후 창이 열리지 않거나 닫히지 않는 오류 수정 관리자 화면의 사이드바 나의 링크 영역 제목 제목 오타 수정 수정된 파일 skin.html style.css images script.js 다운로드하러 가기 [T스킨 BASIC V2 Version 2.4.0 다운로드 바로가기
티스토리 스킨/T스킨 공지사항 2020. 9. 18.
T스킨BASIC V2 Version 2.5.0 배포합니다
안녕하세요. T스킨 BASIC V2 Version 2.5.0을 배포합니다. 기능 추가 1. 블로그의 포스트 리스트 화면에서 일반 리스트 보기 설정 추가 첫 화면인 리스트에서 카드 형태의 리스트만 보여주던 것을 일반 리스트 형태로도 보이게 하는 설정을 추가했습니다. 첫화면 카드 보기 형태 외에 리스트 보기 형태 설정하기 바로가기 2. 홈커버에서 카드 리스트 형태 보기 기능 추가 첫 화면에서 사용하던 카드 리스트 형태의 리스트를 홈 커버의 아이템으로 추가했습니다. 홈커버 화면에서 카드 리스트 보기 기능 설정하기 바로가기 3. 본문의 이미지 원본을 보여 주는 라이트박스(Lightbox) 플러그인과 중복되지 않게 처리 라이트박스(Lightbox)가 티스토리의 구형 글쓰기, 신형 글쓰기, 기타 방법으로 글을 쓰더..
티스토리 스킨/T스킨 설명서 2020. 9. 18.
홈커버 화면에서 카드 리스트보기 기능 설정하기
T스킨의 화면의 홈커버에는 다양한 커버 아이템이 있습니다. 이번 V2.5.0버전부터 Card리스트 형태 아이템을 추가하였습니다. 구현된 화면 참고하기 위해 화면의 위아래에 슬라이더 아이템과 벽돌 리스트 아이템을 넣어놨고 중간에 많이 봐오던 카드 리스트 화면을 추가하였습니다. 설정하는 방법설정은 쉽습니다. 관리자 > 스킨설정 화면으로 이동합니다. 그리고 첫 화면이 홈커버로 설정되어 있어야 합니다. 스킨 설정에서 먼저 커버 탭을 선택합니다. 커버 아이템 추가를 선택합니다. 커버 아이템 중 이번에 새롭게 추가된 카드 리스트를 선택합니다. 카드 리스트를 확인합니다. 글 수는 상관이 없지만 그래도 가능하면 12개를 추천합니다. 화면의 가로 크기에 따라 한 줄에 1 ~ 4개의 카드가 나옵니다. 3개가 나올 때나 4..
티스토리 스킨/T스킨 설명서 2020. 9. 18.
첫화면 카드보기 형태 외에 리스트 보기 형태 설정하기
지금까지는 T스킨의 청 화면은 홈커버, 카드 리스트 보기만 있었습니다. 이번 V2.5.0버전부터 일반 리스트보기화면 설정을 추가하였습니다. 기존 화면 기존 Card 리스트 형태의 화면입니다. 구현된 화면 위와 같이 일반 리스트 형태를 구현했습니다. 썸네일 이미지가 있으면 왼쪽에 표시가 되고 없으면 없는 리스트가 나옵니다. 티스토리에서 우리에게 엄청나게 큰 힘을 주는 애드센스도 빠짐없이 나오게 했습니다. 다만 주의해야 할 점은 애드센스 인피드 광고는 가로형태와 세로 형태로 제공을 하고 있습니다. 기존의 Card리스트 형태는 인피드 광고의 세로 형태와 어울리고 일반 리스트 형태는 인피드 광고의 가로형태와 잘 맞습니다. 그래서 인피드 광고를 최적으로 표시하려면 애드센스에서 가로형태의 인피드 광고를 하나 더 추..
티스토리 스킨/T스킨 공지사항 2020. 9. 18.
T스킨SHOP이 현재 중단되었으나 곧 다시 오픈 될 예정입니다.
현재(2020년 9월 17일~) T스킨 SHOP이 중단된 상태입니다. (곧 다시 오픈될 것입니다.) T스킨 SHOP이 별도의 서버를 사용하고 있는데 이용량이 적은 초기에는 무료로 사용할 수 있었으나 무료 사용 한도가 넘어 버려서 막혔습니다. 쩝 ㅠㅠ (좋은 건지 안 좋은 건지..) 어찌 되었든 현재 유료 서비스로 전환을 신청해 놓은 상태이고 심사 중인 상태입니다. 조금만 더 기다리면 다시 오픈 예정입니다. 서비스 이용에 불편을 드려 죄송합니다. 감사합니다. - T스킨SHOP 바로가기 -
티스토리 스킨/T스킨 공지사항 2020. 9. 11.
T스킨BASIC V2 Version 2.4.1 배포합니다
안녕하세요. T스킨BASIC V2 Version 2.4.1을 긴급 배포합니다. 이번에는 스킨 오류에 대한 수정입니다. Hotfix 게시판 템플릿에서 글/댓글 작성 후 리스트 펼침 기능이 되지 않던 것을 정상적으로 수정함 사이드 메뉴에서 티스토리 서비스인 위치로그의 종료에 따라 해당 버튼을 삭제함 댓글 창의 댓글 양이 적을 경우 댓글이 상단에 가려서 보이지 않던 것을 보이게 수정함 SNS 공유의 핀터레스트와 에버노트 공유에 대해서 핀터레스트는 복구하였으며 에버노트는 기능이 중지 되어 제거함 태블릿에서 본문 화면 스크롤되지 않던 오류 복구 수정된 파일 skin.html style.css images script.js 다운로드하러 가기 T스킨BASIC V2 Version 2.4.0 다운로드 바로가기 작업 예정..
티스토리 스킨/T스킨 공지사항 2020. 9. 8.
T스킨BASIC V2 Version 2.4.0 배포합니다
안녕하세요. T스킨BASIC V2 Version 2.4.0을 긴급 배포합니다. 기능 추가 본문 하단 블로거의 필명이 나오던 것을 블로그명이 나오도록 변경 팀블로거가 작성한 글을 고려하여 본문 상단 제목 아래 글을 작성한 블로거의 이름과 대표사진이 나오도록 수정 Hotfix 본문 좌측 공유하기 버튼 클릭 시 보이던 팝업 창이 나오지 않는 기능 오류 수정 관리자페이지 --> 콘텐츠 --> 설정 에서 단락 앞뒤에 공백 사용/미사용 설정에 따라 적용되지 않던 문제 수정 수정된 파일 skin.html style.css images script.js 다운로드하러 가기 T스킨BASIC V2 Version 2.4.0 다운로드 바로가기 작업 예정 서비스 기능 -> 블로그의 첫화면인 포스트 리스트 화면에서 카드형태 보기 ..
WEB개발이야기/VScode 2020. 9. 7.
[익스텐션] Vscode 에서 태그명 변경 시 자동으로 닫힘 태그명까지 변경 (Auto Rename Tag)
Visual studio code의 확장 프로그램인 Extensions에는 정말 재미있고 유용한 기능들이 너무 많습니다. 그중에서 태그를 수정할 때 자동으로 닫힘 태그까지 수정해 주는 익스텐션이 있습니다. Auto Rename Tag HTML, XML, php 등 태그의 이름을 바꾸면 쌍을 이루는 닫힘 태그의 이름이 자동으로 바뀝니다. 설치하기 아래의 링크를 클릭하거나 익스텐션 메뉴에서 Auto Rename Tag를 검색 후 설치를 하면 됩니다. Auto Rename Tag 바로가기 설정하기 ▲ 먼저 파일 > 기본설정 > 설정 으로 설정창을 열어야 합니다. ▲ 좌측메뉴 중 확장 탭을 선택합니다. Auto Rename Tag configuration을 선택합니다. 이 익스텐션의 설정은 settings.js..
WEB개발이야기/VScode 2020. 9. 4.
세상 편리한 VScode 설정 동기화 하는 방법
제 메인 코딩 에디터는 VScode입니다. 서브라임텍스트, 아톰, 브라켓 등을 써봤는데 저에게는 VSCode가 잘 맞는 것 같습니다. 요즘 재택근무다 뭐다 해서 근무하는 장소나 컴퓨터가 여러 대 일 때가 있고 윈도우 쓰다 맥 쓰다 하는 저에게 코딩 환경의 일관성은 매우 중요한 요소입니다. 그런데 글쎄 VScode에서는 환경설정을 동기화 해주는 기능이 있다고합니다. 예전에는 'Shan Khan'이라는 분이 익스텐션으로 개발한 Settings Sync 를 주로 사용했었는데 언제부터인지 이 기능이 VScode에 기본으로 포함이 되어버렸습니다. VisualStudio Code 에디터의 설치와 유용한 확장프로그램(플러그인) 바로가기 여러곳에서 코딩하는 사람에게는 필수 기능이지 않을까 합니다. 설정 동기화 기능설정..
티스토리 스킨/T스킨 공지사항 2020. 9. 2.
T스킨BASIC V2 Version 2.3.0 배포합니다
안녕하세요. T스킨BASIC V2 Version 2.3.0 배포합니다. 기능 추가 1. 블로그 포스트의 태그 기능으로 전체화면이미지 적용하기 블로그 글에 [@전체화면이미지@]태그로 블로그 글의 상단에 전체화면크기의 랜덤이미지가 적용되게 하였습니다. 자세한 설명은 아래 포스트를 참고하세요. 블로그 포스트의 태그 기능으로 전체화면이미지 적용하기 수정된 파일 skin.html style.css images script.js 다운로드하러 가기 T스킨BASIC V2 Version 2.3.0 다운로드 바로가기
티스토리 스킨/T스킨 설명서 2020. 9. 1.
블로그 포스트의 태그 기능으로 전체화면이미지 적용하기
[대상 스킨 : T스킨BASIC V2 Version 2.3.0 이상]블로그 글에 대해서 태그에 특정태그를 입력하면 특별한 탬플릿이 적용됩니다. 이전에는 포스트 글의 태그에 [@게시판@]을 입력하면 게시판 탬플릿이 적용되게 구혔었는데요. 이번에는 [@전체화면이미지@]태그로 블로그 글의 상단에 전체화면크기의 랜덤이미지가 적용되게 하였습니다.구현된 화면블로그 글의 최상단에 전체화면 이미지가 적용된 탬플릿이 적용됩니다. 작성된 블로그 글에서 모든 이미지를 찾아 지정된 크기(기본크기는 가로 800px)이상의 이미지가 1개라도 있다면 그 이미지들에 대해서 최상단에 랜덤하게 보여줍니다. 만약 그런 이미지가 없다면 무슨일이 있었냐는 듯이 원래의 레이아웃으로 보여줍니다. 적용된 포스트 DEMO 구현방법 구현방법은 블로그..
티스토리 스킨/T스킨 공지사항 2020. 9. 1.
T스킨BASIC V2 Version 2.2.1 배포합니다
안녕하세요. T스킨BASIC V2 Version 2.2.1 배포합니다. Hotfix 브라우저의 넓이를 축소할 때 모바일 화면의 크기에 다다르면 기능버튼(구독, 글요소..)이 화면의 가장 아래로 내려가야 하는데 어설프게 상단쪽에 위치하던 것을 가장 아래로 오개 수정하였습니다. T스킨이 반응형으로 설계가 되어 있는데 화면 구조의 안정성을 위해 모바일로 전환하는 시점을 768px로 조정하였습니다. 좌측의 댓글 창을 닫았을 때 나오는 TOC(Table of Content)에 대해 넓이 공간 확보가 된 992px이상일 경우에만 나오게 했습니다. 기타 코드의 안정화 작업이 있었습니다. 수정된 파일 skin.html style.css images script.js vendor.js vendor.css