Добавление кнопок поделиться в социальных сетях на страницы настроек

Код PHP

//кнопки шеринга
// Добавляем меню и страницу настроек
add_action('admin_menu', 'sharing_buttons_admin_menu');

function sharing_buttons_admin_menu() {
    add_options_page(
        'Настройки кнопок шеринга',
        'Кнопки шеринга',
        'manage_options',
        'sharing-buttons-settings',
        'sharing_buttons_settings_page'
    );
}

// Функция для отображения страницы настроек
function sharing_buttons_settings_page() {
    ?>
    <div class="wrap">
        <h1>Настройки кнопок шеринга</h1>
        <form method="post" action="options.php">
            <?php
            settings_fields('sharing_buttons_settings_group');
            do_settings_sections('sharing-buttons-settings');
            submit_button('Сохранить настройки');
            ?>
        </form>
    </div>
    <?php
}

// Регистрация настроек и полей
add_action('admin_init', 'sharing_buttons_settings_init');

function sharing_buttons_settings_init() {
    register_setting('sharing_buttons_settings_group', 'sharing_buttons_settings', 'sanitize_sharing_buttons_settings');
    
    add_settings_section(
        'sharing_buttons_settings_section',
        'Настройки кнопок шеринга',
        null,
        'sharing-buttons-settings'
    );

    $fields = [
        'telegram_text' => 'Текст для Telegram',
        'whatsapp_text' => 'Текст для WhatsApp',
        'vk_text'       => 'Текст для ВКонтакте',
        'odnoklassniki_text' => 'Текст для Одноклассников',
        'telegram_logo' => 'Логотип Telegram (URL)',
        'whatsapp_logo' => 'Логотип WhatsApp (URL)',
        'vk_logo'       => 'Логотип ВКонтакте (URL)',
        'odnoklassniki_logo' => 'Логотип Одноклассников (URL)',
    ];

    foreach ($fields as $name => $label) {
        add_settings_field(
            $name,
            $label,
            'sharing_buttons_settings_field_callback',
            'sharing-buttons-settings',
            'sharing_buttons_settings_section',
            ['label_for' => $name]
        );
    }
}

function sharing_buttons_settings_field_callback($args) {
    $option = get_option('sharing_buttons_settings');
    $value = isset($option[$args['label_for']]) ? $option[$args['label_for']] : '';
    $field_id = esc_attr($args['label_for']);
    
    if (strpos($field_id, 'text') !== false) {
        echo '<input type="text" id="' . $field_id . '" name="sharing_buttons_settings[' . $field_id . ']" value="' . esc_attr($value) . '" class="regular-text" />';
    } else {
        echo '<input type="text" id="' . $field_id . '" name="sharing_buttons_settings[' . $field_id . ']" value="' . esc_url($value) . '" class="regular-text" />';
        echo '<input type="button" class="button upload_image_sharring_button" value="Загрузить изображение" data-target="' . $field_id . '" />';
        
        if ($value) {
            echo '<br /><img src="' . esc_url($value) . '" style="max-width: 100px; margin-top: 5px;" id="' . $field_id . '-preview" />';
            echo '<input type="button" class="button remove_image_button" value="Удалить изображение" data-target="' . $field_id . '" />';
        } else {
            echo '<br /><img src="" style="max-width: 100px; margin-top: 5px; display:none;" id="' . $field_id . '-preview" />';
        }
    }
}

// Санитайзинг настроек
function sanitize_sharing_buttons_settings($input) {
    $output = [];
    foreach ($input as $key => $value) {
        if (strpos($key, 'text') !== false) {
            $output[$key] = sanitize_text_field($value);
        } else {
            $output[$key] = esc_url_raw($value);
        }
    }
    return $output;
}
// Шорткод для иконок шеринга
function sharing_buttons_icons_shortcode($atts) {
    $settings = get_option('sharing_buttons_settings', []);
    
    $defaults = [
        'telegram_logo' => 'https://example.com/path/to/telegram-logo.png',
        'whatsapp_logo' => 'https://example.com/path/to/whatsapp-logo.png',
        'vk_logo'       => 'https://example.com/path/to/vk-logo.png',
        'odnoklassniki_logo' => 'https://example.com/path/to/odnoklassniki-logo.png',
    ];

    $settings = wp_parse_args($settings, $defaults);
    $current_url = get_permalink();

    $output = '<div class="sharing-buttons-icons">';
    
    $output .= '<p>Поделиться:</p>';
    
    // Telegram
    if (!empty($settings['telegram_logo'])) {
        $output .= '<a href="https://telegram.me/share/url?url=' . esc_url($current_url) . '" target="_blank" class="sharing-button">';
        $output .= '<img src="' . esc_url($settings['telegram_logo']) . '" alt="Telegram">';
        $output .= '</a>';
    }
    
    // WhatsApp
    if (!empty($settings['whatsapp_logo'])) {
        $output .= '<a href="https://wa.me/?text=' . esc_url($current_url) . '" target="_blank" class="sharing-button">';
        $output .= '<img src="' . esc_url($settings['whatsapp_logo']) . '" alt="WhatsApp">';
        $output .= '</a>';
    }
    
    // VK
    if (!empty($settings['vk_logo'])) {
        $output .= '<a href="https://vk.com/share.php?url=' . esc_url($current_url) . '" target="_blank" class="sharing-button">';
        $output .= '<img src="' . esc_url($settings['vk_logo']) . '" alt="VK">';
        $output .= '</a>';
    }

    // Одноклассники
    if (!empty($settings['odnoklassniki_logo'])) {
        $output .= '<a href="https://connect.ok.ru/offer?url=' . esc_url($current_url) . '" target="_blank" class="sharing-button">';
        $output .= '<img src="' . esc_url($settings['odnoklassniki_logo']) . '" alt="Одноклассники">';
        $output .= '</a>';
    }

    $output .= '</div>'; // .sharing-buttons-icons

    return $output;
}

add_shortcode('sharing_buttons_icons', 'sharing_buttons_icons_shortcode');



// Шорткод для текста шеринга
function sharing_buttons_texts_shortcode($atts) {
    $settings = get_option('sharing_buttons_settings', []);
    
    $defaults = [
        'telegram_text' => 'Поделиться в Telegram',
        'whatsapp_text' => 'Поделиться в WhatsApp',
        'vk_text'       => 'Поделиться во ВКонтакте',
        'odnoklassniki_text' => 'Поделиться в Одноклассниках',
    ];

    $settings = wp_parse_args($settings, $defaults);
    $current_url = get_permalink();

    $output = '<div class="sharing-buttons-texts">';
    
    // Telegram
    if (!empty($settings['telegram_text'])) {
        $output .= '<a href="https://telegram.me/share/url?url=' . esc_url($current_url) . '" target="_blank" class="sharing-button">';
        $output .= '<span>' . esc_html($settings['telegram_text']) . '</span>';
        $output .= '</a>';
    }
    
    // WhatsApp
    if (!empty($settings['whatsapp_text'])) {
        $output .= '<a href="https://wa.me/?text=' . esc_url($current_url) . '" target="_blank" class="sharing-button">';
        $output .= '<span>' . esc_html($settings['whatsapp_text']) . '</span>';
        $output .= '</a>';
    }
    
    // VK
    if (!empty($settings['vk_text'])) {
        $output .= '<a href="https://vk.com/share.php?url=' . esc_url($current_url) . '" target="_blank" class="sharing-button">';
        $output .= '<span>' . esc_html($settings['vk_text']) . '</span>';
        $output .= '</a>';
    }

    // Одноклассники
    if (!empty($settings['odnoklassniki_text'])) {
        $output .= '<a href="https://connect.ok.ru/offer?url=' . esc_url($current_url) . '" target="_blank" class="sharing-button">';
        $output .= '<span>' . esc_html($settings['odnoklassniki_text']) . '</span>';
        $output .= '</a>';
    }

    $output .= '</div>'; // .sharing-buttons-texts

    return $output;
}

add_shortcode('sharing_buttons_texts', 'sharing_buttons_texts_shortcode');

Код JS

jQuery(document).ready(function($) {
    $(document).on('click', '.upload_image_sharring_button', function(event) {
        event.preventDefault();

        var button = $(this);
        var inputField = $('#' + button.data('target'));
        var imgPreview = $('#' + button.data('target') + '-preview');

        var customUploader = wp.media({
            title: 'Выберите изображение',
            button: {
                text: 'Выбрать изображение'
            },
            multiple: false
        });

        customUploader.on('select', function() {
            var attachment = customUploader.state().get('selection').first().toJSON();
            inputField.val(attachment.url);
            imgPreview.attr('src', attachment.url).show();
            button.siblings('.remove_image_button').show();
            customUploader.close();
        });

        customUploader.open();
    });

    $(document).on('click', '.remove_image_button', function(event) {
        event.preventDefault();

        var button = $(this);
        var inputField = $('#' + button.data('target'));
        var imgPreview = $('#' + button.data('target') + '-preview');

        if (confirm("Вы уверены, что хотите удалить это изображение?")) {
            inputField.val('');
            imgPreview.attr('src', '').hide();
            button.hide();
        }
    });
});

текст