Blog 꾸미기
티스토리 본문 광고 삽입 방법
본문 상단에 양쪽으로 정렬 [예제1]
[ ##_article_rep_desc_## ]을 찾아 상단에 아래 소스 입력하고 <!-- 광고 코드 삽입 -->문구 아래 본인의 애드센스나 리더스타임 광고 코드를 입력하면 된다.
<table wdith="100%" align="center" cellspacing="0" cellpadding="5" table="">
<tbody>
<tr>
<td width="50%" align="center" style="magin:15px; padding:15px;">
<!-- 광고 코드 삽입-->
</td>
<td width="50%" align="center" style="magin:15px; padding:15px;">
<!-- 광고 코드 삽입-->
</td>
</tr>
</tbody>
</table>
[ ##_article_rep_desc_## ]
magin과 padding의 값은 사용자의 값으로 조정하면 위치가 조정 된다.
본문 상단에 양쪽으로 정렬 [예제2]
[ ##_article_rep_desc_## ]을 찾아 상단에 아래 소스 입력하고 <!-- 광고 코드 삽입 -->문구 아래 본인의 애드센스나 리더스타임 광고 코드를 입력하면 된다.
<div style="margin:15px 0px 0px 0px; padding: 0px;">
<ul style="margin: 0px; padding: 0px; overflow: hidden;">
<li style="list-style: none; padding: 15px 0px 10px; border: 1px solid; border-image: none; border-radius: 5px; width: 49.5%; text-align: center; float: left;">
<!-- 광고 코드 삽입 -->
</li>
<li style="list-style: none; padding: 15px 0px 10px; border: 1px solid; border-image: none; border-radius: 5px; width: 49.5%; text-align: center; float: right;">
<!-- 광고 코드 삽입 -->
</li>
</ul>
</div>
[ ##_article_rep_desc_## ]
본문 하단에 양쪽으로 정렬 [예제]
[ ##_article_rep_desc_## ]을 찾아 하단에 아래와 같이 소스를 입력하면 된다.
[ ##_article_rep_desc_## ]
<div style="margin:15px 0px 0px 0px; padding: 0px;">
<ul style="margin: 0px; padding: 0px; overflow: hidden;">
<li style="list-style: none; padding: 15px 0px 10px; border: 1px solid; border-image: none; border-radius: 5px; width: 49.5%; text-align: center; float: left;">
<!-- 광고 코드 삽입 -->
</li>
<li style="list-style: none; padding: 15px 0px 10px; border: 1px solid; border-image: none; border-radius: 5px; width: 49.5%; text-align: center; float: right;">
<!-- 광고 코드 삽입 -->
</li>
</ul>
</div>
상단에 좌측이나 우측에 하나를 넣는 방법 [예제1]
[ ##_article_rep_desc_## ]을 찾아 상단에 아래와 같이 소스를 입력하면 된다.
<p style="text-align:justify;">
<div style="float:right; margin: 10px;">
<!-- 광고 코드 삽입 -->
</div>
[ ##_article_rep_desc_## ]
속성을 좀 살펴보면 "float:right"로 입력시 광고는 오른쪽에 위치하고, left로 입력시 광고는 왼쪽에 위치한다.
추가로 광고에 테두리를 넣고 싶다면 아래와 같이 코드를 넣으면 된다. 여기서 2px는 테두리의 두께를 설정한 것인데 상하좌우 선택적으로 입력이 가능하다. solid는 테두리 선의 형태를 설정한 것이며, #cccccc는 색상 설정으로 색상코드는 rgb 등으로도 설정이 가능하며 투명은 transparent로 입력하면 된다. 마지막으로 광고의 테투리의 여백을 안과 밖으로 설정할 수 있는데 안쪽 여백은 padding 코드를 넣어 값을 주고 바깥쪽 여백은 margin 코드를 넣어 값을 주면 된다. padding과 margin 모두 상하좌우로 값을 설정 할 수 있다.
상단에 좌측이나 우측에 하나를 넣는 방법 [예제2]
<div style="float:left; border: 2px solid #ccc; padding: 2px; margin: 0 0 5px 5px;">
<!-- 광고 코드 삽입 -->
</div>
[ ##_article_rep_desc_## ]
광고를 삽입하는데는 여러가지 방법과 코드가 존재하므로 원하는 소스를 찾아 블로그 이미지에 적합하게 꾸미면 되겠다.
그리고 생성 광고의 사이즈에 따라 광고틀을 리사이징해서 적용하면 되니 그렇게 어려운 작업은 아닌듯 하다.
'Daily Life > Blog' 카테고리의 다른 글
블로그 타이틀 폰트 CSS 적용하기 (0) | 2015.04.07 |
---|---|
무료웹폰트::한국형폰트어썸::한국형무료폰트아이콘::액시콘 (2) | 2014.12.04 |
티스토리 초대장 배포 2차 [종료] (21) | 2014.09.02 |
티스토리 초대장 배포 1차 [종료] (20) | 2014.07.18 |
색상표::색상이름::색상코드::색상태그 (16) | 2014.03.20 |
Html/CSS border 속성(테두리 선 점선 파선 이중선 입체선) (4) | 2014.03.19 |
폰트어썸::폰트어썸그래프 (0) | 2014.03.11 |
아이프레임 삽입 블로그 포스팅 (0) | 2014.02.06 |