{"id":400589,"date":"2026-11-10T17:30:22","date_gmt":"2026-11-10T17:30:22","guid":{"rendered":"https:\/\/wordpress.org\/plugins\/xevn-floating-contact-buttons\/"},"modified":"2026-11-10T17:29:50","modified_gmt":"2026-11-10T17:29:50","slug":"kianguyen-floating-contact-buttons","status":"publish","type":"plugin","link":"https:\/\/wordpress.org\/plugins\/kianguyen-floating-contact-buttons\/","author":17366564,"comment_status":"closed","ping_status":"closed","template":"","meta":{"version":"1.0.0","stable_tag":"1.0.0","tested":"7.1.4","requires":"5.5","requires_php":"7.4","requires_plugins":null,"header_name":"Kianguyen Floating Contact Buttons","header_author":"kianguyen","header_description":"Floating contact buttons for call, Zalo, Messenger, WhatsApp, Viber, Telegram, Facebook, TikTok, YouTube, Instagram, email, SMS and maps, with full-color logos, grouping, working hours and Google Tag Manager click tracking.","last_updated":"2026-11-10 17:29:50","external_support_url":"","external_repository_url":"","donate_link":"https:\/\/xeisuzuvn.com\/donate\/","header_plugin_uri":"","header_author_uri":"https:\/\/xeisuzuvn.com","rating":0,"author_block_rating":0,"active_installs":0,"downloads":50,"num_ratings":0,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":{"1.0.0":{"tag":"1.0.0","author":"kianguyen","date":"2026-11-10 17:29:50","revision":3794955}},"upgrade_notice":{"1.0.0":"<p>First release.<\/p>"},"ratings":[],"assets_icons":{"icon-128x128.png":{"filename":"icon-128x128.png","revision":3794955,"resolution":"128x128","location":"assets","locale":"","width":128,"height":128},"icon-256x256.png":{"filename":"icon-256x256.png","revision":3794955,"resolution":"256x256","location":"assets","locale":"","width":256,"height":256}},"assets_banners":{"banner-1544x500.png":{"filename":"banner-1544x500.png","revision":3794955,"resolution":"1544x500","location":"assets","locale":"","width":1544,"height":500},"banner-772x250.png":{"filename":"banner-772x250.png","revision":3794955,"resolution":"772x250","location":"assets","locale":"","width":772,"height":250}},"assets_blueprints":{},"all_blocks":[],"tagged_versions":["1.0.0"],"block_files":[],"assets_screenshots":{"screenshot-1.png":{"filename":"screenshot-1.png","revision":3794955,"resolution":"1","location":"assets","locale":"","width":1280,"height":720},"screenshot-2.png":{"filename":"screenshot-2.png","revision":3794955,"resolution":"2","location":"assets","locale":"","width":1280,"height":720},"screenshot-3.png":{"filename":"screenshot-3.png","revision":3794999,"resolution":"3","location":"assets","locale":"","width":1440,"height":900}},"screenshots":{"1":"Floating buttons with full-color platform logos and hover tooltip.","2":"Icon with label style.","3":"Settings page: buttons with icon choice (platform logo, simple icon or uploaded image)."}},"plugin_section":[],"plugin_tags":[2489,2734,30237,3160,150432],"plugin_category":[],"plugin_contributors":[286515],"plugin_business_model":[],"class_list":["post-400589","plugin","type-plugin","status-publish","hentry","plugin_tags-click-to-call","plugin_tags-contact-button","plugin_tags-floating-button","plugin_tags-whatsapp","plugin_tags-zalo","plugin_contributors-kianguyen","plugin_committers-kianguyen"],"banners":{"banner":"https:\/\/ps.w.org\/kianguyen-floating-contact-buttons\/assets\/banner-772x250.png?rev=3794955","banner_2x":"https:\/\/ps.w.org\/kianguyen-floating-contact-buttons\/assets\/banner-1544x500.png?rev=3794955","banner_rtl":false,"banner_2x_rtl":false},"icons":{"svg":false,"icon":"https:\/\/ps.w.org\/kianguyen-floating-contact-buttons\/assets\/icon-128x128.png?rev=3794955","icon_2x":"https:\/\/ps.w.org\/kianguyen-floating-contact-buttons\/assets\/icon-256x256.png?rev=3794955","generated":false},"screenshots":[{"src":"https:\/\/ps.w.org\/kianguyen-floating-contact-buttons\/assets\/screenshot-1.png?rev=3794955","caption":"Floating buttons with full-color platform logos and hover tooltip."},{"src":"https:\/\/ps.w.org\/kianguyen-floating-contact-buttons\/assets\/screenshot-2.png?rev=3794955","caption":"Icon with label style."},{"src":"https:\/\/ps.w.org\/kianguyen-floating-contact-buttons\/assets\/screenshot-3.png?rev=3794999","caption":"Settings page: buttons with icon choice (platform logo, simple icon or uploaded image)."}],"raw_content":"<!--section=description-->\n<p>Kianguyen Floating Contact Buttons adds a small stack of contact buttons to the corner of your website so visitors can call, chat or find you in one tap.<\/p>\n\n<p><strong>Button types<\/strong><\/p>\n\n<ul>\n<li>Call (tel:), SMS and email<\/li>\n<li>Zalo, Messenger, Viber, WhatsApp and Telegram<\/li>\n<li>Facebook, TikTok, YouTube and Instagram<\/li>\n<li>Directions (map link) and any custom link<\/li>\n<\/ul>\n\n<p><strong>Customize each button<\/strong><\/p>\n\n<ul>\n<li>Four icon choices: full-color app-style platform logo (default), white logo on the button color, a simple icon, or your own image uploaded from the Media Library<\/li>\n<li>Your own label and color (brand colors are pre-filled)<\/li>\n<li>Show on all devices, mobile only or desktop only<\/li>\n<li>Optional attention effect: ringing icon, pulse ring or bounce<\/li>\n<li>Reorder, enable or disable buttons at any time (up to 12 buttons)<\/li>\n<\/ul>\n\n<p><strong>Made for real visitors<\/strong><\/p>\n\n<ul>\n<li>Group buttons: show one \"Contact us\" button that opens the list (choose separately for phones and computers)<\/li>\n<li>Call button on computers: shows the phone number with a \"Copy number\" button instead of a tel: link computers cannot open<\/li>\n<li>Pre-filled messages for WhatsApp, SMS and email, with {title} and {url} placeholders for the current page<\/li>\n<li>Working hours with a weekly schedule (different hours per day, e.g. half-day Saturday): show a button only during or only outside working hours<\/li>\n<li>Page-specific button sets: e.g. the sales hotline on product pages and the workshop number on service pages, matched by page address, post\/page ID or category<\/li>\n<li>Show the buttons right away, after the visitor scrolls, or after a few seconds<\/li>\n<\/ul>\n\n<p><strong>Easy to set up<\/strong><\/p>\n\n<ul>\n<li>Phone \/ Computer switch on the settings page: each device shows only its own settings, with a live preview in the corner that updates as you edit (and can be hidden)<\/li>\n<li>Export and import settings as a .json file to copy them to another website<\/li>\n<\/ul>\n\n<p><strong>Placement and style<\/strong><\/p>\n\n<ul>\n<li>Bottom right or bottom left, with adjustable distance, size and spacing, set separately for phones and computers<\/li>\n<li>On phones, optionally a horizontal bar at the bottom of the screen with labels under each icon and one larger \"featured\" button raised in the middle<\/li>\n<li>Round icons with hover tooltip, or icons with labels<\/li>\n<li>Hover colors are generated from your chosen color automatically<\/li>\n<li>Label text switches between white and dark automatically so it stays readable (WCAG contrast) on any button color<\/li>\n<\/ul>\n\n<p><strong>Show only where you want<\/strong><\/p>\n\n<ul>\n<li>Hide on the front page, on all single posts of a post type, or on specific post\/page IDs<\/li>\n<li>\"Hide contact buttons on this page\" checkbox in the post editor sidebar<\/li>\n<\/ul>\n\n<p><strong>Click tracking for Google Tag Manager<\/strong><\/p>\n\n<p>Each click pushes an event to <code>dataLayer<\/code> (default name <code>contact_button_click<\/code>) with <code>button_type<\/code>, <code>button_label<\/code>, <code>button_url<\/code>, <code>page_location<\/code> and <code>button_set<\/code> (the page-specific set name, or <code>default<\/code>) (copying the number in the desktop call box is sent with <code>button_type<\/code> = <code>phone_copy<\/code>), so you can build GA4 or Google Ads conversions in GTM. Optionally the same event is sent through <code>gtag()<\/code> if gtag.js is already on your page.<\/p>\n\n<p><strong>Lightweight and cache friendly<\/strong><\/p>\n\n<ul>\n<li>No external requests, no CDN, no jQuery on the front end (logos are bundled as inline SVG)<\/li>\n<li>Assets load only on pages where buttons are shown<\/li>\n<li>Mobile\/desktop rules use CSS media queries, so full-page caches (LiteSpeed Cache, WP Rocket, etc.) work correctly<\/li>\n<li>Respects visitors who prefer reduced motion<\/li>\n<\/ul>\n\n<p><strong>Privacy<\/strong><\/p>\n\n<p>The plugin does not collect, store or send any visitor data. Click tracking only adds an event to the <code>dataLayer<\/code> of your own page; what happens next depends on the tags you configure.<\/p>\n\n<p><strong>Ti\u1ebfng Vi\u1ec7t<\/strong><\/p>\n\n<p>Plugin t\u1ea1o c\u00e1c n\u00fat li\u00ean h\u1ec7 n\u1ed5i (G\u1ecdi, Zalo, Messenger, Viber, WhatsApp, Telegram, Email, SMS, Ch\u1ec9 \u0111\u01b0\u1eddng, link tu\u1ef3 \u00fd) \u1edf g\u00f3c m\u00e0n h\u00ecnh. C\u00f3 th\u00eam n\u00fat Facebook, TikTok, YouTube, Instagram. C\u00e1c n\u00fat m\u1ea1ng x\u00e3 h\u1ed9i m\u1eb7c \u0111\u1ecbnh d\u00f9ng logo m\u00e0u gi\u1ed1ng icon app; c\u00f3 th\u1ec3 \u0111\u1ed5i sang logo tr\u1eafng tr\u00ean n\u1ec1n m\u00e0u, bi\u1ec3u t\u01b0\u1ee3ng \u0111\u01a1n gi\u1ea3n ho\u1eb7c t\u1ea3i \u1ea3nh ri\u00eang l\u00ean. M\u1ed7i n\u00fat ch\u1ec9nh \u0111\u01b0\u1ee3c m\u00e0u, nh\u00e3n, hi\u1ec3n th\u1ecb theo thi\u1ebft b\u1ecb v\u00e0 c\u00f3 hi\u1ec7u \u1ee9ng rung\/s\u00f3ng \u0111\u1ec3 g\u00e2y ch\u00fa \u00fd. C\u00f3 th\u1ec3 gom c\u00e1c n\u00fat th\u00e0nh m\u1ed9t n\u00fat \"Li\u00ean h\u1ec7\", hi\u1ec7n s\u1ed1 \u0111i\u1ec7n tho\u1ea1i k\u00e8m n\u00fat sao ch\u00e9p khi kh\u00e1ch xem tr\u00ean m\u00e1y t\u00ednh, so\u1ea1n s\u1eb5n tin nh\u1eafn cho WhatsApp\/SMS\/Email, \u1ea9n\/hi\u1ec7n n\u00fat theo gi\u1edd l\u00e0m vi\u1ec7c, hi\u1ec7n n\u00fat sau khi cu\u1ed9n trang ho\u1eb7c sau v\u00e0i gi\u00e2y. Tr\u00ean \u0111i\u1ec7n tho\u1ea1i c\u00f3 th\u1ec3 ch\u1ecdn ki\u1ec3u thanh ngang \u1edf \u0111\u00e1y m\u00e0n h\u00ecnh, v\u1edbi m\u1ed9t n\u00fat n\u1ed5i b\u1eadt nh\u00f4 l\u00ean \u1edf gi\u1eefa. C\u00f3 th\u1ec3 t\u1ea1o b\u1ed9 n\u00fat ri\u00eang cho t\u1eebng nh\u00f3m trang (v\u00ed d\u1ee5 trang xe t\u1ea3i d\u00f9ng hotline b\u00e1n h\u00e0ng, trang d\u1ecbch v\u1ee5 d\u00f9ng s\u1ed1 x\u01b0\u1edfng) v\u00e0 \u0111\u1eb7t gi\u1edd l\u00e0m vi\u1ec7c kh\u00e1c nhau cho t\u1eebng ng\u00e0y. Trang c\u00e0i \u0111\u1eb7t c\u00f3 c\u00f4ng t\u1eafc \u0110i\u1ec7n tho\u1ea1i \/ M\u00e1y t\u00ednh: m\u1ed7i thi\u1ebft b\u1ecb c\u00f3 v\u1ecb tr\u00ed, kho\u1ea3ng c\u00e1ch m\u00e9p, k\u00edch th\u01b0\u1edbc, kho\u1ea3ng c\u00e1ch gi\u1eefa c\u00e1c n\u00fat v\u00e0 gom nh\u00f3m ri\u00eang, k\u00e8m xem tr\u01b0\u1edbc tr\u1ef1c ti\u1ebfp; c\u00f3 xu\u1ea5t\/nh\u1eadp c\u00e0i \u0111\u1eb7t \u0111\u1ec3 ch\u00e9p sang website kh\u00e1c. C\u00f3 th\u1ec3 \u1ea9n n\u00fat tr\u00ean trang ch\u1ee7, theo lo\u1ea1i n\u1ed9i dung, theo ID ho\u1eb7c ngay trong m\u00e0n h\u00ecnh s\u1eeda b\u00e0i. M\u1ed7i l\u01b0\u1ee3t b\u1ea5m \u0111\u01b0\u1ee3c \u0111\u1ea9y v\u00e0o dataLayer \u0111\u1ec3 \u0111o l\u01b0\u1eddng b\u1eb1ng Google Tag Manager. V\u00e0o <strong>C\u00e0i \u0111\u1eb7t \u2192 N\u00fat li\u00ean h\u1ec7<\/strong>, m\u1ee5c <strong>Ng\u00f4n ng\u1eef hi\u1ec3n th\u1ecb<\/strong>, ch\u1ecdn <strong>Ti\u1ebfng Vi\u1ec7t<\/strong> \u0111\u1ec3 d\u00f9ng giao di\u1ec7n ti\u1ebfng Vi\u1ec7t.<\/p>\n\n<h3>Third-party resources<\/h3>\n\n<ul>\n<li>Simple Icons 16.36.0 - https:\/\/simpleicons.org - License: CC0 1.0 Universal (licenses\/simple-icons-LICENSE.md). Used for the platform logo shapes in includes\/brand-icons.php.<\/li>\n<\/ul>\n\n<!--section=installation-->\n<ol>\n<li>Upload the <code>kianguyen-floating-contact-buttons<\/code> folder to <code>\/wp-content\/plugins\/<\/code>, or install it from the Plugins screen.<\/li>\n<li>Activate the plugin.<\/li>\n<li>Go to <strong>Settings \u2192 Contact Buttons<\/strong>, enter your phone number, Zalo number or other contacts, and save.<\/li>\n<\/ol>\n\n<!--section=faq-->\n<dl>\n<dt id=\"why%20is%20a%20button%20not%20showing%3F\"><h3>Why is a button not showing?<\/h3><\/dt>\n<dd><p>A button is shown only when it is enabled and has a phone number, username or link. Also check its \"Show on\" setting, the mobile breakpoint, and the \"Hide on\" options.<\/p><\/dd>\n<dt id=\"how%20do%20i%20track%20clicks%20in%20google%20tag%20manager%3F\"><h3>How do I track clicks in Google Tag Manager?<\/h3><\/dt>\n<dd><p>Keep \"Push a dataLayer event\" on. In GTM, create a Custom Event trigger with the event name <code>contact_button_click<\/code> (or the name you set), add Data Layer Variables for <code>button_type<\/code>, <code>button_label<\/code> and <code>button_url<\/code>, then use them in your GA4 event or Google Ads conversion tag.<\/p><\/dd>\n<dt id=\"how%20do%20i%20use%20different%20numbers%20on%20different%20pages%3F\"><h3>How do I use different numbers on different pages?<\/h3><\/dt>\n<dd><p>In Settings \u2192 Contact Buttons \u2192 Buttons, click \"+ Add a set for specific pages\". Give the set a name, enter the page addresses it applies to (for example \/products\/), post\/page IDs or category slugs, then add its buttons or click \"Copy buttons from Default\" and change the numbers. Each page uses the first enabled set that matches; other pages use the Default buttons. The choice is made on the server for each page, so it works with page caching.<\/p><\/dd>\n<dt id=\"does%20the%20messenger%20button%20work%20for%20personal%20profiles%3F\"><h3>Does the Messenger button work for personal profiles?<\/h3><\/dt>\n<dd><p>Yes. Enter the username of your Facebook page or personal profile, or paste a full m.me link. For a personal profile, your Facebook privacy settings decide who can message you.<\/p><\/dd>\n<dt id=\"how%20do%20working%20hours%20work%3F\"><h3>How do working hours work?<\/h3><\/dt>\n<dd><p>Turn on Settings \u2192 Contact Buttons \u2192 Working hours, set the opening hours for each day of the week, then set each button to \"Only during working hours\" or \"Only outside working hours\". The check uses your site time zone and runs in the visitor's browser, so it stays correct with page caching. If JavaScript is off, all buttons are shown.<\/p><\/dd>\n<dt id=\"which%20buttons%20support%20a%20pre-filled%20message%3F\"><h3>Which buttons support a pre-filled message?<\/h3><\/dt>\n<dd><p>WhatsApp, SMS and email. Zalo and Messenger links do not support pre-filled text. Use {title} and {url} to insert the current page title and link.<\/p><\/dd>\n<dt id=\"can%20i%20use%20my%20own%20icons%3F\"><h3>Can I use my own icons?<\/h3><\/dt>\n<dd><p>Yes. Set the button's Icon to \"Uploaded image\", then upload or pick an image from the Media Library (or paste an image URL). In the round style the image fills the whole button like an app icon, so a square PNG or WebP of the platform's app icon works best.<\/p><\/dd>\n<dt id=\"does%20it%20work%20with%20caching%20plugins%3F\"><h3>Does it work with caching plugins?<\/h3><\/dt>\n<dd><p>Yes. The buttons are rendered in the page HTML and mobile\/desktop rules use CSS only. There is no AJAX and no nonce on the front end.<\/p><\/dd>\n<dt id=\"how%20do%20i%20hide%20the%20buttons%20on%20one%20page%3F\"><h3>How do I hide the buttons on one page?<\/h3><\/dt>\n<dd><p>Edit the page and tick \"Hide contact buttons on this page\" in the sidebar, or enter its ID in Settings \u2192 Contact Buttons \u2192 Hide on these IDs.<\/p><\/dd>\n<dt id=\"how%20do%20i%20show%20the%20plugin%20in%20vietnamese%3F%20%2F%20l%C3%A0m%20sao%20d%C3%B9ng%20ti%E1%BA%BFng%20vi%E1%BB%87t%3F\"><h3>How do I show the plugin in Vietnamese? \/ L\u00e0m sao d\u00f9ng ti\u1ebfng Vi\u1ec7t?<\/h3><\/dt>\n<dd><p>Go to Settings \u2192 Contact Buttons \u2192 Display language and choose \"Ti\u1ebfng Vi\u1ec7t\". \"Same as website\" uses community translations first and falls back to the built-in Vietnamese text when your site language is Vietnamese.<\/p>\n\n<p>V\u00e0o C\u00e0i \u0111\u1eb7t \u2192 N\u00fat li\u00ean h\u1ec7 \u2192 Ng\u00f4n ng\u1eef hi\u1ec3n th\u1ecb, ch\u1ecdn \"Ti\u1ebfng Vi\u1ec7t\". Ch\u1ebf \u0111\u1ed9 \"Theo ng\u00f4n ng\u1eef website\" s\u1ebd t\u1ef1 d\u00f9ng ti\u1ebfng Vi\u1ec7t khi website \u0111\u1eb7t ng\u00f4n ng\u1eef Ti\u1ebfng Vi\u1ec7t.<\/p><\/dd>\n<dt id=\"where%20do%20the%20platform%20logos%20come%20from%3F\"><h3>Where do the platform logos come from?<\/h3><\/dt>\n<dd><p>The logo shapes for Zalo, Messenger, Viber, WhatsApp, Telegram, Facebook, TikTok, YouTube and Instagram come from Simple Icons (CC0) and are bundled with the plugin. The plugin draws them in each brand's colors (app-style) or in white on the button color. They are updated with plugin releases. All logos are trademarks of their respective owners and are used only to identify each service; please follow each brand's own usage guidelines. Call, SMS, email, directions and link buttons use icons drawn for this plugin.<\/p><\/dd>\n<dt id=\"how%20do%20i%20copy%20my%20settings%20to%20another%20website%3F\"><h3>How do I copy my settings to another website?<\/h3><\/dt>\n<dd><p>Go to Settings \u2192 Contact Buttons \u2192 Export \/ import settings, click \"Export settings\" to download a .json file, then use \"Import settings\" on the other website. Importing replaces all settings there.<\/p><\/dd>\n<dt id=\"can%20phones%20and%20computers%20have%20different%20settings%3F\"><h3>Can phones and computers have different settings?<\/h3><\/dt>\n<dd><p>Yes. At the top of Settings \u2192 Contact Buttons, switch between \"Phone\" and \"Computer\". Each device has its own position, distance from the edges, button size, spacing between buttons and grouping, and the preview in the corner follows the device you picked. Buttons, working hours, tracking and language are shared. When you update from an earlier build, the phone settings start with your current computer values.<\/p><\/dd>\n<dt id=\"what%20does%20the%20phone%20bar%20look%20like%3F\"><h3>What does the phone bar look like?<\/h3><\/dt>\n<dd><p>Switch to \"Phone\" at the top of Settings \u2192 Contact Buttons, then choose Style on phones \u2192 Layout \u2192 \"Horizontal bar at the bottom of the screen\". All buttons sit side by side with their labels; tick \"Featured\" on one button (for example Call) to make it larger and raised in the middle. The page gets extra space at the bottom so the bar does not cover content. Computers keep the floating buttons.<\/p><\/dd>\n\n<\/dl>\n\n<!--section=changelog-->\n<h4>1.0.0<\/h4>\n\n<ul>\n<li>First release.<\/li>\n<\/ul>","raw_excerpt":"Floating call, Zalo, Messenger, WhatsApp, Telegram, Facebook, TikTok and YouTube buttons with full-color logos and GTM click tracking.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/400589","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=400589"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/kianguyen"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=400589"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=400589"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=400589"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=400589"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=400589"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=400589"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}