https://a.storyblok.com/f/270183/106538/0f17d176b1/e_shipping-notifications_1200x600.png

Notificações de envio no WooCommerce do WordPress, com tecnologia Nexmo SMS

Publicado em April 26, 2021

Tempo de leitura: 6 minutos

Introdução

A experiência do cliente após uma compra desempenha um papel fundamental na retenção de usuários para qualquer empresa. No comércio eletrônico, a experiência pós-compra inclui notificações oportunas sempre que o status do pedido do usuário é alterado. Essas notificações oportunas sobre o status do pedido mantêm os clientes satisfeitos e reduzem a necessidade de conversas repetitivas com o atendimento ao cliente.

Neste tutorial, vamos configurar uma integração simples entre o WooCommerce do WordPress e o Nexmo SMS para notificar o cliente (por SMS) quando o status de envio do pedido dele mudar.

Ao final deste tutorial, você terá uma boa compreensão de como criar um plugin para o WordPress, como funcionam as ações do WordPress e como integrar a API da Nexmo para enviar SMS no WordPress usando o SDK PHP da Nexmo.

Vamos começar!

O que você precisa para começar:

  • Site WordPress auto-hospedado

  • WooCommerce plug-in instalado

Esboço

Vamos dividir esse projeto em etapas práticas e implementá-las de cima para baixo:

  • Crie seu plugin para o WordPress

  • Adicione o SDK do Nexmo para PHP ao plugin

  • Fique atento às alterações no status dos pedidos no WooCommerce

  • Enviar um SMS quando o status do pedido for alterado

Criando seu plugin para o WordPress

Embora seja possível criar um plugin do WordPress simplesmente adicionando uma nova pasta na pasta de plugins do WordPress, uma maneira mais eficiente é começar com um modelo básico leve. Os modelos são úteis para configurar todos os arquivos e classes de maneira padronizada. Neste tutorial, usaremos o gerador de modelos de plug-ins do WordPress (wppb) ; basta preencher os detalhes no site e clicar no botão “Build Plugin” para baixar seu modelo de plugin.

boilerplate generatorboilerplate generator

Depois de fazer isso, extraia o arquivo zip e coloque-o na pasta de plugins do WordPress. Em seguida, acesse o painel de administração do WordPress, vá até a página de plugins instalados e clique no botão “Ativar” para ativar o seu plugin:

WordPress installed plugins pageWordPress installed plugins page

Incorporando a biblioteca PHP da Nexmo

A Nexmo recomenda que você instale a biblioteca PHP via Composer; portanto, você precisará ter o Composer configurado no seu servidor ou sistema local. Caso ainda não tenha o Composer configurado, aqui estão dois guias recomendados pela Nexmo para ajudá-lo: https://getcomposer.org/doc/00-intro.md ou https://scotch.io/tutorials/a-beginners-guide-to-composer

Com o Composer instalado, abra o terminal, acesse a pasta do seu plugin (geralmente fica no caminho: /your-wordpress-server-folder/wp-content/plugins/you-plugin-folder-name/ ) e execute:

composer require nexmo/client

Isso criará uma nova pasta chamada vendor que contém várias outras bibliotecas — incluindo a biblioteca PHP da Nexmo. Para incluir a biblioteca no seu plugin, basta adicionar esta linha ao arquivo PHP raiz do seu plugin:

require_once plugin_dir_path( __FILE__ ) . 'vendor/autoload.php';

Inicializando a classe Nexmo

Antes de fazer qualquer chamada com a biblioteca PHP da Nexmo, é preciso inicializar a classe Nexmo e usar o objeto cliente para realizar suas solicitações subsequentes:

$basic  = new \Nexmo\Client\Credentials\Basic(NEXMO_API_KEY, NEXMO_API_SECRET);
$client = new \Nexmo\Client(new \Nexmo\Client\Credentials\Container($basic));

Sua chave e seu segredo da API podem ser encontrados na seção ‘Introdução" no seu painel do Nexmo.

Se você estiver usando o modelo padrão, poderá fazer as seguintes alterações no arquivo de classe pública na pasta /public . Vamos inicializar a biblioteca Nexmo no construtor e definir o objeto cliente como uma propriedade protegida para que outros métodos da nossa classe pública possam acessá-lo:

class Nexmo_Wc_Sms_Order_Status_Notification_Public {
 
   protected $nexmo_client;
   public function __construct( $plugin_name, $version ) {
 
       $this->plugin_name = $plugin_name;
       $this->version = $version;
 
       $this->nexmo_client = new Nexmo\Client(new Nexmo\Client\Credentials\Basic(WC_SMS_ORDER_NEXMO_KEY, WC_SMS_ORDER_NEXMO_SECRET));
      
   }

Com essa configuração, adicionamos a biblioteca da Nexmo ao nosso plugin do WordPress e podemos acessar todas as funções relacionadas à biblioteca por meio da propriedade da classe $this->nexmo_client. Em seguida, vamos monitorar as alterações no status dos pedidos do WooCommerce e enviar a notificação por SMS.

Introdução às ações do WordPress

A maioria das edições que você fará no WordPress envolve vincular suas funções a ações existentes do WordPress. Ações são funções executadas quando um determinado evento ocorre no WordPress. Se você quiser que sua função seja executada quando um evento específico ocorrer — por exemplo, quando o status de um pedido for alterado —, você deverá vincular sua função à ação de alteração do status do pedido.

Você vincula sua função a uma ação existente desta forma:

add_action( 'action_name', 'name_of_your_function' );

Incorporando a alteração do status do pedido no WooCommerce

Agora que já entendemos as ações do WordPress, vamos vincular nossa função que envia o SMS ao evento de alteração do status do pedido do WooCommerce, woocommerce_order_status_$STATUS_TRANSITION[to]. $STATUS_TRANSITION[to] seja qual for a mudança de status que você queira monitorar. Por exemplo, 'woocommerce_order_status_pending' aciona nossa função quando o status do pedido muda para “pendente”.

Aqui está um exemplo de código para deixar isso mais claro — os status padrão no WooCommerce são “pendente”, “falha”, “em espera”, “em processamento”, “concluído”, “reembolsado” e “cancelado”; e se quiséssemos associar uma função a cada um desses status, ficaria assim:

add_action( 'woocommerce_order_status_pending', 'send_customer_sms_notification');
       add_action( 'woocommerce_order_status_failed', 'send_customer_sms_notification');
       add_action( 'woocommerce_order_status_on-hold', 'send_customer_sms_notification');
       add_action( 'woocommerce_order_status_processing', 'send_customer_sms_notification');
       add_action( 'woocommerce_order_status_completed', 'send_customer_sms_notification');
       add_action( 'woocommerce_order_status_refunded', 'send_customer_sms_notification');
       add_action( 'woocommerce_order_status_cancelled', 'send_customer_sms_notification');

Para simplificar o código acima, vamos refatorá-lo para que fique com apenas 3 linhas de código:

class Nexmo_Wc_Sms_Order_Status_Notification_Public {
 
   protected $nexmo_client;
 
  
   public function __construct( $plugin_name, $version ) {
 
       $this->plugin_name = $plugin_name;
       $this->version = $version;
 
       foreach ( array( 'pending', 'failed', 'on-hold', 'processing', 'completed', 'refunded', 'cancelled' ) as $status ) {
           add_action( 'woocommerce_order_status_'. $status, array( $this, 'send_customer_sms_notification' ) );
       }
       $this->nexmo_client = new Nexmo\Client(new Nexmo\Client\Credentials\Basic(WC_SMS_ORDER_NEXMO_KEY, WC_SMS_ORDER_NEXMO_SECRET));
      
   }

A seguir, vamos criar nossa send_customer_sms_notification função que envia o SMS propriamente dito por meio do Nexmo SMS.

Envio da mensagem SMS

Essa parte é bem simples: ao vincular nossa função à ação de status do pedido do WooCommerce, obtemos o ID do pedido, que podemos usar para obter os detalhes do pedido e enviar o SMS.

   public function send_customer_sms_notification( $order_id ) {
       $order = wc_get_order( $order_id );
       $order_status = $order->get_status();
       $phone_number   = method_exists( $order, 'get_billing_phone' ) ? $order->get_billing_phone() : $order->billing_phone;
   }

Com base no exposto, usamos o ID do pedido para obter o objeto Order chamando a função do WooCommerce wc_get_order(), e, com o objeto Order, obtemos o status (esse é o novo status que acabou de ser atualizado) e o número de celular do cliente. Com todas essas informações, estamos prontos para enviar o SMS.

Vamos usar o trecho de código da documentação da Nexmo para enviar um SMS. No entanto, no nosso caso, a $client variável será a $nexmo_client propriedade que definimos anteriormente em nosso construtor:

public function send_customer_sms_notification( $order_id ) {
       $order = wc_get_order( $order_id );
       $order_status = $order->get_status();
       $phone_number   = method_exists( $order, 'get_billing_phone' ) ? $order->get_billing_phone() : $order->billing_phone;
       $message =  "Your order #".$order_id." status has been updated to ".$order_status;
      
       try {
           $message = $this->nexmo_client->message()->send([
               'to' => $phone_number,
               'from' => WC_SMS_ORDER_NEXMO_SENDER_NAME,
               'text' => $message
           ]);
           $response = $message->getResponseData();
      
           if($response['messages'][0]['status'] == 0) {
               $order_note = "Customer notified on order status change to ".$order_status." via SMS (".$phone_number.")";
           } else {
               $order_note = "Unable to notify customer on order status change via SMS. Error:". $response['messages'][0]['status'];
           }
       } catch (Exception $e) {
           $order_note = "Unable to notify customer on order status change via SMS. Error:". $e->getMessage();
       }
       $order->add_order_note( $order_note );
   }

Para acompanhar as mensagens enviadas, também adicionaremos uma nota ao pedido usando a função do WooCommerce add_order_note(). Essas notas podem ser visualizadas no painel de administração:

notes in adminnotes in admin

Para testar tudo, basta fazer um pedido na sua loja do WooCommerce, acessar o painel de administração e alterar o status do pedido para qualquer outro; você deverá receber um SMS com o novo status.

sms demosms demo

Aqui está um link para o arquivo Class completo e público.

Conclusão

Neste tutorial, aprendemos os conceitos básicos para criar um plugin do WordPress, como integrar a biblioteca PHP da Nexmo e como usar a SMS API da Nexmo para enviar uma mensagem SMS quando o status de um pedido do WooCommerce for alterado.

Espero que isso tenha sido muito útil para você — você pode conferir o código completo no GitHub por meio deste link.

Obrigado pela leitura!

Compartilhar:

https://a.storyblok.com/f/270183/384x384/6293d5e6de/douglaskendyson.png
Douglas Kendyson

Douglas is a full stack software engineer with a keen interest to marketing, customer growth and data analytics. When he’s not coding, he’s probably watching way too many TV shows.