Плавающая иконка whatsapp, telegram, max

/**
 * Плавающие кнопки мессенджеров для WordPress
 */

// Добавляем переменные для ссылок на мессенджеры (можно изменить на свои)
define('WHATSAPP_LINK', 'https://wa.me/7777777?text=Здравствуйте. Пишу с сайта domen.ru'); // Замените на свой номер WhatsApp
define('TELEGRAM_LINK', 'https://t.me/nickname'); // Замените на свой Telegram
define('MAX_LINK', 'https://max.ru/u/link'); // Замените на ссылку для Max

// Добавляем стили и скрипты
add_action('wp_footer', 'add_messenger_buttons');
function add_messenger_buttons() {
    ?>
    <style>
        .messenger-buttons {
            position: fixed;
            bottom: 60px;
            right: 20px;
            z-index: 9999;
            display: flex;
            flex-direction: column;
            gap: 10px;
        }
        
        .messenger-button {
            width: 56px;
            height: 56px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
            transition: all 0.2s ease;
            cursor: pointer;
            overflow: hidden;
        }
        
        .messenger-button:hover {
            transform: scale(1.05);
        }
        
        .messenger-button svg {
            width: 28px;
            height: 28px;
            transition: transform 0.2s ease;
        }
        
        .messenger-button.telegram {
            background: #37AEE2;
        }
        
        .messenger-button.whatsapp {
            background: #25D366;
        }
        
        .messenger-button.max {
            background: linear-gradient(90deg, #5a8cff -16.1%, #43d6ff 16.36%, #8f3fff 76.63%);
            color: white;
        }
        
        .messenger-button.max svg {
            width: 24px;
            height: 24px;
        }
        
        /* Адаптивность */
        @media (max-width: 768px) {
            .messenger-buttons {
                bottom: 45px;
                right: 15px;
            }
            
            .messenger-button {
                width: 50px;
                height: 50px;
            }
            
            .messenger-button svg {
                width: 24px;
                height: 24px;
            }
            
            .messenger-button.max svg {
                width: 20px;
                height: 20px;
            }
        }
        
        @media (max-width: 480px) {
            .messenger-buttons {
                bottom: 30px;
                right: 10px;
                gap: 8px;
            }
        }
    </style>
    
    <div class="messenger-buttons">
        <a href="<?php echo esc_url(WHATSAPP_LINK); ?>" 
           target="_blank" 
           rel="noopener noreferrer" 
           class="messenger-button whatsapp"
           title="Написать в WhatsApp">
            <svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24">
                <path fill="#FFFFFF" d="M16.6 14c-.2-.1-1.5-.7-1.7-.8-.2-.1-.4-.1-.6.1-.2.2-.6.8-.8 1-.1.2-.3.2-.5.1-.7-.3-1.4-.7-2-1.2-.5-.5-1-1.1-1.4-1.7-.1-.2 0-.4.1-.5.1-.1.2-.3.4-.4.1-.1.2-.3.2-.4.1-.1.1-.3 0-.4-.1-.1-.6-1.3-.8-1.8-.1-.7-.3-.7-.5-.7h-.5c-.2 0-.5.2-.6.3-.6.6-.9 1.3-.9 2.1.1.9.4 1.8 1 2.6 1.1 1.6 2.5 2.9 4.2 3.7.5.2.9.4 1.4.5.5.2 1 .2 1.6.1.7-.1 1.3-.6 1.7-1.2.2-.4.2-.8.1-1.2l-.4-.2m2.5-9.1C15.2 1 8.9 1 5 4.9c-3.2 3.2-3.8 8.1-1.6 12L2 22l5.3-1.4c1.5.8 3.1 1.2 4.7 1.2 5.5 0 9.9-4.4 9.9-9.9.1-2.6-1-5.1-2.8-7m-2.7 14c-1.3.8-2.8 1.3-4.4 1.3-1.5 0-2.9-.4-4.2-1.1l-.3-.2-3.1.8.8-3-.2-.3c-2.4-4-1.2-9 2.7-11.5S16.6 3.7 19 7.5c2.4 3.9 1.3 9-2.6 11.4"></path>
            </svg>
        </a>
        
        <a href="<?php echo esc_url(TELEGRAM_LINK); ?>" 
           target="_blank" 
           rel="noopener noreferrer" 
           class="messenger-button telegram"
           title="Написать в Telegram">
            <svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 100 100" viewBox="0 0 100 100">
                <path fill="#fff" d="M89.442,11.418c-12.533,5.19-66.27,27.449-81.118,33.516c-9.958,3.886-4.129,7.529-4.129,7.529s8.5,2.914,15.786,5.1
                    c7.286,2.186,11.172-0.243,11.172-0.243l34.244-23.073c12.143-8.257,9.229-1.457,6.315,1.457
                    c-6.315,6.315-16.758,16.272-25.501,24.287c-3.886,3.4-1.943,6.315-0.243,7.772c6.315,5.343,23.558,16.272,24.53,17.001
                    c5.131,3.632,15.223,8.861,16.758-2.186c0,0,6.072-38.13,6.072-38.13c1.943-12.872,3.886-24.773,4.129-28.173
                    C98.185,8.018,89.442,11.418,89.442,11.418z"></path>
            </svg>
        </a>
        
        <a href="<?php echo esc_url(MAX_LINK); ?>" 
           target="_blank" 
           rel="noopener noreferrer" 
           class="messenger-button max"
           title="Написать в Max">
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42 42" fill="none">
                <path fill="currentColor" fill-rule="evenodd" d="M21.47 41.88c-4.11 0-6.02-.6-9.34-3-2.1 2.7-8.75 4.81-9.04 1.2 0-2.71-.6-5-1.28-7.5C1 29.5.08 26.07.08 21.1.08 9.23 9.82.3 21.36.3c11.55 0 20.6 9.37 20.6 20.91a20.6 20.6 0 0 1-20.49 20.67Zm.17-31.32c-5.62-.29-10 3.6-10.97 9.7-.8 5.05.62 11.2 1.83 11.52.58.14 2.04-1.04 2.95-1.95a10.4 10.4 0 0 0 5.08 1.81 10.7 10.7 0 0 0 11.19-9.97 10.7 10.7 0 0 0-10.08-11.1Z" clip-rule="evenodd"></path>
            </svg>
        </a>
    </div>
    <?php
}

@seomur

Это сайт с моими заметками по wordpress и woocommerce