Categories
PHP

워드프레스에서 사용자정의 숏코드 (shortcode) 사용하기

워드프레스에서 숏코드 (shortcode) 를 직접 작성하여 사용하는 방법을 알아보자.

워드프레스에서 글을 작성하다가 [apple] 이라고 입력하면 사과 이미지가 삽입되도록 해 보자.

1. 숏코드 핸들러 함수 작성

현재 사용 중인 워드프레스 테마 (theme) 의 functions.php 파일을 연다.

vi wp-content/themes/twentytwenty/functions.php

다음과 같이 숏코드 핸들러 (handler) 함수를 작성한다.

작성하는 위치는 파일의 맨 앞부분이다.

function apple_function () {
  return '<img src="http://xtmci.com/wp-content/uploads/apple.png">';
}

2. 숏코드 핸들러 함수 등록

add_shortcode() 함수로 apple_function() 함수를 등록한다.

add_shortcode(‘apple’, ‘apple_function’);

apple 은 숏코드의 태그 (tag) 이다. 본문에서 [apple] 과 같이 대괄호 안에 쓰인다.

태그 이름에는 작성 규칙이 있다. 영문 소문자와 밑줄 문자 (underscore) 만 허용된다.

apple_function 은 앞에서 작성한 핸들러 함수의 이름이다.

다음은 functions.php 파일에 추가되는 전체 내용이다.

function apple_function () {
  return '<img src="http://xtmci.com/wp-content/uploads/apple.png">';
}

add_shortcode('apple', 'apple_function');

3. 숏코드 사용하기

워드프레스 본문에서 사과 이미지가 필요한 위치에 [apple] 이라고 입력한다.

......

[apple]

......

숏코드 위치에 실제로 이미지 태그가 삽입되는지 미리보기로 확인해 보자.

Leave a Reply

Your email address will not be published. Required fields are marked *