159

블로그에 채팅 기능 달기

현재 티스토리 블로그에 채널이라는 채팅 서비스를 달아놨는데, 어떻게 한건지 물어보신 분들이 몇분 계셔 포스팅으로 알려드리려 합니다.

다른 블로그도 다 비슷한 방법으로 되겠지만,

현재 티스토리 블로그를 운영중이니 해당 환경에서 하는 방법을 알려드리겠습니다.

우선 위의 링크를 따라 페이지에 접속합니다

회원 가입 후 로그인을 하고

왼쪽 아래의 톱니바퀴 설정버튼 > 플러그인 설정 탭에 들어가 새 플러그인 만들기 버튼을 누릅니다.

버튼 클릭 후 원하는 내용을 작성 후에 확인을 누릅니다.

플러그인 목록에서 코드보기 클릭 후 아래와 같은 창이 뜨면 클립보드 복사버튼을 클릭합니다.

티스토리 관리자 탭에서 HTML/CSS 편집을 눌러 들어간 뒤

command + f (윈도우는 컨트롤 f)로 </body>라고 검색하고 검색 결과 바로 윗 부분에 복사한 내용을 붙여넣기하고 저장!

끝입니다 ㅎㅎ 이해 안되시면 질문 주세요 / 다른 플랫폼도 비슷한 방법으로 진행하시면 됩니다.

3/159


  1. BlogIcon 해외 축구 중계 2018.05.10 17:26 신고

    오 이게 실제로 되는군요!
    덕분에 편하게 달고 갑니다!
    좋은 하루되세요!

159

나를 흔드는 15가지 트리거

  1. 내가 이해한다면, 나는 실제로 바뀔 것이다.
  2. 나는 의지력이 강해서 유혹에 굴복하지 않을 것이다.
  3. 오늘은 특별한 날이기 때문이다.
  4. 적어도 나는 누구보단 낫다.
  5. 나는 누구의 도움도 필요 없다.
  6. 난 지치지 않을 것이고, 열정은 사그라지지 않는다.
  7. 세상의 모든 시간은 나의 것이다.
  8. 내 정신은 산만해지지 않을 것이고, 예기치 못한 일은 일어나지 않을 것이다.
  9. 통찰의 순간이 와서 내 인생은 바뀔 것이다.
  10. 내 변화는 영구적이니 다시 걱정 할 필요가 없다.
  11. 이전 문제를 해결하면 새 문제가 생기지 않을 것이다.
  12. 나는 노력한 만큼 정당한 대가를 얻을 것이다.
  13. 누구도 내게 관심을 기울이지 않는다.
  14. 내가 변한다면 그건 진짜 내가 아니다.
  15. 난 내 행동을 평가할 수 있을 정도의 지혜는 갖고 있다.

위의 15가지는 Trigger라는 책에서 소개한 내용이다.

매일매일 읽으면서 리마인드하면 자기계발하는데 도움을 줄 수 있을 듯 하다.

2/159


  1. BlogIcon 핸드폰 내구제 2017.10.24 11:27 신고

    와 이거 진짜 좋은데요
    그 트리거 라는 책이 국문으로
    되어있는건가요 함 읽어봐야겠네요

HTML5에서의 시맨틱 웹과 시맨틱 태그(Semantic Web, Semantic tag)

시맨틱 웹이란?

구글에 검색했을때 위키백과에 나오는 내용을 그대로 적어보면 아래와 같다.

시맨틱 웹(Semantic Web)은 '의미론적인 웹'이라는 뜻으로,

현재의 인터넷과 같은 분산환경에서 리소스에 대한 정보와 자원 사이의 관계의미 정보를 기계가 처리할 수 있는 온톨로지 형태로 표현하고,

이를 컴퓨터가 처리하도록 하는 프레임워크이자 기술이다.

웹의 창시자인 팀 버너스리가 1998년 제안했고 현재 W3C에 의해 표준화 작업이 진행 중이다.

쉽게 생각하면 첫 줄만 읽으면 된다.

의미론적인 웹은 말 그대로 컴퓨터가 웹사이트를 단순한 코드의 구성이 아닌 의미를 가진 사이트라는걸 알 수 있게 만드는 것이다.

시맨틱 웹의 이상향은, 인터넷에 방대한 양의 데이터를 컴퓨터가 자동으로 해석해 사용자가 원하는 결과값을 정확히 주는 것이다.

여기까지 읽었을 땐 단순히 검색엔진 성능 향상에만 유용하게 쓰일 것 같지만, 찾아보니 암 치료 증진에도 기여할 수 있고, 석유가스 산업에도 응용될 수 있으며, 이외에도 많은 기업에서 사용할 수도 있다고 한다.(어떻게 이런 결과가 도출된건지는 잘모르겠다ㅋㅋ)

크게 생각 했을때 데이터들을 관리하고 통합하는 것이기 때문에 위와 같은 기대를 하는 것 같다.

HTML5에서의 시맨틱 웹

HTML5 이전까지는 시맨틱 태그라는 것이 없었다.

그 때의 대부분의 태그는 <div>로 감싸져 있었을텐데,

개발자의 입장에서는 코드로 사이트 전체 구조를 한눈에 파악하기 힘들었을 것이고, 검색 엔진은 사이트의 의미를 정확히 파악하지 못해 검색 결과값의 정확도가 떨어졌을 것이다.

그래서 나온 대안이 시맨틱 웹이고, 그에 따라서 HTML5에서 시맨틱 태그(Semantic tag)라는 것이 나온 것이다.

예를 들어 설명하면

기존에는 <div class="header">헤더입니다</div> 이렇게 썼던걸,

<header>헤더입니다</header> 이런식으로 쓰는 것이다.

<div>태그, <header>태그 둘 다 구역을 나눌 때 쓰는 껍데기 태그인데 둘의 차이는 의미를 가지고 있는지의 차이이다.

태그 이름 그대로 헤더부분을 <header>태그로 감싸는 것이다.

위와같이 div를 대체할 수 있는 태그로 header, nav, article, section, aside, footer가 나왔고, 각각 의미에 맞게 사용하면 된다.

위 태그들은 HTML5 이전에 div태그에서 클래스 명으로 많이 쓰던 것들을 토대로 만들었다고 한다.

결론

안써도 겉으로 보이기엔 똑같지만 검색 엔진 최적화(SEO)에서 중요한 역할을 하기 때문에 검색결과에서 상단을 차지하고 싶다면, 쓰는것을 습관화 하는 것이 좋다.

끝!

2/159

+ Recent posts