워드프레스 숏코드(Shortcode) 심화 가이드: 숏코드란 그리고 구현 가능한 플랫폼 이야기

워드프레스에서 숏코드는 블로그 운영의 효율성을 극대화하는 강력한 기능입니다. 복잡한 HTML 코드를 간단한 태그로 대체하여 글 본문에 삽입할 수 있도록 해주는 핵심적인 방법입니다. 오늘 글에서는 워드프레스뿐만 아니라 숏코드란 무엇이며 구체적으로 워드프레스에서는 어떻게 활용되는지를 보여드립니다.  함, 가보시조!!

1. 숏코드(Shortcode)란 무엇이며, 왜 필요한가요?

숏코드(Shortcode)란? [coupang_banner] 와 같이 대괄호로 감싸진 간단한 태그를 의미합니다. 이 태그는 워드프레스가 글을 표시할 때 특정 PHP 함수를 실행하여 그 결과를 태그가 있던 자리에 출력하도록 하는 일종의 단축키입니다. 사용자는 복잡한 코드를 몰라도 단 한 줄의 태그만으로 기능을 쉽게 추가할 수 있습니다.

왜 필요한가요?

• 편의성: 길고 복잡한 HTML 배너 코드를 매번 복사/붙여넣기 할 필요 없이 [coupang_banner] 같은 간단한 태그만 입력하면 됩니다.

• 유지보수 용이성: 배너 코드가 변경되거나 추적 코드를 업데이트해야 할 때, functions.php 파일의 코드 한 줄만 수정하면 됩니다. 이 코드가 삽입된 모든 포스팅에 자동으로 변경사항이 적용되어 일일이 글을 수정해야 하는 번거로움이 사라집니다.

• 글 가독성: 글 본문이 복잡한 HTML 코드로 채워지지 않고 깔끔하게 유지되어 가독성이 높아집니다.

---

2. 숏코드 구현 방법: functions.php에 코드 추가하기

아래 코드는 쿠팡 파트너스 배너를 숏코드로 등록하는 실제 구현 예시입니다. 이 코드를 워드프레스 테마의 functions.php 파일에 추가하면 됩니다.

경로: 워드프레스 관리 페이지 > 외모 > 테마 파일 편집기에서 functions.php 파일을 찾아 코드를 붙여 넣어주세요.

PHP

// Coupang Partners 배너 숏코드 등록
function display_coupang_banner_shortcode() {
    // 여기에 쿠팡 파트너스에서 생성한 다이나믹 배너 코드(HTML)를 넣으세요.
    // **반드시 return으로 반환해야 합니다. echo는 사용하지 마세요.**
    // 아래 코드는 예시입니다. 본인의 배너 코드로 교체해주세요.
    $banner_code = '
    <iframe src="https://partners.coupang.com/widgets/banners/....?id=본인의_아이디_값" 
            width="320" 
            height="150" 
            frameborder="0" 
            scrolling="no" 
            referrerpolicy="unsafe-url">
    </iframe>
    ';

    return $banner_code;
}
add_shortcode('coupang_banner', 'display_coupang_banner_shortcode');

코드 설명:

• display_coupang_banner_shortcode() 함수는 숏코드([coupang_banner])가 발견되면 실행될 함수입니다.

• $banner_code 변수에 쿠팡 파트너스에서 제공하는 실제 HTML 배너 코드를 통째로 붙여 넣습니다. id=... 부분에 본인의 아이디 값을 정확히 입력해야 합니다.

• return $banner_code;는 이 함수가 HTML 코드를 반환하도록 지정하여, 해당 코드가 숏코드가 있던 자리에 출력되게 합니다.

• add_shortcode('coupang_banner', 'display_coupang_banner_shortcode');는 coupang_banner라는 이름의 숏코드를 display_coupang_banner_shortcode 함수에 연결해 주는 역할을 합니다.

이제 글을 작성할 때 복잡한 HTML 코드 대신 [coupang_banner]만 입력하면, 워드프레스가 자동으로 배너를 표시해 줍니다. 배너 코드를 변경해야 할 경우에도 이 functions.php 파일만 수정하면 되므로 매우 효율적입니다.

3. 마무리하며

이상으로  설명한 워드프레스의 숏코드 기능은 복잡한 배너 코드를 깔끔하게 관리하고, 블로그 운영의 효율을 극대화하는 매우 강력한 도구입니다.

숏코드는 워드프레스의 고유한 기능이지만, 티스토리나 블로그 스팟에서도 비슷한 효과를 내는 방법이 있습니다. 티스토리의 경우 서식 기능을 활용해 배너 코드를 미리 저장해 두면 워드프레스의 숏코드처럼 글 작성 시 간편하게 불러와 사용할 수 있습니다.

이처럼 각 플랫폼의 기능을 활용하면, 길고 복잡한 코드를 매번 입력할 필요 없이 간단한 방식으로 쿠팡 파트너스 배너를 구현하고 관리할 수 있어 블로그 운영이 훨씬 수월해집니다. 참고로 블로그 스팟(블로거)역시  HTML 기반의 플랫폼이므로 이러한 숏코드방식의 구현은 불가능하지만, 숏코드를 대체하는 위젯(가젯)을 활용해서 구현하기도 합니다.