mkdocs glightbox
mkdocs-glightbox-0.4.0
MkDocs 플러그인은 GLightbox와 함께 이미지 라이트박스를 지원합니다.
GLightbox는 모바일을 지원하는 순수 자바스크립트 라이트박스 라이브러리입니다.
MkDocs용 Material을 사용한 라이브 데모.
PyPI에서 플러그인 설치
pip install mkdocs-glightbox mkdocs.yml 플러그인 섹션에 glightbox 플러그인을 추가하세요:
plugins :
- glightbox앵커 태그의 이미지와 pymdown-extensions의 이모티콘 이미지를 제외한 모든 이미지는 라이트박스 효과에 자동으로 추가됩니다.
mkdocs.yml에 옵션을 전달하여 플러그인을 사용자 정의할 수 있습니다.
plugins :
- glightbox :
touchNavigation : true
loop : false
effect : zoom
slide_effect : slide
width : 100%
height : auto
zoomable : true
draggable : true
skip_classes :
- custom-skip-class-name
auto_caption : false
caption_position : bottom
background : white
shadow : true
manual : false| 옵션 | 기본 | 설명 |
|---|---|---|
| 터치내비게이션 | 진실 | 터치 탐색(스와이프)을 활성화 또는 비활성화합니다. |
| 고리 | 거짓 | 끝에 루프 슬라이드가 있습니다. |
| 효과 | 줌 | 라이트박스 열기 효과의 이름입니다. (줌, 페이드, 없음) |
| 슬라이드_효과 | 슬라이드 | 라이트박스 슬라이드 효과의 이름입니다. (슬라이드, 줌, 페이드, 없음) |
| 너비 | 자동 | 인라인 요소 및 iframe의 너비입니다. 전체 폭에 대해 90% 또는 100vw와 같은 모든 단위를 사용할 수 있습니다. |
| 키 | 자동 | 인라인 요소 및 iframe의 높이입니다. 예를 들어 90%, 100vh 또는 자동과 같은 모든 단위를 사용할 수 있습니다. |
| 확대/축소 가능 | 진실 | 확대/축소 가능한 이미지를 활성화 또는 비활성화합니다. |
| 드래그 가능 | 진실 | 이전 슬라이드와 다음 슬라이드로 이동하려면 마우스 끌기를 활성화 또는 비활성화합니다. |
| 건너뛰기_클래스 | [ ] | 특정 사용자 정의 클래스 이름을 가진 해당 이미지의 라이트박스를 비활성화합니다. |
| auto_caption | 거짓 | 자동으로 대체 이미지를 캡션 제목으로 사용하거나 사용하지 않도록 설정합니다. |
| caption_position | 맨 아래 | 기본 캡션 위치. (아래, 위, 왼쪽, 오른쪽) |
| 배경 | 하얀색 | 라이트박스 이미지의 배경 CSS입니다. 이미지가 투명하면 배경이 표시됩니다. 예를 들어 #74b9ff 또는 Gainsboro 와 같이 배경에 CSS 값을 사용하거나 none 사용할 수 없습니다. |
| 그림자 | 진실 | 라이트박스 이미지의 그림자를 활성화하거나 비활성화합니다. 투명한 이미지 주위에 그림자가 생기는 것을 방지하려면 배경이 none 비활성화하십시오. |
| 수동 | 거짓 | true인 경우 on-glb 클래스를 추가하거나 페이지에 glightbox: true 메타를 추가하여 각 이미지에 대해 라이트박스를 수동으로 활성화해야 합니다. |
GLightbox Docs에서 더 많은 옵션 정보를 확인하세요.
유연성을 높이려면 다음을 수행하세요.
라이트박스 이미지 캡션을 지원합니다. 캡션에서 자세한 내용을 확인하세요.
이미지를 갤러리로 그룹화하는 기능을 지원합니다. 자세한 내용은 갤러리에서 확인하세요.
메모
MkDocs 플러그인 기능을 처음 사용하는 경우 MkDocs에 search 라는 기본 플러그인이 포함되어 있다는 것을 알아야 합니다. 검색 기능을 유지하려면 search 플러그인을 plugins 목록에 다시 추가해야 합니다.
site/assets/javascripts/ 디렉토리에 복사하고 CSS 파일을 site/assets/stylesheets/ 디렉토리에 복사합니다.이 프로젝트는 MIT 라이선스에 따라 라이선스가 부여됩니다. 자세한 내용은 LICENSE.md 파일을 참조하세요.
