본문 바로가기

각 종 it/티스토리 등 프로그래밍

플로팅 광고(배너) 함 달아보자. 2019/01/25 - [각 종 it] - 티스토리 같은 홈페이지에 플로팅 이미지를 넣고 크기 조절을.2019/02/07 - [각 종 it] - 티스토리 반응형 스킨 헤더(제목, 메뉴, 검색) 고정을 함 해 보자.2019/02/14 - [각 종 it] - 블로그든 뭐든 홈페이지에 BGM, 배경음악 넣어보자. 걍 유투브음악 전용 사이트를 팝업 시키는 방법임.위 이전 글들에서 이미 플로팅 기술을 소개한 적이 있고 이에 관한 기술의 지향점도 언급 한 적이 있다.이렇게 보니 플로팅 기술 하나로 참 많은 것을 할 수 있었다. 오늘은 수익과 관련한 플로팅 배너에 대해 이야기 하고자 한다.사실, 구글에드센스나 데이블 같은 곳에서 워낙 반응형 광고 지원을 잘 해 주기 때문에 홈페이지 양 옆에 여유가 없는 분들은 적용 ..
블로그든 뭐든 홈페이지에 BGM, 배경음악 넣어보자. 걍 유투브음악 전용 사이트를 팝업 시키는 방법임. 일전에 플로팅 기술을 본좌의 티스토리에 적용 한 적이 있다.2019/01/25 - [각 종 it] - 티스토리 같은 홈페이지에 플로팅 이미지를 넣고 크기 조절을.오른쪽 하단에 음악 아이콘에 음악과 관련 된 게시물을 링크 해 놓았었는데... 처음 방문하는 분들에게는 좋은 정보였을지도 모르나 재차 방문 하는 분들에게는 이미 아는 내용이기에 약간의 변화를 주기로 했다. 걍 유투브 기반의 음악 플레이어를 팝업으로 띄워버리자.게시물을 약간 내리면 음악아이콘이 나오는데, 잠시 눌러보자.하나의 사이트가 팝업으로 등장하지 않은가? 그게 바로 이 홈페이지의 BGM이다.기존에 검색하면 나오는 그런 흔하고 복잡한 방법이 아니다.그저 팝업으로 음악플레이어를 띄웠을 뿐이다. 다른 기존의 BGM에 비해 이 기술의 장점은- BGM..
티스토리 스킨 오류 수정-아이콘에 갑자기 글자가 뜨는 경우 티스토리를 열심히 가지고 놀다보면 이런 일이 생긴다.댓글 창 위치도 바꾸고 티스토리 댓글과 라이브러리 댓글 tab 기능도 좀 부여하다보니, 하단 이미지가 망가져 버렸다.이럴 때 어떻게 수리해야 할까? 가장 고지식한 방법은 f12기능키나 오클 뒤 '페이지소스'를 보는 것이다.크롬에서 f12를 누르면 해당 페이지의 소스를 볼 수 있는데 여기서 찾아야한다.빨간색으로 오류 난 곳을 표시 해 주면 고맙겠지만, 컴퓨터가 오류로 인식하지 않으니 고대로 화면에 출력 했을 것이고 고로 별도의 표시는 없다. 그저 '컨트롤 + f '단축키를 눌러 가장 눈에 띄는 글자를 기준으로 찾는 수 밖에... html은 구조, css는 디자인!아이콘과 글자가 겹친다는 것은 디자인이 망가졌다는 것이고 이는 css에 문제가 발생했다는 것이..
티스토리 반응형 스킨 헤더(제목, 메뉴, 검색) 고정을 함 해 보자. 얼마 전 플로팅 기술을 적용하고 다음으로 헤더를 고정시키려 검색 해 보았다.모두들 마크쿼리님을 언급하면서 숨겨진 코드를 풀어 고정시켜라고 가르쳐 준다....필자가 사용하는 스킨은 이 님 것인지도 모르겠고 그렇다하더라도 그 비밀 코드는 보이지 않았다.... 그러던 中 적용 가능성이 높은 이론을 발견하여 적용 해 보았다. html에 태그로 헤더부분과 콘텐츠 부분으로 나누고 각 태그에 id 명을 기입 한 뒤 이를 css에서 소환하여 속성을 지정 해 주면 된다.처음에는 css의 header부분의 position이라는 속성에 fixed;를 지정 해 보았지만 이 스킨에서는 header와 컨텐츠를 wrap으로 구현 해 놓아 헤더부분이 fixed;로 인해 레이아웃에서 공중으로 이동하고 컨텐츠가 그 빈 공간을 차지 해 ..
티스토리 같은 홈페이지에 플로팅 이미지를 넣고 크기 조절을. #플렉서블 디스플레이의 등장으로 노트북 화면 크기의 웹페이지의 인기가 상승 할지도 모르나 아직까지는 모바일이 시장 대부분을 차지하고 있다. 티스토리 같은 웹페이지를 운영하는데 있어 반응형을 선택한 이유도 여기서 기인한 것이다. pc환경에서 아무리 그럴싸하게 꾸며도 모바일에서는 느낌을 살릴 수 없기 때문이다.허나 이와는 반대로 일반 pc에서 보는 반응형웹페이지, 특히 티스토리의 cover 기능을 이용한 디자인은 어색하고 약간 통 빈 느낌을 가져 온다. 특히 가로가 긴 디스플레이를 가진 기기에서는 양쪽에 빈 공간이 생겨 더욱 이러한 느낌을 가져 다 준다. 그래서 플로팅 버튼과 add this를 추가 해 보았다.본디 플로팅 배너, 즉 고정형 광고를 올릴 생각이였으나 최대의 수익을 가져 다 주는 에드센스가 이를..

티스토리툴바