종이우비님 설정 방법이 두가지가 있는데
하나는 아래의 링크 간편 생성 들어가서 옵션 조절 해서 사용 하는 법(쉽고 빠름)
또 하나는 직접 CSS 수정해서 적용(글자사이 간격, 폰트 크기 등 자세히 설정 가능)
일단 가장 기초
https://chzzk-api.ddutto.com/chat/c7323bedccf4abf257c1ce1f465c4707?setting=twitch:whdakfaos
이 링크를 OBS 채팅 오버레이에 적용 시키고 링크 뒤에
,platform-badge / ,darkmode / ,font:[폰트이름] 등 추가해서 설정 가능
1번 방법으로 할거면 링크 들어가서 원하는 옵션 고르고 설정
여기 들어가서 원하는 대로 옵션 선택해서 링크 만들고 OBS에 추가가능
간편 생성 예시)
(낭루 채널 아이디 넣어서 뽑은거라 링크 넣으면 바로 적용 될거임)
두번째 방법은 OBS - 원래 쓰던 채팅창 - 우클릭 - 속성 들어가서 아래로 내려보면 사용자 지정 CSS라는 부분이 있음
@font-face {
font-family: 'Noto Sans KR', sans-serif;
font-weight: 400;
src: url(https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300&display=swap);
}
@font-face {
font-family: 'Noto Sans KR', sans-serif;
font-weight: 700;
src: url(https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@700&display=swap);
}
* {
font-family: 'Noto Sans KR', sans-serif;
text-shadow: rgb(0, 0, 0) 2px 0px 0px, rgb(0, 0, 0) 1.75517px 0.958851px 0px, rgb(0, 0, 0) 1.0806px 1.68294px 0px, rgb(0, 0, 0) 0.141474px 1.99499px 0px, rgb(0, 0, 0) -0.832294px 1.81859px 0px, rgb(0, 0, 0) -1.60229px 1.19694px 0px, rgb(0, 0, 0) -1.97998px 0.28224px 0px, rgb(0, 0, 0) -1.87291px -0.701566px 0px, rgb(0, 0, 0) -1.30729px -1.5136px 0px, rgb(0, 0, 0) -0.421592px -1.95506px 0px, rgb(0, 0, 0) 0.567324px -1.91785px 0px, rgb(0, 0, 0) 1.41734px -1.41108px 0px, rgb(0, 0, 0) 1.92034px -0.558831px 0px;
font-size: 14px;
}
거기에 위에꺼처럼 본인이 원하는 설정값들 수정하면서 바꾸면 댐
다른거 하다가 급하게 쓰는거라서 설명이 많이 부족할수 있어서 잘 모르겠거나 궁금한거 있으면 언제든지 물어봐줘
---------------------------------------------------------------------------------------------------------------------------------
원래 쓰던 채팅창 설정 가져오는 법
1. 본인의 트윕 채팅창 링크로 들어간다
2. F12를 눌러서 개발자 도구를 열고 콘솔 탭 클릭
3.
console.log(document.querySelector("#chatbox_style").textContent);
이 명령어 입력 후 엔터
4. 나온 값을 복사해서 OBS에 CSS에 붙여넣기
5. 제일 아랫쪽에
body { background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; }
붙여넣기
이렇게 하면 원래 쓰던 트윕 채팅창 설정 가져와 진다네
