Cách thêm nút zalo vào Nút Share Icon và Flow Icon cho flatsome đơn giản

Zalo hiện là một trong những kênh liên lạc phổ biến tại Việt Nam, đặc biệt trong lĩnh vực bán hàng và chăm sóc khách hàng. Nếu bạn đang sử dụng theme Flatsome và muốn thêm nút chia sẻ Zalo bên cạnh các mạng xã hội như Facebook, Twitter,… thì bài viết này là dành cho bạn.

Vì sao nên thêm Zalo vào nút chia sẻ?

Tăng khả năng tiếp cận khách hàng Việt.
Hỗ trợ tư vấn, chăm sóc khách hàng nhanh chóng qua Zalo.
Giúp người dùng chia sẻ sản phẩm/bài viết đến bạn bè qua Zalo dễ dàng.

Các bước thêm Zalo vào icon chia sẻ trong theme Flatsome

Bước 1: Kích hoạt Child Theme của Flatsome

Để đảm bảo các thay đổi không bị mất khi update theme, bạn cần chỉnh sửa trên Child Theme.

Nếu bạn chưa có child theme, hãy cài đặt Flatsome Child Theme trước.

Bước 2: Mở file functions.php của Child Theme

Vào thư mục chứa child theme, sau đó mở file:

wp-content/themes/flatsome-child/functions.php

1	wp-content/themes/flatsome-child/functions.php

Bước 3: Thêm đoạn mã Zalo vào file functions.php

Sao chép và dán đoạn code sau vào cuối file functions.php:

add_filter( 'flatsome_follow_links', function ( $share_links, $args ) {
  $share_links['class_zalo'] = array(
    'enabled'  => true,
    'atts'     => array(
      'href'       => add_query_arg( array(
        'text' => rawurlencode( $args['post_title'] . ' ' . $args['link'] ),
      ), 'https://zalo.me/0983676959' ),
      'onclick'    => $args['on_click'],
      'rel'        => 'nofollow',
      'target'     => '_blank',
      'class'      => $args['classes'] . ' class-zalo',
      'title'      => 'Chát Zalo',
      'aria-label' => 'Chát Zalo',
    ),
    'icon'     => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 161.5 161.5" width="30" height="30">...[SVG ICON ZALO]...</svg>',
    'priority' => 15,
  );
  return $share_links;
}, 10, 2 );

add_filter( 'flatsome_share_links', function ( $share_links, $args ) {
  $share_links['class_zalo'] = array(
    'enabled'  => true,
    'atts'     => array(
      'href'       => add_query_arg( array(
        'text' => rawurlencode( $args['post_title'] . ' ' . $args['link'] ),
      ), 'https://zalo.me/0983676959' ),
      'onclick'    => $args['on_click'],
      'rel'        => 'nofollow',
      'target'     => '_blank',
      'class'      => $args['classes'] . ' class-zalo',
      'title'      => 'Chát Zalo',
      'aria-label' => 'Chát Zalo',
    ),
    'icon'     => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 161.5 161.5" width="30" height="30">...[SVG ICON ZALO]...</svg>',
    'priority' => 15,
  );
  return $share_links;
}, 10, 2 );

add_filter( 'flatsome_follow_links', function ( $share_links, $args ) {

$share_links['class_zalo'] = array(

'enabled' => true,

'atts' => array(

'href' => add_query_arg( array(

'text' => rawurlencode( $args['post_title'] . ' ' . $args['link'] ),

), 'https://zalo.me/0983676959' ),

'onclick' => $args['on_click'],

'rel' => 'nofollow',

'target' => '_blank',

'class' => $args['classes'] . ' class-zalo',

'title' => 'Chát Zalo',

'aria-label' => 'Chát Zalo',

'icon' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 161.5 161.5" width="30" height="30">...[SVG ICON ZALO]...</svg>',

'priority' => 15,

);

return $share_links;

}, 10, 2 );

add_filter( 'flatsome_share_links', function ( $share_links, $args ) {