Post


유튜브 채팅창이 2017년 1월 7일인가 바뀌면서 기존에 쓰시던 분들

투명화가 안돼셨을 겁니다. 그래서 새롭게 들고 왔습니다~


OBS 유튜브 채팅창 투명 css 


적용하는 방법은 기존에 제가 올렸던 포스팅 글을 보시면 되시고 쓸줄 아시는 분들은 제가 올린 파일 받으셔서

복사하기 붙여넣기하시면 바로 적용이 됩니다.


@import url("https://fonts.googleapis.com/css?fami...");

@import url("https://fonts.googleapis.com/css?fami... One");

@import url("https://fonts.googleapis.com/css?fami...");

@import url("https://fonts.googleapis.com/css?fami...");


body {

background-color: transparent !important;

}


/* Transparent background. */

yt-live-chat-renderer {

background-color: transparent !important;

}


/* Outlines */

yt-live-chat-renderer * {

text-shadow: -2px -2px #000000,-2px -1px #000000,-2px 0px #000000,-2px 1px #000000,-2px 2px #000000,-1px -2px #000000,-1px -1px #000000,-1px 0px #000000,-1px 1px #000000,-1px 2px #000000,0px -2px #000000,0px -1px #000000,0px 0px #000000,0px 1px #000000,0px 2px #000000,1px -2px #000000,1px -1px #000000,1px 0px #000000,1px 1px #000000,1px 2px #000000,2px -2px #000000,2px -1px #000000,2px 0px #000000,2px 1px #000000,2px 2px #000000;

font-family: "Laila";

font-size: 18px !important;

line-height: 18px !important;

}


yt-live-chat-text-message-renderer #content,

yt-live-chat-legacy-paid-message-renderer #content {

overflow: initial; !important

}


/* Hide scrollbar. */

yt-live-chat-item-list-renderer #items{

overflow:hidden !important;

}


/* Hide header and input. */

yt-live-chat-header-renderer,

yt-live-chat-message-input-renderer {

display: none !important;

}


/* Reduce side padding. */

yt-live-chat-text-message-renderer,

yt-live-chat-legacy-paid-message-renderer {

padding-left: 4px !important;

padding-right: 4px !important;

}


/* Avatars. */

yt-live-chat-text-message-renderer #author-photo,

yt-live-chat-legacy-paid-message-renderer #author-photo { width: 25px !important;

height: 25px !important;

border-radius: 25px !important;

margin-right: 6.25px !important;

}


/* Hide badges. */

yt-live-chat-text-message-renderer #author-badges {

display: none !important;

vertical-align: text-top !important;

}


/* Timestamps. */

yt-live-chat-text-message-renderer #timestamp { color: #999999 !important;

font-family: "Imprima";

font-size: 16px !important;

line-height: 16px !important;

}


/* Badges. */

yt-live-chat-text-message-renderer #author-name[type="owner"],

yt-live-chat-text-message-renderer yt-live-chat-author-badge-renderer[type="owner"] {

color: #28a5bc !important;

}


yt-live-chat-text-message-renderer #author-name[type="moderator"],

yt-live-chat-text-message-renderer yt-live-chat-author-badge-renderer[type="moderator"] {

color: #0000a0 !important;

}


yt-live-chat-text-message-renderer #author-name[type="member"],

yt-live-chat-text-message-renderer yt-live-chat-author-badge-renderer[type="member"] {

color: #00ffff !important;

}


/* Channel names. */

yt-live-chat-text-message-renderer #author-name {

color: #00ff40 !important;

font-family: "Abel";

font-size: 20px !important;

line-height: 20px !important;

}


yt-live-chat-text-message-renderer #author-name::after {

content: ":";

margin-left: 2px;

}


/* Messages. */

yt-live-chat-text-message-renderer #message,

yt-live-chat-text-message-renderer #message *,

yt-live-chat-legacy-paid-message-renderer #detail-text,

yt-live-chat-legacy-paid-message-renderer #detail-text * {

color: #ffffff !important;

font-family: "Laila";

font-size: 18px !important;

line-height: 18px !important;

}



/* Fan Funding Messages. */

yt-live-chat-legacy-paid-message-renderer #event-text {

color: #ffffff !important;

font-family: "Changa One";

font-size: 20px !important;

line-height: 20px !important;

}


yt-live-chat-legacy-paid-message-renderer #detail-text,

yt-live-chat-legacy-paid-message-renderer #detail-text * {

color: #ffffff !important;

font-family: "Imprima";

font-size: 18px !important;

line-height: 18px !important;

}


yt-live-chat-legacy-paid-message-renderer {

background-color: #00ffff !important;

margin: 4px 0 !important;

padding: 4px !important;

}


yt-live-chat-text-message-renderer a,

yt-live-chat-legacy-paid-message-renderer a {

text-decoration: none !important;

}


yt-live-chat-text-message-renderer[is-deleted],

yt-live-chat-legacy-paid-message-renderer[is-deleted] {

display: none !important;

}





위 스샷은 채팅 css만 테스트한거라 검은화면이긴 한데 잘 적용되어있죠? ㅎㅎ


그럼 열심히들 방송 하시기 바랍니다~


이 글이 도움이 됐다면 배너 클릭같은거 한번씩이라도 해주세요 1초면 가능하고 저에게는 약 10원? 정도의 도움이 됩니다


new chat.txt



유튜브 채팅 투명화

유튜브 채팅 css

youtube chat css

youtube chats css

obs youtube chat css


  1. 포니엑스 2017.01.08 11:24 신고
    고맙습니다 ㅎㅅㅎ.. 찾고있었는뎅
  2. 케빈 2017.01.08 16:33 신고
    글자크기 어떻게 키우나요?
    1. GzE 2017.01.08 17:18 신고
      font size 부분 조절해보세요
  3. 쌀쌀 2017.01.15 02:33 신고
    채팅창에 채팅이 계속 화면에 남아있는데 일정 시간 뒤에 사라지게 하는건 어떻게 하는건가요?
    1. GzE 2017.01.15 16:42 신고
      그건 OBS에서 하는게 아니라 다른 프로그램을 이용해서 하는거에요
  4. 포니엑스 2017.01.31 15:16 신고
    ㅠㅠ 갑자기언제부턴가 오른쪽에 꼬투리부분 남더라구요.. 한번 확인 해주실수있으신가용?..
댓글쓰기 폼

▲ top