메인 콘텐츠로 건너뛰기

개요

이 가이드는 OneSignal WordPress 웹 푸시 플러그인 v3+를 설정하고 구성하는 방법을 다룹니다.
이전 버전 2.x.x WordPress 문서는 WordPress 레거시 플러그인을 참조하세요.

버전 3+의 새로운 기능

이 릴리스는 설정 및 구성 프로세스를 간소화하여 중요한 업그레이드를 나타냅니다. 버전 3+에서는 OneSignal 대시보드 한 곳에서 모든 프롬프트 설정을 처리할 수 있습니다.
  • 🚀 SDK 업그레이드: OneSignal 웹 SDK를 버전 15에서 16으로 업데이트
  • 💬 대시보드 프롬프트: OneSignal 대시보드에서 직접 모든 권한 프롬프트를 구성 - 사용자 지정 코드 필요 없음
  • 원클릭 게시: “Send notification when post is published”를 선택하여 푸시 알림 자동 전송
  • 🧑‍🤝‍🧑 오디언스 타겟팅: 각 게시물에 대해 알림을 받을 세그먼트를 선택
  • 📲 모바일 앱 통합: 선택적 딥 링킹을 사용하여 모바일 앱 구독자에게 전송

설정

시작하기 전에 다음을 확인하세요:
  • OneSignal 계정(무료로 생성)
  • 플러그인을 설치하고 구성할 수 있는 WordPress 관리자 액세스 권한
  • HTTPS가 활성화된 웹사이트(웹 푸시 알림에 필요)

1. OneSignal 대시보드에서 WordPress 구성

설정 > 푸시 및 인앱 > 웹 > WordPress Plugin or Website Builder로 이동합니다

OneSignal 대시보드의 Website Builder 옵션에서 WordPress 선택

사이트 설정

  • Site Name: 사이트 이름 및 기본 알림 제목입니다.
  • Site URL: WordPress 사이트의 정확한 URL과 일치해야 합니다(동일 원본 정책 따름)
  • Auto Resubscribe: 사이트로 돌아올 때 브라우저 데이터를 지운 사용자를 자동으로 재구독하려면 이것을 활성화하세요(새 권한 프롬프트 필요 없음)
  • Default Icon URL: 알림 및 프롬프트용 정사각형 256x256px PNG 또는 JPG 파일 - MacOS Safari는 아이콘 없이 알림 프롬프트를 표시하지 않습니다.

정확한 사이트 URL을 입력하세요. https://your-site.com은 https://www.your-site.com과 다릅니다—한 가지 형식만 일관되게 사용하세요

로컬에서 테스트하시나요? localhost 개발을 위해 로컬 테스트 가이드를 참조하세요

권한 프롬프트

Push, Email 및 SMS에 대한 권한 프롬프트를 설정합니다. Push Slide Prompt는 기본적으로 활성화되어 있지만 사용자 지정하거나 추가 프롬프트를 추가할 수 있습니다.
프로 팁: 간단한 프롬프트로 시작하여 점차 복잡성을 추가하세요. OneSignal 대시보드를 통해 언제든지 모든 프롬프트 설정을 수정할 수 있습니다. 웹 권한 프롬프트에서 사용 가능한 모든 옵션을 탐색하세요.
  • 기본 프롬프트 설정
  • 고급: 카테고리 기반 세분화
1

사용자 지정하려면 Push Slide Prompt 클릭

푸시 슬라이드 프롬프트 설정에 액세스하고 사용자 지정

2

타이밍 및 텍스트 구성:

  • 초기 테스트를 위해 Auto Prompt1 페이지뷰 및 1초로 설정
    • 프롬프트 텍스트 및 모양 사용자 지정
    • 시작 후 사용자 동작에 따라 타이밍 조정

자동 프롬프트 타이밍 구성 및 프롬프트 모양 사용자 지정

3

프롬프트 구성을 완료하면 Done 클릭

프로 팁: 간단한 프롬프트로 시작하여 점차 복잡성을 추가하세요. OneSignal 대시보드를 통해 언제든지 모든 프롬프트 설정을 수정할 수 있습니다. 웹 권한 프롬프트에서 사용 가능한 모든 옵션을 탐색하세요.

환영 알림

사용자가 처음 구독한 후 전송되는 즉시 알림을 설정합니다. 이것은:
  • 구독해 주신 사용자에게 감사
  • 알림이 표시되는 방식 시연
  • 참여 증가 및 구독 취소 감소
환영 메시지 텍스트 및 타이밍을 구성한 다음 아래로 스크롤하고 Save를 클릭합니다.
지금은 Advanced Push Settings 섹션을 건너뛰세요 - 이것은 사용자 지정 웹 SDK 설정용입니다. 계속하려면 Save를 클릭하세요.

2. WordPress 플러그인 구성

대시보드 구성을 저장한 후 App IDAPI Key가 표시됩니다. 이러한 값을 WordPress 플러그인에 복사합니다:

OneSignal 대시보드에서 앱 ID 및 API 키 복사

API Key가 표시되지 않나요? 위에서 WordPress 옵션을 선택했는지 확인하세요. 그런 다음 키 및 ID 가이드를 따라 키를 만드세요.
1

WordPress 관리자에서 OneSignal 플러그인 설정으로 이동

2

대시보드에 표시된 대로 앱 ID 및 REST API 키를 정확히 붙여넣기

WordPress 플러그인 앱 ID 및 REST API 키가 OneSignal 대시보드와 정확히 일치하는지 확인

고급 설정

필요에 따라 추가 플러그인 옵션을 구성합니다:

향상된 기능 및 분석 추적을 위한 고급 설정

URL 매개변수 추적 추적을 위해 알림 URL에 분석 매개변수를 추가합니다. 중요: 특수 문자 이스케이프 - 입력은 URL에 그대로 추가됩니다. Google Analytics용 예:
utm_medium=push&utm_source=onesignal&utm_campaign=wordpress-plugin
특수 문자가 있는 예:
utm_medium=ppc&utm_source=adwords&utm_campaign=snow%20boots&utm_content=durable%20snow%20boots
추가 설정
  • Custom Post Types: 플러그인의 게시물 유형을 추가하여 알림 옵션 활성화
  • Automatically send notifications when a post is published: 게시물을 게시할 때 알림 확인란을 자동으로 선택하여 수동으로 확인란을 선택하지 않고도 알림이 전송되도록 합니다
  • Automatically send notifications when a post is updated: 게시물을 업데이트할 때 알림 확인란을 자동으로 선택하여 수동으로 확인란을 선택하지 않고도 알림이 전송되도록 합니다
  • Automatically send notifications when a page is published: 페이지를 게시할 때 알림 확인란을 자동으로 선택하여 수동으로 확인란을 선택하지 않고도 알림이 전송되도록 합니다
  • Automatically send notifications when a page is updated: 페이지를 업데이트할 때 알림 확인란을 자동으로 선택하여 수동으로 확인란을 선택하지 않고도 알림이 전송되도록 합니다
  • Automatically send a push notification when I publish a post from 3rd party plugins: 외부 게시 플러그인에서 알림 자동 전송
  • Mobile App Integration: 동일한 OneSignal 앱 ID를 사용하여 모바일 앱 구독자에게 알림 전송

3. 마이그레이션 완료 (업그레이드 사용자만 해당)

새 설치는 이 단계를 건너뛸 수 있습니다. v2+에서 업그레이드하는 경우 따라하세요…
시간 제한: 전환 중 사용자가 알림을 놓치지 않도록 가능한 한 빨리 이러한 단계를 완료하세요.
1

OneSignal 대시보드 구성을 저장한 후 WordPress로 돌아가기

2

플러그인 설정에서 Migration Completed 클릭

3

업그레이드를 완료하려면 Save Settings 클릭

플러그인 업그레이드를 완료하려면 Migration Completed 클릭

설정 완료! 플러그인 구성을 완료하려면 Save Settings를 클릭하세요.

설정 테스트

  • 초기 테스트
  • 구독 확인
  • 테스트 메시지 전송
  1. 웹사이트를 방문합니다(시크릿/프라이빗 브라우징 방지 - 사용자는 이러한 모드에서 구독할 수 없습니다)
  2. 구성한 슬라이드다운 프롬프트를 찾습니다

타이밍 설정에 따라 구성된 슬라이드다운 프롬프트가 나타나야 합니다

  1. 구독 버튼을 클릭합니다(이 예에서는 “Subscribe”로 표시됨)
  2. 메시지가 표시되면 브라우저 권한을 수락합니다

웹 푸시 알림에 필요한 브라우저 권한 프롬프트(브라우저에 따라 모양이 다름)

  1. 환영 알림을 확인합니다(구성된 경우)

성공적인 구독 직후 환영 알림이 나타남

성공! WordPress 사이트가 이제 웹 푸시 알림에 대해 구성되었습니다. 사용자가 구독하면 구독에 나타나기 시작합니다.다음 단계:
문제가 있으신가요? 일반적인 해결 방법은 WordPress 문제 해결 가이드를 확인하세요.

알림 게시

게시물을 게시하도록 예약하면 OneSignal은 예약된 시간에 구독자에게 전송할 푸시 알림도 예약합니다. 게시물을 다시 예약하면 푸시 알림이 취소되고 새 시간에 대해 새 푸시가 예약됩니다. Delivery > Scheduled Messages 아래의 OneSignal 대시보드에서 예약 및 취소된 알림을 볼 수 있습니다. 자세한 내용은 푸시 메시지 보고서를 참조하세요.

기본 게시물 알림

WordPress 게시물을 만들거나 편집할 때 OneSignal Push Notifications 메타박스를 찾습니다(일반적으로 게시물 편집기의 하단 또는 사이드바에 있음).

OneSignal Push Notifications 메타박스—필요한 경우 드래그하여 위치 변경

알림을 전송하려면:
  • **“Send notification when post is published or updated”**를 선택합니다
  • 해당 게시물에 대한 알림 전송을 건너뛰려면 선택 해제합니다

오디언스 타겟팅

모든 구독자에게 전송 (기본값)

기본적으로 알림은 모든 푸시 구독자에게 전송됩니다.

특정 세그먼트에 전송

OneSignal 대시보드 > Audience > Segments에서 생성한 세그먼트를 사용하여 특정 오디언스를 타겟팅합니다. 3단계에서 카테고리를 설정한 경우 해당 세그먼트를 만듭니다:
  1. OneSignal 대시보드에서 Audience > Segments로 이동합니다
  2. 태그 키를 사용하여 세그먼트를 만듭니다. 예:
    • News Segment: 태그 news1
    • Deals Segment: 태그 deals1

태그는 대소문자를 구분합니다! 'news'와 'News'는 서로 다른 태그입니다

  1. 세그먼트를 만든 후 WordPress 게시물 편집기를 새로 고칩니다
  2. 드롭다운에서 대상 세그먼트를 선택합니다

관련 사용자 그룹을 타겟팅하려면 특정 세그먼트 선택

고급 세분화: 사용자 동작, 위치, 장치 유형 등을 기반으로 세그먼트를 만듭니다. 태그는 사용자 지정 사용자 데이터 및 개인화에 가장 많은 유연성을 제공합니다.

알림 콘텐츠 사용자 지정

기본 동작

  • Title: WordPress 사이트 제목 사용(설정 > 일반)
  • Message: 게시물 제목 사용
  • Image: 게시물의 특집 이미지 사용(설정된 경우)
  • URL: 게시된 게시물에 링크

사용자 지정 콘텐츠

기본값을 재정의하려면 **“Customize notification content”**를 선택합니다:

알림 제목, 콘텐츠 및 기타 요소 사용자 지정

예제 결과:

사용자에게 표시되는 사용자 지정 푸시 알림

모바일 앱 통합

동일한 OneSignal 앱 ID를 사용하는 모바일 앱이 있는 경우:
  1. 플러그인 설정에서 **“Send notification to Mobile app subscribers”**를 활성화합니다
  2. 게시물 메타박스에서 딥 링킹을 위한 Mobile URL을 추가합니다
  3. 모바일 사용자는 웹 브라우저 대신 앱으로 이동합니다
확장 준비: 정교한 알림 캠페인을 위해 고급 푸시 전략자동화된 저니를 탐색하세요.
알림이 나타나지 않나요? 해결 방법은 웹 푸시 문제 해결 가이드를 확인하세요.

자주 묻는 질문 (FAQ)

참고: 이 방법은 슬라이드다운 및 네이티브 권한 프롬프트에서만 작동하며 벨 또는 사용자 지정 링크 프롬프트에서는 작동하지 않습니다.
  1. OneSignal 대시보드에서 설정 > 푸시 및 인앱 > 웹 설정으로 이동합니다
  2. Permission Prompt Setup 테이블에서 프롬프트를 선택합니다
  3. Auto Prompt를 선택 해제하고 Done을 클릭합니다

프롬프트가 나타나는 시기를 수동으로 제어하려면 Auto Prompt 비활성화

  1. 아래로 스크롤하여 Save를 클릭한 다음 Finish를 클릭합니다
  2. 프롬프트를 표시하려는 특정 페이지에 사용자 지정 JavaScript 코드를 추가합니다
이것은 프롬프트 타이밍 및 배치를 완전히 제어합니다. 구현 세부 사항은 웹 권한 프롬프트를 참조하세요.
예! 모바일 앱이 동일한 OneSignal 앱 ID를 사용하는 경우:
  1. WordPress 플러그인 설정에서 **“Send notification to Mobile app subscribers”**를 활성화합니다
  2. 게시물을 게시할 때 OneSignal 메타박스의 Mobile URL 필드를 사용하여 딥 링크를 지정합니다
  3. 사용자 지정 Mobile URL이 없으면 사용자가 웹사이트로 이동합니다
이 기능은 단일 WordPress 인터페이스에서 크로스 플랫폼 메시징을 가능하게 합니다.
WordPress 플러그인은 현재 푸시 알림만 지원합니다. 이메일 및 SMS의 경우:
  1. 이메일: 이메일 설정 가이드를 따른 다음 이메일 메시징 도구를 사용합니다
  2. SMS: SMS 설정 가이드를 따른 다음 SMS 메시징 도구를 사용합니다
두 채널 모두 푸시 알림과 함께 동일한 OneSignal 대시보드에서 관리할 수 있습니다.
캐싱 문제: WordPress 캐싱이 마이그레이션 변경을 지연시킬 수 있습니다.해결 방법:
  1. 웹사이트를 마우스 오른쪽 버튼으로 클릭하고 Inspect를 선택합니다
  2. Network 탭으로 이동합니다
  3. **“Disable cache”**를 선택합니다

마이그레이션 후 업데이트된 파일을 강제로 로드하려면 브라우저 캐시 비활성화

  1. 웹사이트를 새로 고쳐 현재 구성을 확인합니다
  2. 해당하는 경우 WordPress 캐시 플러그인 설정을 지웁니다
이 오류는 불완전한 마이그레이션을 나타냅니다:

브라우저 콘솔의 404 오류는 불완전한 마이그레이션 프로세스를 나타냄

해결 방법:
  1. OneSignal 대시보드 구성을 저장했는지 확인합니다
  2. WordPress에서 플러그인 설정의 **“Migration Completed”**를 클릭합니다
  3. 업그레이드를 완료하려면 Save Settings를 클릭합니다
이 오류는 버전 2.x.x에서 업그레이드하는 사용자에게만 영향을 미칩니다.
예, onesignal_send_notification 필터를 사용할 수 있습니다.
사용자 지정 PHP 코드를 wp-content/mu-plugins/onesignal-custom.php에 배치합니다. 이렇게 하면 올바르게 로드되고 업데이트로 인해 덮어쓰지 않습니다.
<?php

add_filter('onesignal_send_notification', function($fields, $post_id) {

  // Include any properties mentioned in the Create Notification API Reference:
  // https://documentation.onesignal.com/reference/push-notification eg:

  // Add action buttons
  $fields['web_buttons'] = array(
    array(
      "id" => "read-more",
      "text" => "Read More",
      "url" => get_permalink($post->ID)
    )

  // Return the modified fields array
  return $fields;

}, 10, 2);