티스토리11

• 

  티스토리 블로그 이미지에 마우스 올렸을때 어둡게 변하는 효과 적용하기 이미지에 마우스를 올렸을때 티스토리 블로그를 사용하면서 html로 여러가지 편집을 할 수 있다는것이 재미있기도하고 어렵기도 하였습니다. 기본제공스킨이나 다른 사용자분들이 올려주시는 스킨을 이것저것 사용해보고 나에게 맞는 스킨을 찾아가는것도 재미있죠. 오늘은 스킨의 기능중에 잘 구현되어있지않은 내 맘에 들게 변경해보는 기능중 이미지에 마우스를 올렸을때 약간 어둡게 변하는 모습을 구현하는 시간을 가져보겠습니다. 이 기능으로 이미지의 모습을 더 명확하게 표현하고 주목도 있게 바꿀 수 있어서 저는 만족중입니다.  📣 사이트 바로가기   어떻게 구현해야할까요? 이 기능을 구현하기 위해서는 간단하게 티스토리편집창중 꾸미기 → 스킨편집  →  html편집  →  CSS편집창 순서대로 이동하여 css편집창에 코드를 .. 블로그정보/티스토리블로그 2024. 8. 21.

• 

  티스토리 : <meta name="description"> 태그에 동일 설명문 발견문제 해결하는 방법 메타네임이 어쩌구? 네이버 서치어드바이저에 등록을 하고 관리를 하는 일은 블로거로써 꼭 해야하는 중요한 작업입니다. 여기서 저는 웹마스터도구 > 리포트 > 사이트진단페이지에서 태그에 동일 설명문 발견이라는 문제가 나타나 이를 해결하는 방법을 공유해보고자 합니다.  📣 네이버 서치어드바이저 바로가기   어디서 어떻게 해결해야할까? 네이버 서치어드바이저에서 저와 같은 문제가 있는지 살펴보기 위해서 먼저 링크버튼을 눌러 서치어드바이저로 이동해보세요. 네이버 서치어드바이저 바로가기   태그에 동일 설명문 발견  위의 메세지는 네이버가 웹페이지를 수집하는 도중에 여러개의 문서에서 같은 형식의 단어와 내용으로 작성된 제목이 여러가지로 관찰된다는 메세지였습니다. 해당 링크를 제공해주어서 하나씩 살펴보고 문제점을 찾.. 블로그정보/티스토리블로그 2024. 8. 21.

• 

  티스토리 블로그 : 모바일에서 표의 글자 크기 줄이는 꿀팁 코드 적용하기 표를 적용했는데 모바일에서는 글쎄... 블로그를 운영하면서 표를 글본문에 적용할 일이 생기곤합니다. 하지만 표를 내맘대로 다루기위해서는 html구조에 대해서 많이 이해하고 있어야하며 그때그때 변형하고 다듬는 일이 사실 많이 힘들죠. 표를 적용했다고 해도 PC의 브라우저상에서는 잘 보이고 깔끔히 정돈된듯하게 보이지만 모바일에서 글을 확인해보면 정말 맘에 안드는 경우가 종종 있습니다. 모바일에서는 특히나 글본문의 글자크기가 표의 글자크기가 동일하게 적용되어서 표가 찌그러지거나 글자의 줄이 여러줄로 변형되어서 PC에서 보던 표의 깔끔함이 없어지고 어지럽게 보이게 됩니다. 이를 해결하는 하나의 방법으로 모바일에서 접속했을때는 표안의 글자크기를 자동으로 줄여주어서 표가 더욱 깔끔하게 보이도록 만들 수 있는데요. .. 블로그정보 2024. 8. 5.

• 

  티스토리 블로그 소제목을 깔끔하고 눈에 띄게 꾸미는 간단한 방법 티스토리의 제목꾸미기 티스토리는 네이버 블로그와 달리 html을 편집하고 활용할 수 있어서 다양하게 꾸미고 변경하는것이 가능한 플랫폼입니다. 이를 활용해 나만의 개성을 나타내고 표현하는 방법을 찾아서 블로그를 더욱 예쁘고 실용적으로 사용하는 분들이 많이 있죠. 이미 많은 곳에서 사용중인 소제목꾸미는 방법중 제가 사용하는 디자인을 어떻게 적용하는지에 대해서 알려드릴까합니다. 소제목 꾸미는 방법 서식으로 만들기 아래의 캡처이미지를 보시면 지금 제 블로그에 적용중인 소제목의 스타일을 볼 수 있습니다. 제목을 박스형태로 감싸서 일반 글과 차이를 두며 색상의 변화로 눈에 띄게 만들어주죠. 모서리를 둥글게 표현하는것도 가능해 원하는 스타일로 만들 수 있다는것이 장점입니다. 그렇다면 위의 스타일로 꾸미려면 어떻게 적.. 블로그정보 2024. 2. 15.

• 

  티스토리블로그 이미지옆에 글쓰기하는 기본에디터 사용방법 전문적으로 보이게 이미지나오고 그아래에 글을 표시하는 방법이 일반적이라면 좌측이나 우측에 이미지를 배열하고 그 옆에 문장을 쭉쓰게되면 뭔가 뉴스기사처럼 전문적으로 보이는것 같고 멋있게 보일 수 있습니다. 배열하는것은 개인차와 취향의 차이도 있겠지만 티스토리에서는 이러한 이미지배열방법도 여러가지로 설정할 수 있게 기능을 제공하고 있어요. 아래의 글을 확인해보고 이미지를 배열해보세요. 전기자전거 고민중이시라면 이것부터 보는게 인지상정 78%할인중인 이 제품! 바로보기 ▼ 이미지 배열하기 먼저 글을 작성해야겠죠? 원하는 글내용을 열심히 작성해주세요. 아래의 캡처이미지는 예제를 위해서 한글입숨(의미없는 문장의 나열)으로 쓴글입니다. 이렇게 글을 작성한다음 이미지를 넣어야겠죠? 이미지열기를 하고 이미지가 본문에 .. 블로그정보 2023. 12. 11.

• 

  티스토리블로그 공감버튼 위에 공감유도하는 문구넣는 코드삽입하기 공감버튼 티스토리블로그의 글을 발행하고 나면 많은 분들이 공감과 댓글을 바라는 이유를 알고 계신가요? 티스토리에 있는 공감버튼은 다음의 메인에 올라갈수 있는 여지를 주는것으로 많은 공감을 받게되면 그만큼 노출이 많이되고 노출이 많이 된다면 방문자가 많아지는것도 당연한 순서겠죠? 그렇기때문에 많은 분들이 공감버튼을 눌러달라고 요청하는겁니다. 우리는 오늘 이 공감버튼위에 공감버튼을 눌러달라고 요청하는 문구를 예쁘게 넣는 작업을 해서 더욱 예쁘고 강조되는 문구 꾸미기를 해보겠습니다. 아니 바디프렌드의 레그넘 안마의자를 14%나 할인해준다고? ▼ 상단에 문구꾸미기 공감버튼 상단에 바로 위치하여 색상과 글자를 넣어서 글을 읽는분이 마지막에 한번더 생각나게 만들어줄 겁니다. 아래의 순서대로 따라해보세요. 1. 스킨.. 블로그정보 2023. 12. 4.

• 

  티스토리블로그 - 형광펜효과 주는 html소스코드 형광펜 효과 티스토리 블로그에 열심히 글작성하고 여러가지 유용한 글꾸미기나 스킨의 적용을 고려하고 있을텐데요. 이번시간에는 글본문에 유용하게 사용해볼 수 있는 형광펜효과를 적용하는 소스코드를 알려드리니 내 블로그에도 지금 바로 적용해보세요. 소스코드 확인 형광펜효과를 적용하면 아래의 글자처럼 밑줄이 표현됩니다. 굉장히 가독성 높고 예쁘지않나요? 이렇게 글에 밑줄을 그어서 형광펜처럼 보이는 효과의 소스코드를 복사해 내 블로그에 적용할 수 있습니다. 현재 적용되어 있는 코드에는 제목에 글자를 굵게하고 밑줄의 굵기와 색상을 조절할 수 있습니다. 필요없는 부분은 삭제하고 필요한 부분만 복사하여 적용하거나 색상등을 변경하여 사용해볼 수 있습니다. 형광펜 예제 제목란 제목란 제목란 제목란 위의 예제 소스코드 제목란.. 블로그정보 2023. 4. 25.

• 

  티스토리 블로그 - 본문에 광고배너 위아래 자동삽입하기 본문에 광고배너 삽입 블로그를 시작하고서 애드센스를 발급받거나 그외 다른 광고배너를 넣어 수익창출을 하고 싶은건 누구나 생각하는일일 것입니다. 광고배너를 글을쓸때마다 수동으로 넣어서 위치하는경우도 있지만 글만쓰면 자동으로 광고배너가 삽입되면 편리하겠죠? 이번에는 광고배너를 자동으로 삽입하는 방법을 알아볼거예요. 따라오세요~ 따라해보세요 먼저 티스토리 블로그의 설정을 변경하려면 항상 아래의 순서로 이동하는거 아시겠죠? 블로그관리자페이지 → 스킨편집 → html편집, CSS편집 (필요에 따라 선택) 광고배너 삽입의 경우에는 html편집창으로 이동을 해야합니다. html편집창의 아무곳에나 마우스로 왼클릭하고 난후 Ctrl+F 하여 article_rep_desc 를 검색합니다. 검색결과에 [＃＃_article_.. 블로그정보 2022. 5. 27.

• 

  티스토리 북클럽 스킨 사이드바 애드센스광고 고정하기 사이드바 광고고정 티스토리블로그를 운영하면서 광고를 집행하고 수익을 낼수가 있습니다. 많은 광고중에 가장 보편적으로 애드센스를 많이 사용하시죠. 애드센스광고를 글상단,중단,하단등으로 배열할 수 있고 그외에 사이드바등에 광고를 삽입할 수 있습니다. 이런 광고를 삽입하기에 광고효과를 높이려면 글을 읽는동안에도 계속해서 광고를 방문자에게 노출시켜야 효과가 높아지는것은 당연하겠죠? 그래서 많이 활용하는 방법이 사이드바에 삽입된 광고를 글을 올리거나 내려도 그자리에서 방문자에게 계속해서 광고배너가 보일 수 있게 고정하는것입니다. 티스토리에서 광고배너를 사이드바에서 고정하는방법을 간단하게 알아보고 적용하는방법을 한번 살펴보시고 따라해보세요. 따라해보세요 아래의 소스코드를 복사해주세요. HTML 삽입 미리보기할 수 .. 블로그정보 2022. 5. 13.

• 

  티스토리 - 대문이미지 본문에서는 안보이게 가리기 대문이미지 나는 안보이게 하고싶은데 티스토리의 대문이미지를 본문에서도 보이게 하고싶은분들이 있는 반면 다른분들은 썸네일에서만 보이고 본문에서는 안보이게 가려버리고 싶은분들이 있습니다. 이런분들을 위한 소스를 알려드릴께요. 이전 소스들이 안먹혀요 html모드에서 소스코드를 변경하는것은 맞지만 많은 분들이 블로그에 소개해주신 style="display:none" 코드는 더이상 적용이 되지않았습니다. 아무 티스토리의 로직이 변경된것 같다고 하네요. 그래서 다른 코드를 찾았습니다. 이 코드를 적용하시면 본문에 이미지는 사라지고 썸네일은 그대로 적용되는 것을 확인할 수 있습니다. 이런 제품은 어때요? 자기관리를 잘하면 인생이 바뀐다고 합니다. 오늘부터 책읽기에 도전해보세요. 참고하세요 이 글은 티스토리블로그 카테.. 블로그정보 2022. 5. 4.

• 

  티스토리 북클럽스킨 - 사이드에 자동목차만들기 사이드 자동목차 만들기 티스토리에서도 자동으로 작동하는 목차를 적용하고 싶었습니다. 이리저리 둘러보니 맘에 딱드는 자동목차가 있어 저처럼 헤매지마시라고 이렇게 글을 올려봅니다. 최대한 쉽게 따라하실수 있게 해보겠습니다. 아래의 사이트에서 소스와 파일을 제공하여 주기에 자동목차가 작동될 수 있습니다. 사이트 바로가기 순서대로 따라하기 💡 따라하기 1번 블로그관리화면 > 꾸미기 > 스킨편집 > html편집 사이에 소스코드를 삽입하세요. 아래의 캡처이미지와 같이 를 찾으시면 됩니다. 소스코드를 삽입하고 난후의 캡처이미지입니다. 💡 따라하기 2번 html편집창 > ctrl+f > 를 검색하여 위치를 찾아요. ​ 아래의 캡처이미지를 참고하셔서 위치를 찾아보세요. 의 위치를 찾을 수 있습니다. 소스코드를 입력한후의.. 블로그정보 2022. 4. 27.