친절한효자손 취미생활

WEB&SNS/친효애드온 (7)

친효애드온 : 티스토리 상단 PC 2개 모바일 1개 애드센스 광고 넣는 방법

WEB&SNS/친효애드온 친절한효자손 2019.04.24 00:04

이 글을 작성 안 한 것 같더군요. 그래서 최신 버전으로 다시 업데이트 합니다. 티스토리 사용자 분들이라면 애드센스는 거의 필수 코스로 설치를 하실 것 입니다. 이 때 기본 스크립트 코드로 넣으셔도 문제는 없겠지만 좀 더 실적을 올리기 위해서 커다란 직사각형 형태의 디스플레이 광고 두개를 넣는 분들도 계실 것 입니다. 어떻게 삽입하는지 알아보겠습니다. 이 코드는 친효스킨에 최적화된 애드센스 광고 코드 입니다. 특정 해상도에서 크기를 임의로 변경했습니다. 일반 다른 반응형 스킨에서 사용하셔도 특별히 문제가 되지는 않습니다. 최대한 특정 해상도에서 최적의 크기로 나타나게 하기 위해서 친효스킨에 맞춘 코드입니다. 참고하시기 바랍니다. 먼저 아래의 첨부파일을 다운로드 받아 주시기 바랍니다. 여기 첨부파일을 받으..

더 읽기

친효애드온: 티스토리 본문 중간에 넣는 수동 링크 (마크1)

WEB&SNS/친효애드온 친절한효자손 2019.02.21 00:07

이번 친효애드온은 본문 중간에 삽입하는 링크 입니다. 수동으로 넣는 경우가 종종 있습니다. 예를 들어서 CSS 코딩 관련해서 글을 작성했다고 한다면, 해당 글과 관련된 HTML 내용이라던지, 아니면 유용한 사이트라던지 바로가기를 넣어야 하는 경우 입니다. 지금까지 작성했던 글 중에서도 관련된 문서가 있을 수 있습니다. 이럴 때 요긴하게 사용되게 될 것입니다. 방법은 두가지인데, 어떤 포지션이냐에 따라서 다릅니다. 첫번째는 말 그대로 수동으로 넣는 경우입니다. 두번째는 티스토리 플러그인 중 하나인 "이전 글 넣기"를 사용할 때 입니다. 하나하나 사용법을 안내해 드리겠습니다. CSS 세팅하기 먼저 이 모듈을 적용시키기 위한 스타일을 세팅해야 합니다. 방법은 스킨편집으로 들어가셔서 CSS 탭으로 이동합니다. ..

더 읽기

친효애드온 : 티스토리 본문에 들어가는 이미지 테두리 자동 적용 (마크1)

WEB&SNS/친효애드온 친절한효자손 2019.01.20 00:04

본문에 이미지들 많이 넣으시죠? 혹시 넣으실때마다 테두리를 적용하시나요? 티스토리의 포토에디터에서는 다양한 테두리 스타일을 제공하고 있습니다. 하지만 저의 경우는 이 중에서 검정 테두리만 주로 사용을 하는 편 이며, 이따금씩 까먹고 그냥 삽입하고는 합니다. 일반적으로 촬영한 사진들은 괜찮은데 강좌를 위한 스크린샷 화면의 경우는 배경이 흰색인 이미지들이 있을때면 테두리를 만들어주지 않으면 본문과 햇갈려서 어디까지가 이미지고 어디가 본문의 백그라운드인지 잘 모를때가 있습니다. 그래서 이를 구별짓기위해 테두리를 만들어 줍니다. 티스토리의 포토에디터가 가끔 오류가 날 때가 있습니다. 그러면 처음부터 다시 작업해야 합니다. 사진이 한두장인 경우는 그냥 다시 처음부터 진행해도 크게 무리는 없지만, 10장 이상되는 ..

더 읽기

친효애드온: 중요 내용을 알리는 친효팁박스 (마크1)

WEB&SNS/친효애드온 친절한효자손 2018.12.29 00:06

가끔 티스토리 본문을 작성하다가 꼭 중요한 내용을 작성할때가 있습니다. 가령 주의사항이 대표적인 텍스트라고 할 수 있습니다. 가독성을 올리고 좀 더 강조하고자 할 때, 티스토리에 있는 글상자 기능을 활용해서 작성하곤 합니다. 하지만 너무 밋밋한데다 많은 사람들이 쉽게 사용하는 방법입니다. 그래서 저만의 친효팁박스를 만들어 봤습니다. 아래는 그 예시 입니다. TIP 한줄일 경우에도 텍스트가 세로 상태로 중앙정렬이 됩니다. TIP 계속 텍스트를 작성하셔도 세로 중앙정렬이 지속됩니다. 텍스트를 채워갈수록 중앙에서부터 계속해서 세로 중앙정렬이 진행됩니다. TIP 계속 텍스트를 작성하셔도 세로 중앙정렬이 지속됩니다. 텍스트를 채워갈수록 중앙에서부터 계속해서 세로 중앙정렬이 진행됩니다. 이렇게 계속해서 본문을 채워..

더 읽기

친효애드온: 관련글 (참고글) 디자인 마크1.0

WEB&SNS/친효애드온 친절한효자손 2018.12.25 00:02

제 블로그를 살펴보시면, 관련글 부분이 어느 순간부터 다른 디자인으로 이루어져 있다는걸 확인하실 수 있습니다. 아직 잘 모르시겠으면 여기를 방문하셔서 관련글들의 디자인을 살펴보실 수 있습니다. 다른 블로그와의 차별성을 두기 위해, 혹은 좀 더 개성넘치지만 과하지 않은 디자인을 생각하다보니 이렇게 구성을 해 봤습니다. 관련글 마크1 사용방법1. 먼저 본 페이지에서 제공하는 첨부파일을 다운로드 받습니다.2. 첨부파일 안에 있는 CSS 내용을 자신의 티스토리 스킨의 CSS에 붙여넣기를 합니다.3. 글 작성시, 수동으로 div로 감싸줍니다. 크게 이 세가지로 진행됩니다. 2번까지는 쉽습니다. 3번에서는 좀 더 추가설명을 드리도록 하겠습니다. HTML 안쪽에 폰트어썸 CDN 세팅하기아이콘 세팅을 위한 단계입니다...

더 읽기

친효애드온: 티스토리 첨부파일 디자인 변경 설치 및 적용 방법 (마크1)

WEB&SNS/친효애드온 친절한효자손 2018.12.24 00:04

현재 일부 스타일을 변경해서 적용하고 있습니다. 스킨은 현재 순조롭게 완성되어가고 있습니다. 그 중에서 당장 사용 가능한 몇가지들을 공유하려고 합니다. 현재 친효스킨은 부분별로 업그레이드가 가능한 파츠형 스킨으로 개발 중 입니다. 누구라도 쉽게 커스터마이징 해서 사용하기 편리한 그런 스킨으로 완성하는데 목표를 두고 있습니다. 티스토리에서 기본적으로 제공하는 첨부파일 스타일이 뭔지 아시죠? 상당히 촌스럽습니다. 그리고 눈에 잘 띄지도 않습니다. 개인적으로 두번째 문제가 가장 심각하다고 생각합니다. 첨부파일이 어디에있나 한참을 찾을 이유가 없습니다. 누가봐도 "아, 이게 첨부파일이군!" 싶어야 합니다. 이게 기존 티스토리 첨부파일 디자인 입니다. 눈에 잘 안띕니다. 이것을 수정하려면 CSS 내부에서 클래스값..

더 읽기

친효애드온: 티스토리 본문에 오류없는 표 넣는 방법 (엑셀표 마크1)

WEB&SNS/친효애드온 친절한효자손 2018.12.12 00:03

새롭게 선보이는 카테고리 입니다. 여기에는 티스토리 스타일을 꾸며주고 사용 편의성을 높이는 모듈들을 만들어 올리는 콘텐츠 입니다. 어떤 스킨에서든지 다 통합니다. 단! 티스토리 전용 어플리케이션에서는 비정상으로 보여집니다. 하지만 상관 없습니다. 티스토리 앱을 이용하시는 분들은 거의 적을 뿐더러 원래 기존에 사용하던 표도 정상적으로 보여지진 않았으니까요. 적용 방법은 간단합니다. CSS 스타일에 코드를 추가해주시고, 사용하실 때, HTML 태그 요소들만 조금씩 수정해서 사용하시면 됩니다. 이름하야, "친절한효자손 애드온" 이라고 명명 합니다. 오늘은 그 첫번째로 티스토리에서 취약하기로 소문난(?) 표 만들기에 대한 방법입니다. TIP 알림 : 친효애드온의 저작권은 저에게 있습니다. 코딩에 마크업된 태그 ..

더 읽기

Copyright © 친절한효자손 취미생활 All Rights Reserved

Designed by JB FACTORY