목차
'. $title .'
웹 프론트엔드 JS 튜토리얼 WordPress中的shortcode短代码功能使用详解_php实例

WordPress中的shortcode短代码功能使用详解_php实例

Jun 07, 2016 pm 05:07 PM
shortcode wordpress 단축 코드

WordPress 从 2.5 的版本开始,增加了一个 shortcode (短代码) API ,类似于 BBS 上的 BBCode , shortcode 也可以很方便的为文章或页面增加功能,并且 shortcode 的比起 BBCode 更加灵活和强大。下面 Kayo 为大家介绍一下 shortcode 。

一.shortcode 简介
shortcode 可以让开发者通过以函数的形式创建宏内容来生成内容,或许这个概念看上去有点模糊,但实际上它是一个很简单而实用的功能,只要会编写基本的 PHP 函数,即可使用 shortcode ,下文会以实际的例子来说明 shortcode 的使用方法。

二.shortcode 形式
shortcode 支持封闭标签和自闭(自动封闭)标签,并且支持在标签内使用参数,至于 shortcode 具体是何种形式,这就决定于开发者怎样编写这个 shortcode 了。

[myshortcode]Some Content[/myshortcode] // 封闭标签
[myshortcode] // 自闭标签
[myshortcode title="example"] // 带有一个参数的自闭标签
[myshortcode]<p><a href="#"><span>内容</span></a></p>[/myshortcode] // 标签内可以填写文本或 HTML
[myshortcode]Content [myshortcodesecond] more content[/myshortcodesecond] // 也可以嵌套使用标签

로그인 후 복사

三.shortcode 例子
在使用 shortcode 前,首先必须在主题的 functions.php 文件中定义 shortcode ,例如:

function myshortcode_function($atts, $content = null){ // $atts 代表了 shortcode 的各个参数,$content 为标签内的内容
 
 extract(shortcode_atts(array( // 使用 extract 函数解析标签内的参数
 "title" => '标题' // 给参数赋默认值,下面直接调用 $ 加上参数名输出参数值
 ), $atts));
 // 返回内容
 return '<div class="myshortcode">
    <h3 id="title">'. $title .'</h3>
    <p>
     '. $content .'
    </p>
   </div>';
}
 
add_shortcode("msc", "myshortcode_function"); // 注册该 shortcode,以后使用 [msc] 标签调用该 shortcode
로그인 후 복사
로그인 후 복사

把上面的代码添加到 functions.php 中,一个简单的 shortcode 便创建好了,我们可以通过 [msc][/msc]标签调用该 shortcode ,如:

[msc title="欢迎"]这是独立博客 Kayo's Melody ,欢迎来到本博客[/msc]
로그인 후 복사

在文章或页面内容中输入上面的调用,可以在相应的位置输出一段欢迎语句,在 style.css 中定义相应的 CSS ,即可为短代码赋予样式。

Kayo 简略的介绍了 WordPress 的短代码(shortcode) 功能,主要是介绍了 shortcode 的主要概念和使用方法。在本文中, Kayo 将会更加详细的介绍一下 shortcode 中较为重要的 API ,希望有助于各位开发较为复杂的 shortcode 。

四.函数 add_shortcode

该函数用于注册一个 shortcode ,它有两个参数:短代码名与 shortcode 处理函数名,引用上文的例子:

function myshortcode_function($atts, $content = null){ // $atts 代表了 shortcode 的各个参数,$content 为标签内的内容
 
 extract(shortcode_atts(array( // 使用 extract 函数解析标签内的参数
 "title" => '标题' // 给参数赋默认值,下面直接调用 $ 加上参数名输出参数值
 ), $atts));
 // 返回内容
 return '<div class="myshortcode">
    <h3 id="title">'. $title .'</h3>
    <p>
     '. $content .'
    </p>
   </div>';
}
 
add_shortcode("msc", "myshortcode_function"); // 注册该 shortcode,以后使用 [msc] 标签调用该 shortcode
로그인 후 복사
로그인 후 복사

msc 即为短代码名,以后在写文章或页面时可以直接使用 [msc][/msc] 标签调用该短代码,而 "myshortcode_function" 即为例子中的短代码处理函数的名称。下面重点分析短代码处理函数。

五.短代码处理函数

shortcode 处理函数是一个 shortcode 的核心, shortcode 处理函数类似于 Flickr(WordPress 过滤器),它们都接受特定参数,并返回一定的结果。 shortcode 处理器接受两个参数, $attr 和 $content , $attr 代表 shortcode 的各个属性参数,从本质上来说是一个关联数组,而 $content 代表 shortcode 标签中的内容。

如上面的例子,若在文章内作出调用,输出一段欢迎语句:

[msc title="欢迎"]这是独立博客 Kayo's Melody ,欢迎来到本博客[/msc]
当文章显示时, WordPress 会注册所有的 shortcode ,如上面的 [msc] ,若 shortcode 中有属性参数和内容, WordPress 会把它们分离出来并解析,然后传递给该 shortcode 的短代码处理函数,处理后以处理函数输出的结果代替短代码原本的内容显示在文章内。

这时属性参数会并解析会关联数组并传递给 $attr ,如上面的例子中 $attr 的值为如下的一个关联数组:

array( 'title' => '欢迎')
로그인 후 복사

在输出结果时,可以直接使用 $参数名 的形式进行输出,如例子中的情况即以 $title 输出该属性值。

六.shortcode_atts

shortcode_atts 是一个很实用的函数,它可以为你需要的属性参数设置默认值,并且删除一些不需要的参数。

shortcode_atts() 包含两个参数 $defaults_array 与 $atts , $attr 即为属性参数集合, $defaults_array 是代表需要设置的属性默认值,举个例子:

$result = shortcode_atts( array(
 'title' => '新标题',
 'description' => '描述内容'
), $atts );
$attr 依然为

array( 'title' => '欢迎')

로그인 후 복사

这时 $result 的结果为

array( 'title' => '新标题', 'description' => '描述标题')
로그인 후 복사

'title' 由于在 $defaults_array 有不同的值,因此以这个新的值为准更新了 'title' ,同时也增加了 'description' 这个值。值得注意的是, shortcode_atts() 会过滤 $defaults_array 中没有的属性,假如 $attr 中还有一个 'ohter' 的属性,那么 $result 的结果仍然是上面的结果,因为 $defaults_array 中并没有 'other' 这个属性。当然,这里说的值只是属性的默认值,真正输出的值还是 shortcode 调用时填写的值。

七.进一步解析属性与设置属性默认值

extract() 函数用于进一步解析属性并设置属性默认值,其中一个功能是把各属性参数值赋予给一个形如 "$参数名" 的变量保存起来(如例子中的 $title ),方便调用,使用该函数配合 shortcode_atts() 就可以很安全的输出结果。这点的具体使用可以参见本文第一点“一.函数 add_shortcode”的例子。

另外,属性名中的大写字母在传递给处理函数前会先转化为小写字母,因此建议在编写属性名时直接使用小写字母。

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

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

PHP 대 Flutter: 모바일 개발을 위한 최고의 선택 PHP 대 Flutter: 모바일 개발을 위한 최고의 선택 May 06, 2024 pm 10:45 PM

PHP와 Flutter는 모바일 개발에 널리 사용되는 기술입니다. Flutter는 크로스 플랫폼 기능, 성능 및 사용자 인터페이스가 뛰어나며 고성능, 크로스 플랫폼 및 맞춤형 UI가 필요한 애플리케이션에 적합합니다. PHP는 성능이 낮고 크로스 플랫폼이 아닌 서버 측 애플리케이션에 적합합니다.

WordPress에서 페이지 너비를 변경하는 방법 WordPress에서 페이지 너비를 변경하는 방법 Apr 16, 2024 am 01:03 AM

style.css 파일을 편집하여 WordPress 페이지 너비를 쉽게 수정할 수 있습니다. style.css 파일을 편집하고 .site-content { max-width: [원하는 너비] }를 추가하세요. [원하는 너비]를 편집하여 페이지 너비를 설정하세요. 변경 사항을 저장하고 캐시를 지웁니다(선택 사항).

WordPress에서 제품 페이지를 만드는 방법 WordPress에서 제품 페이지를 만드는 방법 Apr 16, 2024 am 12:39 AM

WordPress에서 제품 페이지 만들기: 1. 제품 만들기(이름, 설명, 사진) 2. 페이지 템플릿 사용자 정의(제목, 설명, 사진, 버튼 추가) 3. 제품 정보(재고, 크기, 무게)를 입력합니다. 4. 변형(다양한 색상, 크기)을 만듭니다. 5. 공개 또는 숨김을 설정합니다. 6. 댓글을 활성화/비활성화합니다. 7. 페이지를 미리 보고 게시합니다.

WordPress 기사는 어느 폴더에 있나요? WordPress 기사는 어느 폴더에 있나요? Apr 16, 2024 am 10:29 AM

WordPress 게시물은 /wp-content/uploads 폴더에 저장됩니다. 이 폴더는 하위 폴더를 사용하여 연도, 월, 기사 ID별로 정리된 기사를 포함하여 다양한 유형의 업로드를 분류합니다. 기사 파일은 일반 텍스트 형식(.txt)으로 저장되며 파일 이름에는 일반적으로 ID와 제목이 포함됩니다.

워드프레스 템플릿 파일은 어디에 있나요? 워드프레스 템플릿 파일은 어디에 있나요? Apr 16, 2024 am 11:00 AM

WordPress 템플릿 파일은 /wp-content/themes/[테마 이름]/ 디렉터리에 있습니다. 헤더(header.php), 바닥글(footer.php), 기본 템플릿(index.php), 단일 기사(single.php), 페이지(page.php)를 포함하여 웹사이트의 모양과 기능을 결정하는 데 사용됩니다. , 아카이브(archive.php), 카테고리(category.php), 태그(tag.php), 검색(search.php) 및 404 오류 페이지(404.php). 이러한 파일을 편집하고 수정하면 WordPress 웹사이트의 모양을 사용자 정의할 수 있습니다.

WordPress에서 저자를 검색하는 방법 WordPress에서 저자를 검색하는 방법 Apr 16, 2024 am 01:18 AM

WordPress에서 작성자 검색: 1. 관리자 패널에 로그인한 후 게시물 또는 페이지로 이동하여 검색 표시줄을 사용하여 작성자 이름을 입력하고 필터에서 작성자를 선택합니다. 2. 기타 팁: 와일드카드를 사용하여 검색 범위를 넓히고, 연산자를 사용하여 기준을 결합하거나, 저자 ID를 입력하여 기사를 검색하세요.

어떤 WordPress 버전이 안정적인가요? 어떤 WordPress 버전이 안정적인가요? Apr 16, 2024 am 10:54 AM

가장 안정적인 WordPress 버전은 최신 보안 패치, 성능 향상, 새로운 기능 및 개선 사항이 포함된 최신 버전입니다. 최신 버전으로 업데이트하려면 WordPress 대시보드에 로그인하고 업데이트 페이지로 이동하여 지금 업데이트를 클릭하세요.

WordPress를 개발하는 데 어떤 언어가 사용됩니까? WordPress를 개발하는 데 어떤 언어가 사용됩니까? Apr 16, 2024 am 12:03 AM

WordPress는 데이터베이스 상호 작용, 양식 처리, 동적 콘텐츠 생성 및 사용자 요청을 처리하기 위한 핵심 프로그래밍 언어로 PHP 언어를 사용하여 개발되었습니다. PHP는 크로스 플랫폼 호환성, 학습 용이성, 활발한 커뮤니티, 풍부한 라이브러리 및 프레임워크 등의 이유로 선택되었습니다. WordPress는 PHP 외에도 HTML, CSS, JavaScript, SQL 등과 같은 언어를 사용하여 기능을 향상시킵니다.

See all articles