빵선배/HTML,CSS

HTML 실전에서 배운다#1 [티스토리 스폰서애드 광고달기!]

빵선배와빵이 2017. 11. 13. 21:43
728x90
SMALL

HTML 실전에서 배운다#1 [티스토리 스폰서애드 광고달기!]



크... 티스토리 시작한지 2주만에 광고가 들어왔네요... 

문제는 소귀에 경읽기... 포스팅 100개정도 하고 

html 공부해서 새로운 스킨도 만들고 티스토리를 새롭게 꾸며보려고 했는데...

졸지에 광고때문에 html을 공부하게 됬네요


기억에 남기려고 조금씩 html 지식을 보관해보려 합니다 ㅎㅎ

보통 다른 분들 html 자료는 차례대로 순차적으로 정리가 잘 되있는데 예정에 없던 포스팅이라서

그냥 실전에서 써먹기 위해서 사용해보겠슴둥 ㅎㅎ양해바람


우선 순서는 스폰서애드에서 연락이 와요! 마치 요정처럼 방명록에 글을 남겨두고 가시는데

스폰서애드에 직접 신청하고 심사를 거쳐 승인되면 

이렇게 표시 됩니다!


이제 광고를 등록하러 가야겠죠??

광고관리 클릭!



광고관리에서 광고를 생성하게 되면 소스를 받을 수 있습니다.

이때 가로형, 세로형을 정하게 되고 Mobile / PC 디바이스 크기등을 설정하게 됩니다.

Tip. 모바일 + PC동시에 하는 것이 있어요!

하는방법은 자세하게 나와있으니 따라하면 됩니다.


Q. 이 소스를 어디다 적어야 광고가 생성되나요?!


A.블로그 관리에서 HTML을 들어간 후 

728x90
SMALL

HTML 실전에서 배운다#1 [티스토리 스폰서애드 광고달기!]



크... 티스토리 시작한지 2주만에 광고가 들어왔네요... 

문제는 소귀에 경읽기... 포스팅 100개정도 하고 

html 공부해서 새로운 스킨도 만들고 티스토리를 새롭게 꾸며보려고 했는데...

졸지에 광고때문에 html을 공부하게 됬네요


기억에 남기려고 조금씩 html 지식을 보관해보려 합니다 ㅎㅎ

보통 다른 분들 html 자료는 차례대로 순차적으로 정리가 잘 되있는데 예정에 없던 포스팅이라서

그냥 실전에서 써먹기 위해서 사용해보겠슴둥 ㅎㅎ양해바람


우선 순서는 스폰서애드에서 연락이 와요! 마치 요정처럼 방명록에 글을 남겨두고 가시는데

스폰서애드에 직접 신청하고 심사를 거쳐 승인되면 

이렇게 표시 됩니다!


이제 광고를 등록하러 가야겠죠??

광고관리 클릭!



광고관리에서 광고를 생성하게 되면 소스를 받을 수 있습니다.

이때 가로형, 세로형을 정하게 되고 Mobile / PC 디바이스 크기등을 설정하게 됩니다.

Tip. 모바일 + PC동시에 하는 것이 있어요!

하는방법은 자세하게 나와있으니 따라하면 됩니다.


Q. 이 소스를 어디다 적어야 광고가 생성되나요?!


A.블로그 관리에서 HTML을 들어간 후 

이놈을 찾으세요! 처음에는 찾느라 애먹었습니다

그리고 광고 소스를 이놈 위에다 적으면 되요

Q. 아래에 적으면 어떻게 되는건가요??

A. 아래에 적으면 아래에 광고가 달리게 됩니다

저녀석을 기준으로 위아래로 나뉘게 되는거죠


이렇게하면

모바일


PC


이렇게 광고가 뜸이 보입니다!

(티스토리 앱에서는 보이지가 않는데... 왜 그런지 아시는분 댓글좀 ㅠㅠ 

이 부분은 공부해서 다시 포스팅해야겠습니다.)


html이랑 무슨상관임? 어차피 복붙이잖아! 


사실 오늘은 html에서 띄어쓰기 / 줄바꿈을 사용했습니다 두둥


띄어쓰기    

줄바꿈    <br>


이렇게 사용합니다. 이게 왜 필요하냐면 처음에

사이드바를 등록하게되면(지금 저의 스킨기준)



차이가 보이시나요??

중간으로 맞추고 싶어서 html을 공부하게 된 것입니다 ㅎㅎ 이러다보면 늘겠죠?


사이드바 등록하기!


마찬가지로 광고를 세로형으로 소스를 받습니다

그리고 

</s_sidebar_element> 

라는 걸 html에서 찾아야되요

가로형이랑 비슷하죠?

Tip. </s_sidebar_element>이라는게 엄청많아서 어디다가 적어야할 지 모르실 텐데

본인이 하고싶은 곳에서 저 문구 아래에 적어야합니다.

(저는 아래에 적으니 안나와서 저 문구 위에적음... 연유를 모르겠네요... 설명서에는 아래에 적으랬는데)

저 문구 있는 곳 계속 읽다보면 자세하게 나와있어요


제 사이드바를 보시면

카테고리 , 공지 , 링크, 검색창이렇게 순서 대로 되어 있어요

마찬가지로 html도 이렇게 되어있습니다.

그럼 검색창 다음 </s_sidebar_element>를 찾아서 이녀석 위에다가 소스를 적어주면 되겠죠??


그럼 사이드바가 달리게 되요!

사이드바 전체 소스 앞에 <br> &nbsp; 를 넣어주면 변화됨이 보일 겁니다

 저장누르고 확인하면서 하시길!


이상 HTML 실전에서 배운다 #1 포스팅을 마치겠습니다.

알려주고싶은 내용이나 혹은 어려운내용 있으시면 댓글로!

피드백은 언제나 환영입니다




빵선배.IT


728x90
LIST

이놈을 찾으세요! 처음에는 찾느라 애먹었습니다

그리고 광고 소스를 이놈 위에다 적으면 되요

Q. 아래에 적으면 어떻게 되는건가요??

A. 아래에 적으면 아래에 광고가 달리게 됩니다

저녀석을 기준으로 위아래로 나뉘게 되는거죠


이렇게하면

모바일


PC


이렇게 광고가 뜸이 보입니다!

(티스토리 앱에서는 보이지가 않는데... 왜 그런지 아시는분 댓글좀 ㅠㅠ 

이 부분은 공부해서 다시 포스팅해야겠습니다.)


html이랑 무슨상관임? 어차피 복붙이잖아! 


사실 오늘은 html에서 띄어쓰기 / 줄바꿈을 사용했습니다 두둥


띄어쓰기  &nbsp; 

줄바꿈    <br>


이렇게 사용합니다. 이게 왜 필요하냐면 처음에

사이드바를 등록하게되면(지금 저의 스킨기준)



차이가 보이시나요??

중간으로 맞추고 싶어서 html을 공부하게 된 것입니다 ㅎㅎ 이러다보면 늘겠죠?


사이드바 등록하기!


마찬가지로 광고를 세로형으로 소스를 받습니다

그리고 

</s_sidebar_element> 

라는 걸 html에서 찾아야되요

가로형이랑 비슷하죠?

Tip. </s_sidebar_element>이라는게 엄청많아서 어디다가 적어야할 지 모르실 텐데

본인이 하고싶은 곳에서 저 문구 아래에 적어야합니다.

(저는 아래에 적으니 안나와서 저 문구 위에적음... 연유를 모르겠네요... 설명서에는 아래에 적으랬는데)

저 문구 있는 곳 계속 읽다보면 자세하게 나와있어요


제 사이드바를 보시면

카테고리 , 공지 , 링크, 검색창이렇게 순서 대로 되어 있어요

마찬가지로 html도 이렇게 되어있습니다.

그럼 검색창 다음 </s_sidebar_element>를 찾아서 이녀석 위에다가 소스를 적어주면 되겠죠??


그럼 사이드바가 달리게 되요!

사이드바 전체 소스 앞에 <br> &nbsp; 를 넣어주면 변화됨이 보일 겁니다

 저장누르고 확인하면서 하시길!


이상 HTML 실전에서 배운다 #1 포스팅을 마치겠습니다.

알려주고싶은 내용이나 혹은 어려운내용 있으시면 댓글로!

피드백은 언제나 환영입니다




빵선배.IT


728x90
LIST

'빵선배 > HTML,CSS' 카테고리의 다른 글

티스토리에 폰트 추가하기~!(2)  (0) 2022.11.15
티스토리에 폰트 추가하기~!(1)  (0) 2022.11.15