디스커스 커뮤니티 여러분께,
다들 잘 지내고 계신가요?
AI 페르소나(LLM GPT-4 Omni-Mini)를 갖춘 챗봇을 설정했고, 지금까지 정말 잘 작동하고 있습니다! 
하지만 고객들의 챗봇 이용률이 꽤 낮은 편입니다. 현재 봇과 채팅하려면 상단 바에 있는 작은 로봇 아이콘을 클릭해야 하는데, 이게 꽤 눈에 잘 띄지 않는 것 같습니다.
어디서 찾을 수 있는지 설명하는 주제를 만들었지만, 여전히 조금 숨겨져 있는 것처럼 보입니다. 화면 구석에 더 큰 챗 위젯 아이콘을 만들어 더 눈에 띄게 할 수 있는 방법이 있을까요?
헬프 스카우트(Help Scout)나 젠데스크(Zendesk) 통합에 대해 읽어봤지만, 추가 비용이나 번거로운 과정 없이 이미 디스커스에 있는 것을 사용하고 싶습니다.
팁이나 트릭이 있으시면 공유해 주실 수 있을까요? 주실 수 있는 모든 조언에 감사하겠습니다. 아직 이 모든 것에 익숙해지는 중이라 도움이 정말 많이 됩니다. 
감사합니다!
릴리, 정말 좋은 아이디어네요!
하지만 우리 포럼에는 별로 적합하지 않을 것 같아서 사이드바를 제거했어요. 화면이 덜 복잡해 보이도록 하려고요… 다른 대안을 찾지 못하면 다시 되돌릴 수도 있겠네요 
사이드바 대신 드롭다운 메뉴를 사용 중이라면, 거기에 넣을 수 있습니다.
물론이죠, 그렇게 할게요 
버튼 URL에는 /discourse-ai/ai-bot/conversations를 사용하고, 원하는 위치에 배치할 수 있습니다. 
제안해 주셔서 정말 감사합니다, Lily. 카테고리 위에 버튼을 추가하는 데 성공했고, 완벽하게 작동하고 있어요…
물론, 버튼을 조금 더 크게 만들고 싶긴 해요…
이 버튼에 제 이미지를 사용하려고 생각하고 있습니다(이미 제 테마에 이 이미지를 추가해 두었습니다). 하지만 컴포넌트 옵션(GitHub - literatecomputing/discourse-custom-components · GitHub)에서 이 커스텀 이미지를 아이콘으로 호출하는 방법을 모르겠어요.
또한 위치를 변경하는 방법도 모르겠네요… 테마 코드에서 커스텀 섹션을 만들어야 하는 걸까요?
챗봇 버튼을 이렇게 상상하고 있어요:
도와 주셔서 정말 감사드립니다!!!
여기저기 좀 알아본 끝에 ChatGPT 덕분에 거의 목표를 달성했어요 
Lily가 제안한 대로 버튼을 추가했고, 여기저기서 대안에 대해서도 꽤 시간을 들여 읽었습니다. 결국 ChatGPT에게 제가 테마에 업로드한 이미지를 기반으로 한 그런 버튼, 혹은 실제로는 떠다니는 "아바타"를 만드는 코드를 작성해 달라고 부탁했습니다.
혹시 나중에 다른 분들에게 도움이 될지도 모른다는 생각에 제가 사용하는 코드를 여기에 올립니다!
HTML:
<a id="chatbot-avatar" href="https://YOUR_URL_HEREs" title="AI chatbot">
<img src="https://YOUR_IMAGE_URL_HERE__" alt="Chatbot Avatar" />
<div class="tooltip">AI 챗봇과 대화를 시작하세요</div>
</a>CSS:
#chatbot-avatar {
position: fixed; /* 아바타 위치 고정 */
bottom: 50px; /* 페이지 하단과의 거리 */
right: 50px; /* 페이지 우측과의 거리 */
cursor: pointer; /* 마우스 오버 시 포인터로 변경 */
z-index: 1000; /* 아바타가 다른 콘텐츠 위에 오도록 설정 */
text-align: center; /* 툴팁 텍스트를 아바타 바로 아래 중앙 정렬 */
}
#chatbot-avatar img {
width: 200px; /* 필요에 따라 크기 조정 */
height: 200px; /* 필요에 따라 크기 조정 */
transition: transform 0.3s; /* 부드러운 호버 효과 */
}
#chatbot-avatar:hover img {
transform: scale(1.5); /* 호버 시 아바타를 약간 확대 */
}
.tooltip {
visibility: hidden; /* 기본적으로 숨김 */
width: 200px; /* 툴팁 너비 */
background-color: #000C34; /* 툴팁 배경색 */
color: #fff; /* 툴팁 텍스트 색상 */
text-align: center; /* 텍스트 중앙 정렬 */
border-radius: 5px; /* 둥근 모서리 */
padding: 8px; /* 툴팁 내부 여백 */
position: absolute; /* 절대 위치 지정 */
bottom: 220px; /* 아바타 위쪽 위치 */
right: 50%; /* 아바타와 중앙 정렬 */
transform: translateX(50%); /* 중앙 정렬을 위한 조정 */
opacity: 0; /* 기본적으로 투명 */
transition: opacity 0.3s; /* 부드러운 전환 효과 */
z-index: 999; /* 아바타 바로 아래에 배치 */
}
#chatbot-avatar:hover .tooltip {
visibility: visible; /* 툴팁 표시 */
opacity: 1; /* 완전히 보이도록 설정 */
}페이지에서 이렇게 보입니다. (텍스트 "AI 챗봇과 대화를 시작하세요"는 아바타에 마우스를 올렸을 때만 나타납니다.
아직 못 해본 것이 딱 하나 있습니다. 바로 이 버튼을 홈 페이지에서만 보이게 하는 것입니다. 현재는 AI 챗봇 토론 페이지를 포함한 모든 페이지에 나타나는데, 그곳에서는 분명히 중복되죠… 페이지를 식별하여 홈 페이지를 제외한 모든 곳에서 차단하는 스크립트를 추가하는 것 등을 시도해 봤지만, 아직 작동하지 않습니다. 내일 더 해볼 수 있을지 알아봐야겠어요!
