역할 및 그룹에 따라 사용자에게 HTML을 숨기도록 헬프 센터 테마를 수정합니다. 숨기려는 정보가 민감한 경우에는 사용자가 웹 브라우저에서 페이지 소스 보기 기능으로 전체 코드를 볼 수 있으므로 이 방법이 적합하지 않을 수 있습니다.
이 워크플로우는 다음 섹션으로 구성되어 있습니다.
옵션 1: 사용자의 역할에 따라 HTML 숨기기 또는 표시
아래의 코드 스니펫을 복사하여 home_page.hbs 파일의 첫 번째 CSS 기본서식 아래에 다음 코드를 삽입합니다. JS 기본서식 아래에 다음 코드를 삽입합니다. 아래의 코드 스니펫을 복사하여 home_page.hbs 파일의 첫 번째 CSS 기본서식 아래에 다음 코드를 삽입합니다. JS 기본서식 아래에 다음 코드를 삽입합니다. 이 예에서는 자세한 내용은 헬프 센터 테마 사용자 지정하기 문서를 참조하세요.<div class="anonymous">
<h1>Welcome Anonymous User!</h1>
</div>
<div class="end_user">
<h1>Welcome End-User!</h1>
</div>
<div class="agent">
<h1>Welcome Agent!</h1>
</div>
<div class="manager">
<h1>Welcome Manager!</h1>
</div>div.anonymous, div.end_user, div.agent, div.manager {
width: 100%;
text-align: center;
display: none;
}const anonymous = document.querySelector(".anonymous")
const end_user = document.querySelector(".end_user")
const agent = document.querySelector(".agent")
const manager = document.querySelector(".manager")
// Show div html based on role
if (HelpCenter.user.role=="anonymous"){
anonymous.style.display = "block";
}
if (HelpCenter.user.role=="end_user"){
end_user.style.display = "block";
}
if (HelpCenter.user.role=="agent"){
agent.style.display = "block";
}
if (HelpCenter.user.role=="manager"){
manager.style.display = "block";
}
옵션 2: 사용자의 그룹에 따라 HTML 숨기기 또는 표시
const user_group = document.querySelector(".user_group")
<div class="user_group">
<h1>Welcome to L2 Support!</h1>
</div>
div.user_group {
width: 100%;
text-align: center;
display: none;
}
'L2 Support'
를 사용자 그룹으로 바꿉니다.const groups = HelpCenter.user.groups;
for (let i = 0; i < groups.length; i++) {
if (groups[i].name == 'L2 Support' && groups[i].isActive == true) {
user_group.style.display = "block";
}
}