워드프레스 사이트에 웹 푸시 알림을 추가하는 방법

워드프레스 사이트에 푸시 알림을 추가 하시겠습니까? 푸시 알림을 사용하면 웹 사이트를 방문하지 않아도 사용자에게 알림을 보낼 수 있습니다.

이 기사에서는 워드프레스 사이트에 웹 푸시 알림을 쉽게 추가하는 방법을 설명합니다. 우리는 또한 최고의 워드프레스 푸시 알림 플러그인과 워드 프레스 사이트에서 데스크톱 및 모바일 푸시 알림을 보내는 방법에 대해서도 이야기 할 것입니다.

워드프레스 사이트에 웹 푸시 알림 추가

푸시 알림이란 무엇입니까?

푸시 알림은 사용자의 데스크톱 또는 모바일 장치의 알림 영역 위에 표시되는 클릭 가능한 메시지입니다. 사용자의 브라우저가 열려 있지 않은 경우에도 표시 될 수 있습니다.

바탕 화면에 표시되는 웹 푸시 알림

데스크톱과는 별도로 웹 푸시 알림은 모바일 장치에서도 작동합니다. 이를 통해 최신 업데이트 및 오퍼링을 사용하여 장치를 통해 사용자에게 도달 할 수 있습니다. 웹 푸시 알림은 웹 사이트 방문자를 고객 및 충성도가 높은 팔로어로 전환시키는 데 매우 효과적인 방법임이 입증되었습니다.

워드프레스 사이트에 웹 푸시 알림을 추가해야하는 이유

우리는 이미 귀하의 웹 사이트를 떠나 사람들의 70 %가 다시 오지 않을 것이라고 논의했습니다. 이러한 이유로 웹 사이트 사용자를 가입자 또는 고객으로 전환해야합니다.

한 번에 여러 채널을 활용하여이 작업을 수행 할 수 있습니다. 여기에는 이메일 마케팅, 소셜 미디어, 모바일 또는 SMS 마케팅, 웹 푸시 알림 등이 포함됩니다.

전자 메일 목록은 여전히 ​​가장 강력하고 효과적인 마케팅 도구이지만 처분 알림은 매우 효과적임이 증명됩니다.

이유는 다음과 같습니다.

  • 사용자는 푸시 알림을 수신 할 명시 적 권한을 부여해야합니다. 즉, 사용자는 이미 제공해야하는 것에 관심이 있으며 알림을 더 많이 사용하게됩니다.
  • 푸시 알림은 이메일 또는 소셜 미디어 업데이트보다 짧고 관심이 덜 필요합니다.
  • 알고리즘이 없으므로 거의 100 %의 메시지가 배달됩니다.
  • 사용자는 기기에서 알림을 표시하는 방법을 제어 할 수 있으며, 알림을 일시 중지하거나 완전히 끌 수 있습니다.
  • 많은 회사가 그것을 사용하지 않습니다.

Facebook, Pinterest, LinkedIn을 비롯한 많은 유명 사이트에서 중요성을 이해하고 이미 웹 푸시 알림을 사용하고 있습니다.

이러한 알림은 SMS, 전자 메일 마케팅 및 소셜 미디어 플랫폼보다 더 매력적입니다. 설문 조사에 따르면 푸시 알림은 이메일보다 열린 비율이 50 % 높으며 클릭률이 두 배 높습니다.

그런 말로, 워드프레스 사이트에 웹 푸시 알림을 추가하는 방법을 살펴 보겠습니다.

WordPress에서 OneSignal을 사용하여 웹 푸시 알림 설정

OneSignal은 워드프레스 웹 사이트에 대한 무료 푸시 알림 서비스입니다. 모든 웹 사이트에 푸시 알림을 쉽게 추가 할 수 있습니다.

먼저 OneSignal 플러그인을 설치하고 활성화해야합니다. 플러그인 설치에 도움이 필요하십니까? 워드프레스 플러그인을 설치하는 방법에 대한 단계별 가이드를 참조하십시오.

활성화되면 플러그인은 워드프레스 관리 표시 줄에 OneSignal이라는 새 메뉴 항목을 추가합니다. 그것을 클릭하면 플러그인의 설정 페이지로 이동합니다.

OneSignal 설정 페이지

설정 페이지는 설정 및 구성 탭으로 구분됩니다. 설정 탭은 실제로 WordPress에서 OneSignal 푸시 알림을 설정하는 방법에 대한 자세한 설명서입니다. 이 튜토리얼에서 보여줄 단계와 동일한 단계가 있습니다.

OneSignal을 설정하려면 API 키와 APP ID를 플러그인 설정에 추가해야합니다.

시작하자.

1 단계 : OneSignal Push Notifcations 설정

먼저 OneSignal 웹 사이트를 방문하여 웹 푸시 옵션 옆에있는 시작하기 버튼을 클릭해야합니다.

OneSignal 시작하기

무료 계정을 만들려면 이메일과 비밀번호를 입력해야합니다. 계정이 생성되면 OneSignal 대시 보드로 연결됩니다.

OneSignal 앱 추가

대시 보드에서 'App 추가'버튼을 클릭하여 첫 번째 앱을 만듭니다.

앱 이름을 입력하라는 메시지가 표시됩니다. 여기에서 식별 할 수있는 모든 것을 사용할 수 있습니다.

앱 이름 입력

다음으로 플랫폼을 선택해야합니다. 앱에 대해 여러 플랫폼을 선택할 수 있습니다. 지금은 '웹 푸시'를 선택하고 다음 버튼을 클릭하여 계속 진행하는 것이 좋습니다.

앱 플랫폼 선택

다음 단계에서는 통합 방법을 선택하라는 메시지가 표시됩니다. 계속해서 '워드프레스 Plugin 또는 Website Builder'상자를 클릭 한 다음 WordPress를 선택하십시오.

통합 방법 선택

아래로 스크롤하면 '워드프레스 Site Setup'섹션이 표시됩니다.

웹 사이트 이름, URL을 입력하고 로고를 업로드해야합니다. 이 로고는 알림에 표시되므로 사이트 아이콘 (favicon) 또는 웹 사이트 로고를 사용하는 것이 좋습니다.

워드프레스 사이트 설정

그 아래에서 워드프레스 사이트가 SSL / HTTPS를 사용하지 않는 경우 켜는 토글이 표시됩니다. 보안 HTTPS URL에서만 웹 푸시 알림을 보낼 수 있습니다. 워드프레스 사이트가 HTTPS를 사용하지 않는 경우이 설정을 켜고 레이블을 입력해야합니다.

레이블은 기본적으로 보안 HTTPS URL을 사용하여 OneSignal 서버에서 호스팅되는 하위 도메인입니다. 이 하위 도메인은 푸시 알림을 보내는 데 사용됩니다.

자신의 워드프레스 사이트에서 HTTPS를 설정하려면 WordPress를 HTTP에서 HTTPS로 이동하는 방법에 대한 단계별 자습서를 참조하십시오. OneSignal의 하위 도메인보다 SSL을 사용하는 자체 도메인을 사용하는 것이 좋습니다. 따라서 자신의 플랫폼에 영원히 잠겨 있지 않습니다.

작업이 끝나면 저장 버튼을 클릭하여 OneSignal 설정을 저장하십시오. 이제 복사해야하는 API 키가 표시됩니다.

API 키 복사

이제 워드프레스 사이트의 OneSignal 플러그인 설정으로 다시 전환하고 '구성'탭으로 전환 할 수 있습니다. 이전에 복사 한 APP 및 API 키를 붙여 넣어야합니다.

API 키 붙여 넣기

이러한 API 키를 사용하면 Chrome 및 Firefox 웹 브라우저를 통해서만 푸시 알림을 보낼 수 있습니다.

Safari 웹 브라우저를 통해 푸시 알림을 보내려면 Safari 웹 ID가 필요합니다.

Safari API 키를 얻으려면 OneSignal 웹 사이트로 돌아가서 앱의 설정 페이지로 이동해야합니다. 일단 거기에, 당신은 애플 사파리 옆에있는 편집 아이콘을 클릭해야합니다.

Safari에 대한 푸시 알림 설정

그런 다음 웹 사이트 제목, URL을 입력하고 선택적으로 사이트 아이콘을 업로드하라는 메시지가 표시됩니다.

푸시 알림을위한 Safari 설정

설정을 저장하려면 저장 버튼을 클릭하십시오. 그 다음에는 화면에 Safari 웹 ID가 표시되어 복사해야합니다.

Safari 웹 ID

다시 한번 워드프레스 사이트의 플러그인 설정 페이지로 돌아가서 Safari Web ID를 구성 탭에 붙여 넣으십시오.

OneSignal 플러그인 설정 저장

저장 버튼을 클릭하여 플러그인 설정을 저장하는 것을 잊지 마십시오.

이제 새로운 시크릿 브라우저 탭에서 웹 사이트를 방문 할 수 있습니다. 상단에 푸시 알림 팝업이 표시되고 화면 오른쪽 하단에 벨 알림 아이콘이 표시됩니다.

푸시 알림 선택

푸시 알림 팝업은 모바일 브라우저에도 나타납니다.

모바일 브라우저에서 푸시 알림 선택

참고 : 푸시 알림 팝업 프롬프트의 모양은 사이트의 http / https 설정에 따라 다를 수 있습니다.

이제이 푸시 알림 메시지가 다른 웹 사이트에서 보는 것과 다른 모양을 보이는 이유가 궁금 할 것입니다.

일반적으로 사용자는 다음과 같은 브라우저 기본 알림 메시지를 보게됩니다.

푸시 알림을위한 기본 브라우저 프롬프트

이제 문제는 사용자가 '차단'버튼을 클릭하면 알림 구독을위한 프롬프트가 표시되지 않는다는 것입니다. 이를 해결하기 위해 OneSignal에는 두 가지 프롬프트 유형이 있습니다.

첫 번째는 밀어 넣기 알림 팝업이고 다른 하나는 구독 벨 아이콘입니다. 둘 다 완벽하게 사용자 정의 할 수 있으며 필요에 맞게 변경할 수 있습니다.

2 단계. 푸시 알림 팝업 프롬프트 사용자 지정

기본적인 푸시 알림 팝업은 아주 간단합니다. 일반 언어를 사용하고 사이트의 로고를 표시합니다. 좀 더 개인적으로하기 위해이를 사용자 정의 할 수 있습니다.

워드프레스 사이트의 OneSignal 플러그인 설정 페이지에서 구성 탭으로 전환하고 'HTTP 팝업 설정'섹션으로 스크롤하면됩니다.

푸시 알림 팝업 맞춤 설정

'HTTP 팝업 프롬프트 텍스트 사용자 정의'옆의 토글을 클릭 한 다음 자신 만의 텍스트를 추가해야합니다.

프롬프트를 테스트하기 전에 저장 버튼을 클릭하여 설정을 저장하는 것을 잊지 마십시오.

3 단계. 벨 알림 아이콘 사용자 정의

일반적으로 사용자가 브라우저를 닫을 때 알림 및 팝업에 대한 브라우저 프롬프트가 사라집니다.

나중에 사용자가 마음이 바뀌고 푸시 알림을 받고 싶다면 어떻게해야합니까?

OneSignal의 구독 벨을 사용하면 사용자가 사이트에서 푸시 알림을 구독하라는 메시지를 계속 표시 할 수 있습니다.

벨 아이콘은 플러그인의 설정 페이지에서도 완벽하게 사용자 정의 할 수 있습니다. '프롬프트 설정 및 구독 벨'섹션으로 스크롤하고 변경하려는 사용자 정의 옵션을 켜십시오.

구독 벨 설정

그런 다음 아래로 스크롤하여 사용자 정의하려는 각 옵션의 설정을 변경할 수 있습니다. 이상적으로, 자신의 테마 색상에 맞게 벨 아이콘 색상을 변경하고 싶을 것입니다.

종 모양 아이콘 사용자 정의

참고 : 벨 아이콘이 너무 복잡하기 때문에 벨 아이콘을 사용하지 않습니다.

4 단계. 워드프레스 사이트에서 푸시 알림 보내기

기본적으로 OneSignal 플러그인은 웹 사이트에 게시 된 모든 새로운 게시물에 대한 푸시 알림을 자동으로 보냅니다. 원하는 경우 '자동 알림 설정'섹션의 플러그인 설정 페이지에서이 기능을 사용 중지 할 수 있습니다.

자동 알림 설정

게시물을 게시하거나 업데이트 할 때 수동으로 알림을 보낼 수도 있습니다. 단순히 워드프레스 게시물 또는 페이지를 편집하면 오른쪽의 문서 설정 열 아래에 OneSignal 메타 상자가 표시됩니다.

Gutenberg의 OneSignal 알림 상자

예전의 클래식 편집기를 사용하고 있다면, 다음과 같은 메타 박스가 보일 것입니다 :

기본 편집기에서 푸시 알림 상자 보내기

'게시물 업데이트 / 게시시 알림 보내기'옆의 확인란을 선택한 다음 업데이트 또는 게시 버튼을 클릭하십시오.

이제 OneSignal은 기사를 모든 구독자에게 푸시 알림으로 보냅니다.

신규 구독자에게 환영 푸시 알림 보내기

새 구독자에게 환영 푸시 알림을 보낼 수도 있습니다. 워드프레스 관리 영역에서 OneSignal 설정 페이지를 방문하여 '환영 알림 설정'섹션으로 스크롤하십시오.

환영 인사

이제 새로운 사람이 푸시 알림을 구독하면 자신의 기기에서 환영 알림을 받게됩니다. 브라우저 및 장치에 따라 알림이 다르게 보일 수 있습니다.

Firefox를 통해 Mac에 환영 알림 표시됨

즉, 워드프레스 사이트에 웹 푸시 알림을 성공적으로 추가했습니다.

OneSignal 앱 대시 보드에서 맞춤 알림을 보낼 수도 있습니다. 이 과정은 매우 직관적이며 OneSignal에 로그인하면 화면상의 지침을 따를 수 있습니다.

다른 좋은 워드 프레스 푸시 알림 플러그인

처음부터 올바른 웹 푸시 알림 서비스를 선택하는 것이 중요합니다. 대부분의 공급자는 플랫폼에서 자물쇠를 채 웁니다. 푸시 알림 서비스를 변경하면 이전 가입자가 손실 될 수 있습니다. 의미는 전환하면 처음부터 시작할 것입니다.

따라서 구독자 목록을 이식성있게 만들기 위해 구성해야하는 모든 설정에 대해 공급자가 선택하도록 요청하는 것이 좋습니다.

WPBeginner에서는 합리적인 가격으로 필요한 기능을 갖추고 있기 때문에 OneSignal을 사용합니다.

  • OneSignal은 최대 30,000 명의 가입자를 대상으로 무제한 모바일 푸시 및 웹 푸시 알림 기능이있는 무료 워드프레스 푸시 알림 플러그인을 제공합니다.
  • 무료 계획이라도 세그먼트 화, 현지화, Google 애널리틱스 추적 및 강력한 API와 같은 기능을 포함합니다.
  • 모든 최고 이메일 마케팅 서비스와 함께 사용하여 웹 푸시 알림을 통해 뉴스 레터 이메일을 보낼 수 있습니다.

WordPress는 모든 선택에 관한 것입니다. 다음은 시도 할 수있는 다른 워드프레스 푸시 알림 플러그인입니다.

  • PushEngage 웹 푸시 알림 – 푸시 알림 서비스 공급자 인 PushEngage 용 커넥터 플러그인입니다. 그들은 2500 명의 가입자, 120 개의 통보 및 5000 번의 클릭으로 제한된 무료 플랜을 보유하고 있습니다.
  • PushAlert – 웹 푸시 알림 – 푸시 경고 웹 푸시 알림 서비스에 연결할 수 있습니다. 그들은 또한 3000 명의 가입자로 제한된 무료 플랜을 제공합니다.
  • PushCrew – 웹 사이트를 PushCrew의 푸시 알림 서비스에 연결합니다. 그들은 2000 명의 가입자로 제한된 무료 플랜을 제공합니다.
  • PushAssist – PushAssist 웹 푸시 알림 서비스 용 커넥터 플러그인입니다. 무료 플랜은 2000 명의 가입자로 제한됩니다.

이 기사가 워드프레스 사이트에 웹 푸시 알림을 추가하는 방법을 배우는 데 도움이 되었기를 바랍니다. 웹 사이트의 무료 비즈니스 이메일 주소를 얻는 방법에 대한 가이드를 볼 수도 있습니다.

이 기사가 마음에 들면 YouTube 채널 용 워드프레스 비디오 자습서에 가입하십시오. 우리를 찾을 수도 있습니다. 지저귀다 그리고 페이스 북.

게시물 워드프레스 사이트에 웹 푸시 알림을 추가하는 방법은 WPBeginner에서 처음 나타났습니다.

당신이 좋아할만한 글 작성자의 다른글