[simple gray 3.0] 사이드바, 본문 위치 바꾸기
※ 이 가이드는 simple gray 스킨 전용입니다. 다른 스킨에는 적용되지 않습니다. simple gray 스킨의 사이드바와 본문 위치를 바꾸는 방법입니다. 아주 간단하게, 단 두 줄의 소스 추가로 위치를 바꿀 수 있습니다. 관리자 > HTML/CSS 편집 페이지를 열면 다음 부분이 있습니다. @charset "utf-8"; 과 /* * 스킨 위자드 (지우지마세요.) */ 사이에 #content { float: right; } #sidebar { float: left; } 이 소스만 추가하면 됩니다. 이렇게 하면 기존의 [ 본문 좌측, 사이드바 우측 ] 이 [ 본문 우측, 사이드바 좌측 ] 으로 변합니다.
티스토리/simple gray 2015. 12. 3. 17:49[simple gray 3.0] 본문 상/하단에 구글 애드센스 넣기
※ 이 가이드는 simple gray 스킨 전용입니다. 다른 스킨에는 적용되지 않습니다. 티스토리에서 본문에 애드센스를 추가해주는 플러그인이 있지만, 반응형을 지원하지 않습니다. (왜 못하게 해놓은걸까요?) 이 글에선 간단한 편집으로 애드센스 추가 방법을 다루려고 합니다. 제목에서 본문 상/하단이라고는 했지만 실제 광고가 들어가는 부분은 다음과 같습니다. 플러그인을 사용해 광고를 넣으면 공감버튼과 CCL 아이콘 사이에 애드센스 광고가 추가되는데, 그렇게 넣기 위해선 jQuery 를 사용해야 하기에 설명을 다음 기회로 잠시 미뤄두겠습니다. 본론으로 돌아와, skin.html 파일의 129 ~ 131번째 줄을 보면 다음 소스가 있습니다. [#_article_rep_desc_#] 아래 처럼 div 를 추가해주..
티스토리/simple gray 2015. 11. 30. 17:36[gabriel] 2.0에 있던 상단 검색바를 3.0에 다는 방법
※ 이 가이드는 gabriel 스킨 전용입니다. 다른 스킨에는 적용되지 않습니다. Gabriel 스킨은 2.0 이던 시절엔 상단 메뉴 위쪽에 검색창이 있었습니다. 3.0 으로 패치되면서 없어졌는데요, 간단하게 다시 추가하는 방법을 소개합니다. ski.html 파일 편집 43번째 줄에 가 끝나는걸 알리는 가 있습니다. 그 바로 다음줄에 아래 소스를 추가해주세요. style.css 파일 편집 60번째 줄에 다음 소스가 있습니다. .header-wrap .nav ul li a:active { background-color: #fefefe; } 이 바로 다음줄에 아래 소스를 추가해주세요. .header-wrap .search-bar { position: absolute; top: -70px; right: 0; ..
티스토리/gabriel 2015. 10. 14. 19:42[simple gray 3.0] 블로그 가로 길이 변경 방법
※ 이 가이드는 simple gray 스킨 전용입니다. 다른 스킨에는 적용되지 않습니다. 현재 Simple Gray 3.0은 가로 길이가 다음과 같이 되어있습니다. 1. 총 가로길이 : 1000px 2. 본문 가로길이 : 780px 3. 사이드바 가로길이 : 200px #. 본문과 사이드바 사이 여백 : (총 가로길이) - (본문 + 사이드바) = 20px 크기를 조절하는 방법은 사람에 따라 여러 가지 방법이 있겠지만 저는 두 가지를 적어봅니다. 본문 크기 줄이고 사이드바 크기 늘리기 본문 크기를 700으로 줄이고, 사이드바 크기를 280으로 만들어 보겠습니다. #1. 본문 크기 줄이기 images 폴더 안을 보면 simplegray.css 파일이 있습니다. 그 파일을 편집기로 열고 79번째 줄에 있는 ..
티스토리/simple gray 2015. 10. 13. 20:56[gabriel] 블로그 배경 색상 변경 방법
Gabriel 3.0 이후 전체적인 코드가 바뀜과 동시에 블로그 색상을 변경하는 곳도 조금 바뀌었습니다. 총 다섯 군데의 배경색을 수정할 수 있습니다. (글자색 수정은 따로 작성하지 않겠습니다) 자 이제, 차근차근 알아볼까요? #1 헤더 배경색 변경 style.css 파일의 47번째 줄에 있는 #header { position: relative; padding: 130px 0 80px; background-color: #fff; } background-color: #fff;를 변경하면 됩니다. #2 타이틀바 배경색 변경 style.css 파일의 64번째 줄에 있는 .container-title { position: relative; padding: 60px 0 50px; color: #ddd; text-..
티스토리/gabriel 2015. 10. 13. 19:30