쇼츠 패널 설정

FLICK 패널은 게시글을 보여주는 9:16 스테이지와, 스타일을 조절하는 컨트롤 패널로 나뉩니다.

데스크톱에서는 컨트롤 패널이 스테이지 오른쪽에 붙고, 좁은 화면에서는 하단에 배치됩니다.

편집 가능한 영역

영역	동작
제목	클릭해서 바로 수정할 수 있습니다
본문 텍스트 블록	추출된 텍스트 블록을 직접 수정할 수 있습니다
이미지/영상	원본 순서대로 표시되며 텍스트 편집 대상은 아닙니다

본문 텍스트는 plaintext-only 편집 영역으로 처리됩니다. 붙여넣기할 때도 일반 텍스트만 들어가서 원본 페이지의 불필요한 HTML 스타일이 섞이지 않습니다.

글자와 폰트

컨트롤 패널에서 제목과 본문을 따로 조절할 수 있습니다.

설정	범위 / 방식
제목 크기	12px ~ 72px
본문 크기	12px ~ 36px
제목 폰트	기본 프리셋 또는 브라우저가 허용한 로컬 폰트
본문 폰트	기본 프리셋 또는 브라우저가 허용한 로컬 폰트

브라우저가 queryLocalFonts()를 지원하고 사용자가 권한을 허용하면, 로컬에 설치된 폰트도 선택 목록에 추가됩니다. 지원하지 않는 브라우저에서는 기본 프리셋만 사용합니다.

강조와 색상

제목 텍스트를 드래그하면 선택한 강조색이 적용됩니다.

설정	설명
강조색	제목 드래그 강조에 사용할 색상
제목 강조해제	제목 안의 강조 표시를 모두 제거
위	헤더 영역 배경색
아래	푸터 영역 배경색

위/아래 영역 색상에 맞춰 텍스트 색은 자동으로 읽기 좋은 색으로 조정됩니다.

전체 배경

전체 배경 버튼으로 쇼츠 패널 전체에 배경 이미지를 넣을 수 있습니다.

항목	기준
파일 형식	이미지 파일
원본 크기 제한	6MB 이하
내부 변환	긴 변 기준 최대 1600px, JPEG 품질 0.84
권장 크기	1600 x 900
저장 한도	변환된 data URL 약 2,500,000자 이하

배경은 cover 방식으로 스테이지 전체에 적용됩니다. 배경선명도 슬라이더는 0% ~ 100% 범위이며, 낮출수록 흰색 오버레이가 더 강해져 본문이 더 잘 보입니다.

9:16 가이드라인

최근 버전에서는 기존 safe area 표현을 사용자-facing 문구에서 가이드라인으로 정리했습니다.

설정	설명
가이드라인	9:16 안전 영역을 점선으로 표시합니다
가이드라인 안에 맞추기	본문 패딩을 늘려 텍스트가 가이드라인 안쪽에 들어오게 합니다

두 설정은 서로 독립적으로 동작합니다. 가이드라인을 보지 않아도 본문을 안쪽으로 맞출 수 있고, 본문을 맞추지 않은 채 가이드라인만 볼 수도 있습니다.

저장되는 설정

FLICK은 컨트롤 패널에서 바꾼 값을 브라우저 LocalStorage에 저장합니다.

Key	설명
flick:titleFontSize	제목 크기
flick:contentFontSize	본문 크기
flick:headerHeight	위쪽 영역 높이
flick:footerHeight	아래쪽 영역 높이
flick:highlightColor	제목 강조색
flick:headerBg	위쪽 영역 배경색
flick:footerBg	아래쪽 영역 배경색
flick:viewerBgImage	전체 배경 이미지
flick:viewerBgVisibility	배경선명도
flick:safeArea	가이드라인 표시 여부
flick:safeFit	본문을 가이드라인 안쪽에 맞출지 여부
flick:titleFont	제목 폰트
flick:contentFont	본문 폰트

flick:bodyBgImage는 이전 배경 저장 키입니다. 현재 버전에서는 새 배경 키를 쓰며, 열릴 때 레거시 키를 제거합니다.

초기화

설정을 초기화하려면 브라우저 개발자 도구의 Application 탭에서 해당 사이트 LocalStorage를 열고 flick:으로 시작하는 키를 삭제하면 됩니다.