'tistory font color'에 해당되는 글 1건
- 2015.03.26 Tistory Skin, HTML, CSS 설정
원래는 무료 호스팅 업체를 통해 XE로 개인 블로그를 운영하였지만
감사하게도(?) 무료 호스팅에서 제공해줄 수 있는 서비스의 수준을 넘어서 쫒겨났다.
그래서 선택한 것이 이 Tistory.
나중을 위해 Tistory 에서 내가 설정한 것들을 기록하려 한다
1. Skin
스킨명 : Divergence(Mint)
스킨 위자드로 변경
배경 : 색상
타이틀 : 패턴
제목 및 게시글 : 글꼴, 글자색
글영역 넓이 : 900px (헌데 기본 본문 가로 사이즈가 824px 이라 변경이 될지는 모르겠다.)
2. CSS
1) 게시글의 줄간격이 너무 좁아 p 태그에 css를 줬다.
HTML/CSS - style.css - /* 본문 */
.article,
.article p { line-height: 170%; }
a:hover {text-decoration: underline; }
*
.article p { line-height: 170%; } 추가
2) 본문의 링크 색이 잘 보이지 않아 a 태그의 색을 노란색으로 변경하였다.
HTML/CSS - style.css - /* 공통요소 */
a {color: #ffcc00; text-decoration: none; }
a:hover {text-decoration: underline; }
*
#415360 -> #ffccoo 으로 변경
3) 카테고리의 글씨가 잘 보이지 않아 글씨 색 변경
HTML/CSS - style.css - /* 본문 */
.article_head .title {display: inline; color: #ffffff; line-height: 1.2em; padding: 0 0 0
*
#181818 -> #ffffff 으로 변경
4) 글 아래 태그 글씨 색 변경
HTML/CSS - style.css - /* 본문 */
.article_tag a {color: #FCEEFD; }
*
#2d353b -> #FCEEFD 으로 변경
3. HTML
1) 카테고리 밑 글들도 색이 잘 안보인다. CSS 로 수정하려 했으나 잘 모르겠어서 HTML 안에 font 태그를 넣어 수정했다.
HTML/CSS - skin.html
<ol class="article_post">
<s_list_rep>
<li>
<span class="date"><font color=#FCEEFD>##_list_rep_regdate_##</span>
<span class="title">
<a href="##_list_rep_link_##"><font color=#FCEEFD>##_list_rep_title_##</a>
<span class="count">##_list_rep_rp_cnt_##</font></span>
</span>
</li>
</s_list_rep>
</ol>
*
각각의 ##_list_rep_regdate_## & ##_list_rep_title_## & ##_list_rep_rp_cnt_## 를 font 태그로 감쌌다.
각 ##변수## 앞 뒤로 대괄호가 있다는 것 주의! (본문에 나타나지 않음)
2) Google Analytics 사용 위한 코드 삽입
HTML/CSS - skin.html
<head>
<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-61222542-1', 'auto');
ga('send', 'pageview');
ga(‘set’, ‘&uid’, {{USER_ID}}); // 로그인한 User-ID를 사용하여 User-ID를 설정합니다.
</script>
*
head 태그 바로 밑에 태그 삽입하였다.
'Tistory' 카테고리의 다른 글
Tistory 에서 Markdown 문법으로 글 쓰기 (1) | 2016.12.21 |
---|---|
Tistory 에서 코드 예쁘게 출력하기 (1) | 2015.09.03 |
내 도메인을 Tistory 연결 (0) | 2015.03.27 |
Tistory에 Googld Adsense 광고 생성 (0) | 2015.03.27 |