manifest / social / shoplic-floating-menu

쇼플릭 플로팅 메뉴

화면 오른쪽 하단에 나오는 플로팅 메뉴입니다.

by 쇼플릭 · github.com/shoplic-kr/shoplic-floating-menu · website

★ 0stars

Install

Download source zip No release zip yet

This is the repository archive. It installs, but the folder name will carry the branch suffix and updates will not flow.

Install straight from GitHub with WP-CLI:

wp plugin install https://github.com/shoplic-kr/shoplic-floating-menu/archive/refs/heads/main.zip

No built-in updater. New versions won't appear under Dashboard → Updates. Install new releases yourself, or let Git Updater track the repository.

Readme github.com/shoplic-kr/shoplic-floating-menu ↗

워드프레스용 심플한 플로팅 메뉴 플러그인입니다. 웹사이트 하단에 떠 있는 원형 버튼을 통해 소셜 미디어 링크 및 커스텀 메뉴 항목을 표시합니다.

주요 기능

플로팅 메뉴 — 화면 하단에 고정된 원형 버튼 클릭 시 메뉴 항목이 펼쳐집니다.
소셜 미디어 프리셋 — Instagram, KakaoTalk, TikTok, Twitter 아이콘을 원클릭으로 추가할 수 있습니다.
커스텀 메뉴 항목 — 아이콘, 라벨, URL을 자유롭게 설정할 수 있습니다.
드래그 앤 드롭 정렬 — 메뉴 항목의 순서를 드래그로 변경할 수 있습니다.
반응형 디자인 — 데스크톱/모바일 표시 여부를 개별 설정할 수 있습니다.
애니메이션 효과 — fade-in, slide-up, bounce 등 다양한 애니메이션을 지원합니다.
위치 및 스타일 커스터마이징 — 위치, 간격, 아이콘 크기, 배경색 등을 자유롭게 조정할 수 있습니다.

설치 방법

플러그인 파일을 /wp-content/plugins/shoplic-floating-menu/ 디렉토리에 업로드합니다.
워드프레스 관리자 페이지 > 플러그인 메뉴에서 쇼플릭 플로팅 메뉴를 활성화합니다.
관리자 사이드바의 플로팅 메뉴 메뉴에서 설정합니다.

사용 방법

메뉴 항목 추가

관리자 페이지 > 플로팅 메뉴로 이동합니다.
프리셋 버튼(Instagram, KakaoTalk 등)을 클릭하여 빠르게 추가하거나, 직접 항목을 생성합니다.
각 항목에 아이콘, 라벨, URL을 설정합니다.
새 탭에서 열기 여부를 선택할 수 있습니다.

설정 옵션

옵션	설명	기본값
플러그인 활성화	플로팅 메뉴 표시 여부	활성화
위치	왼쪽 또는 오른쪽	오른쪽
하단 간격	화면 하단으로부터의 거리 (0-200px)	20px
좌우 간격	화면 측면으로부터의 거리 (0-200px)	20px
아이콘 크기	버튼 및 아이콘 크기 (30-100px)	54px
아이콘 색상	메인 버튼 및 메뉴 항목 배경색	#A886CD
데스크톱 표시	데스크톱에서 표시 여부	표시
모바일 표시	모바일에서 표시 여부	표시
애니메이션	메뉴 열림 애니메이션 효과	fade-in

프로젝트 구조

shoplic-floating-menu/
├── assets/
│   ├── css/
│   │   ├── admin.css            # 관리자 페이지 스타일
│   │   └── frontend.css         # 프론트엔드 위젯 스타일
│   ├── images/                  # 소셜 미디어 기본 아이콘
│   └── js/
│       ├── admin.js             # 관리자 페이지 스크립트
│       └── frontend.js          # 프론트엔드 위젯 스크립트
├── inc/
│   ├── class-admin.php          # 관리자 패널 로직
│   ├── class-frontend.php       # 프론트엔드 렌더링 로직
│   └── class-menu-items.php     # 메뉴 항목 관리 클래스
├── views/
│   ├── admin-settings.php       # 관리자 설정 페이지 템플릿
│   └── frontend-widget.php      # 프론트엔드 위젯 템플릿
├── bootstrap.php                # 플러그인 초기화
├── shoplic-floating-menu.php    # 플러그인 메인 파일
└── README.md

기술 스택

PHP 5.6+ (WordPress Plugin API)
JavaScript (jQuery, jQuery UI Sortable)
CSS3 (애니메이션, 반응형 디자인)
WordPress Media Uploader, Color Picker

데이터 저장

모든 설정은 워드프레스 wp_options 테이블에 sfm_ 접두사로 저장됩니다.

옵션 키	설명
`sfm_menu_items`	메뉴 항목 배열
`sfm_position`	위치 (left/right)
`sfm_bottom_spacing`	하단 간격
`sfm_side_spacing`	좌우 간격
`sfm_icon_size`	아이콘 크기
`sfm_icon_color`	아이콘 배경색
`sfm_show_on_desktop`	데스크톱 표시 여부
`sfm_show_on_mobile`	모바일 표시 여부
`sfm_animation`	애니메이션 종류
`sfm_is_active`	활성화 여부

보안

AJAX 요청 시 Nonce 검증
권한 확인 (manage_options, upload_files)
모든 사용자 입력에 대한 이스케이프 및 새니타이징 처리
직접 파일 접근 방지

라이선스

GPL v2 or later

개발

Author: 쇼플릭
Plugin URI: https://shoplic.kr