>  기사  >  백엔드 개발  >  빠른 팁: Colorbox를 기본 단축 코드에 통합

빠른 팁: Colorbox를 기본 단축 코드에 통합

WBOY
WBOY원래의
2023-09-02 18:45:13585검색

네이티브 [图库] 단축 코드는 좋지만 훌륭하지는 않습니다. 이 빠른 팁에서는 jQuery를 사용하여 아름답게 만듭니다.

[图库] 단축번호는 별로 좋지 않습니다. 기본 CSS를 비활성화할 수 없고, CSS 클래스를 추가하거나 편집할 수 없으며, 기본 속성을 편집할 수 없습니다(이것은 실제로 일반적인 단축 코드 문제입니다). 하지만 이러한 사항이 WordPress를 개발하는 대부분의 사람들을 방해하지는 않습니다. , 나 같은 이상한 사람이 불평할 수도 있어요! :)

이 빠른 팁에서는 이미지 첨부 페이지를 제거하고 사이트 방문자가 jQuery 모달 상자에서 이미지를 볼 수 있도록 하겠습니다.


최고의 jQuery 라이트박스 플러그인 중 하나: ColorBox

5KB 미만(압축)으로 다양한 브라우저(IE6 포함)를 지원하는 Colorbox는 제가 가장 좋아하는 jQuery 라이트박스 플러그인입니다.

빠른 팁: Colorbox를 기본 단축 코드에 통합

플러그인 페이지에서 볼 수 있듯이, 수많은 설정, 메소드, 후크가 있어 원하는 대로 사용자 정의할 수 있습니다. 또한 5개의 깔끔한 CSS 기반 테마도 제공합니다.

패키지를 다운로드하고 colorbox.min.js 和 5 个主题之一(colorbox.css 文件和“images”文件夹)提取到名为“colorbox”的文件夹中,然后将该文件夹上传到您的 WordPress主题。上传前在colorbox.min.js파일 끝에 다음 코드를 추가하세요.

으아악

단축코드 선택: 다른 단축코드를 사용하는 단축코드 만들기

이게 좀 이상할 거라는 건 알지만 가장 깔끔한 방법인 것 같습니다. [jgallery] 단축 코드를 만들어 보겠습니다.

빠른 팁의 팁: [jgallery] 短代码后更改帖子中的所有图库短代码,我建议使用搜索正则表达式插件来搜索/替换 [gallery] [jgallery] 단축 코드를 생성한 후 게시물의 모든 갤러리 단축 코드를 변경할 계획이라면 검색 정규식 플러그인을 사용하여 [갤러리]

를 검색/바꾸는 것이 좋습니다.

평소처럼 기본 단축 코드 기능을 만드는 것부터 시작하겠습니다.

으아악 다음으로 CSS 및 JS 파일을 대기열에 추가합니다. Colorbox 스크립트 dependent

를 지정하면 jQuery가 자동으로 대기열에 추가됩니다(아직 대기열에 추가되지 않은 경우).

으아악 [gallery] 短代码。我们将使用 do_shortcode() 函数并返回 [gallery link="file"]모든 것이 준비되었습니다. 단, 이 함수에서

단축 코드를 사용해야 합니다.

으아악 모두 완료되었습니다! 이 기능을 테마의 functions.php[jgallery] 파일에 추가하면

단축 코드를 즉시 사용할 수 있습니다. 아래 댓글로 여러분의 생각을 알려주세요. 즐기다! :)
🎜

위 내용은 빠른 팁: Colorbox를 기본 단축 코드에 통합의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.