Plugin WordPress: Avatar Personalizado do Usuário

1. Visão Geral

Este plugin permite que os usuários do WordPress carreguem suas próprias imagens de perfil, substituindo o Gravatar padrão. Ele inclui validação de tamanho e tipo de imagem para garantir que apenas imagens adequadas sejam utilizadas.

DOWNLOAD

2. Funções

• Adiciona um campo de upload de imagem no perfil do usuário
• Permite aos usuários selecionar uma imagem personalizada
• Inclui validação de tamanho e tipo de imagem
• Substitui o Gravatar padrão pela imagem personalizada
• Fornece feedback visual durante o upload
• Suporta remoção de imagens personalizadas

3. Instalação

1. Faça o download do arquivo ZIP do plugin
2. Acesse o painel administrativo do WordPress
3. Vá para “Plugins” → “Adicionar Novo” → “Upload Plugin”
4. Selecione o arquivo ZIP do plugin e clique em “Instalar Agora”
5. Ative o plugin após a instalação

4. Configuração

Após a instalação, o plugin está pronto para uso. Os usuários podem acessar o perfil e carregar suas imagens personalizadas.

5. Utilização

5.1. Carregando uma Imagem Personalizada

1. Acesse o perfil do usuário
2. Clique em “Escolher Imagem”
3. Selecione uma imagem do Media Uploader
4. A imagem será exibida no campo de texto
5. Validação de tamanho e tipo de imagem acontece automaticamente

5.2. Removendo uma Imagem Personalizada

1. Acesse o perfil do usuário
2. Clique em “Remover Imagem”
3. A imagem padrão do Gravatar será exibida novamente

6. Contribuição

Contribuições são bem-vindas! Envie uma mensagem ou compartilhe suas ideias em nosso fórum de discussão.

7. Licença

Este plugin é licenciado sob a Licença GPLv2 ou posterior.

Código do Plugin

<?php
/*
Plugin Name: Avatar Personalizado do Usuário
Plugin URI: https://wdsecurity.solutions/plugin-wordpress-avatar-personalizado-do-usuario/
Description: Permite que os usuários carreguem suas próprias imagens de perfil no WordPress.
Author: Maderson Dias
Version: 1.0.0
License: GPLv2 ou posterior
*/

// Inicializa o plugin
add_action('init', 'init_custom_avatar_plugin');

function init_custom_avatar_plugin() {
    // Adiciona o campo de imagem personalizada no perfil do usuário
    add_action('show_user_profile', 'custom_avatar_profile_field');
    add_action('edit_user_profile', 'custom_avatar_profile_field');

    // Salva a imagem personalizada do usuário
    add_action('personal_options_update', 'save_custom_avatar');
    add_action('edit_user_profile_update', 'save_custom_avatar');

    // Enfileira o script do Media Uploader
    add_action('admin_enqueue_scripts', 'enqueue_media_uploader');

    // Substitui o avatar padrão pelo avatar personalizado do usuário
    add_filter('get_avatar', 'custom_user_avatar', 10, 5);
}

// Adiciona o campo de imagem personalizada no perfil do usuário
function custom_avatar_profile_field($user) {
    ?>
    <h3>Imagem Personalizada</h3>
    <table class="form-table">
        <tr>
            <th><label for="custom_profile_image">Carregar Imagem</label></th>
            <td>
                <input type="text" name="custom_profile_image" id="custom_profile_image" value="<?php echo esc_attr(get_the_author_meta('custom_profile_image', $user->ID)); ?>" class="regular-text" />
                <input type="button" id="custom_profile_image_button" class="button" value="Escolher Imagem" />
                <div id="custom_profile_image_feedback" style="margin-top: 10px;"></div>
            </td>
        </tr>
    </table>
    <?php
}

// Salva a imagem personalizada do usuário
function save_custom_avatar($user_id) {
    if (!current_user_can('edit_user', $user_id)) {
        return;
    }

    if (isset($_POST['custom_profile_image'])) {
        $image_url = sanitize_text_field($_POST['custom_profile_image']);

        // Valida a imagem
        $validation = validate_profile_image($image_url);

        if (!$validation['valid']) {
            add_action('admin_notices', function() use ($validation) {
                printf('<div class="error"><p>%s</p></div>', esc_html($validation['error']));
            });
            return;
        }

        // Salva a imagem se passou na validaço
        update_user_meta($user_id, 'custom_profile_image', $image_url);
    }
}

// Enfileira o script do Media Uploader
function enqueue_media_uploader($hook) {
    if ('profile.php' != $hook && 'user-edit.php' != $hook) {
        return;
    }
    wp_enqueue_media();
    wp_enqueue_script('custom-avatar-uploader', plugins_url('/js/custom-avatar-uploader.js', __FILE__), array('jquery'), null, true);
}

// Valida a imagem personalizada do usuário
function validate_profile_image($image_url) {
    // Configurações de validação
    $allowed_types = array('image/jpeg', 'image/png', 'image/gif');
    $max_size = 2 * 1024 * 1024; // 2MB em bytes
    $min_width = 200; // Largura mínima em pixels
    $min_height = 200; // Altura mínima em pixels
    $max_width = 2000; // Largura máxima em pixels
    $max_height = 2000; // Altura máxima em pixels

    // Obtém informações do arquivo
    $image_path = parse_url($image_url, PHP_URL_PATH);
    $image_info = @getimagesize($image_url);

    // Verifica se é possível obter informações da imagem
    if (!$image_info) {
        return array(
            'valid' => false,
            'error' => 'Não foi possível validar a imagem.'
        );
    }

    // Verifica o tipo de arquivo
    if (!in_array($image_info['mime'], $allowed_types)) {
        return array(
            'valid' => false,
            'error' => 'Tipo de arquivo não permitido.'
        );
    }

    // Verifica o tamanho do arquivo
    $file_size = filesize(ABSPATH . $image_path);
    if ($file_size > $max_size) {
        return array(
            'valid' => false,
            'error' => 'A imagem é muito grande.'
        );
    }

    // Verifica as dimensões
    $width = $image_info[0];
    $height = $image_info[1];

    if ($width < $min_width || $height < $min_height) {
        return array(
            'valid' => false,
            'error' => 'A imagem é muito pequena.'
        );
    }

    if ($width > $max_width || $height > $max_height) {
        return array(
            'valid' => false,
            'error' => 'A imagem é muito grande.'
        );
    }

    return array(
        'valid' => true,
        'error' => ''
    );
}

// Substitui o avatar padrão pelo avatar personalizado do usuário
function custom_user_avatar($avatar, $id_or_email, $size, $default, $alt) {
    $user = false;

    if (is_numeric($id_or_email)) {
        $user = get_user_by('id', $id_or_email);
    } elseif (is_object($id_or_email)) {
        if (!empty($id_or_email->user_id)) {
            $user = get_user_by('id', $id_or_email->user_id);
        }
    } else {
        $user = get_user_by('email', $id_or_email);
    }

    if ($user && is_object($user)) {
        $custom_avatar = get_user_meta($user->ID, 'custom_profile_image', true);
        if ($custom_avatar) {
            $avatar = sprintf(
                '<img src="%s" alt="%s" width="%d" height="%d" class="avatar avatar-%d photo" />',
                esc_url($custom_avatar),
                esc_attr($alt),
                (int) $size,
                (int) $size,
                (int) $size
            );
        }
    }

    return $avatar;
}

Arquivo JS: custom-avatar-uploader.js

jQuery(document).ready(function($) {
    var customAvatarUploader;
    $('#custom_profile_image_button').on('click', function(e) {
        e.preventDefault();
        if (customAvatarUploader) {
            customAvatarUploader.open();
            return;
        }
        customAvatarUploader = wp.media({
            title: 'Escolher Imagem',
            button: {
                text: 'Escolher Imagem'
            },
            multiple: false
        });
        customAvatarUploader.on('select', function() {
            var attachment = customAvatarUploader.state().get('selection').first().toJSON();
            $('#custom_profile_image').val(attachment.url);
            validateImageUrl(attachment.url);
        });
    });

    var feedbackDiv = $('#custom_profile_image_feedback');
    var imageInput = $('#custom_profile_image');

    function validateImageUrl(url) {
        if (!url) return;

        feedbackDiv.html('Verificando imagem...');
        feedbackDiv.css('color', '#666');

        var img = new Image();
        img.onload = function() {
            // Verifica dimensões
            if (this.width < 200 || this.height < 200) {
                feedbackDiv.html('Aviso: A imagem deve ter no mínimo 200x200 pixels.');
                feedbackDiv.css('color', '#d63638');
                return;
            }
            if (this.width > 2000 || this.height > 2000) {
                feedbackDiv.html('Aviso: A imagem deve ter no máximo 2000x2000 pixels.');
                feedbackDiv.css('color', '#d63638');
                return;
            }
            feedbackDiv.html('Imagem válida!');
            feedbackDiv.css('color', '#00a32a');
        };
        img.onerror = function() {
            feedbackDiv.html('Erro ao carregar a imagem.');
            feedbackDiv.css('color', '#d63638');
        };
        img.src = url;
    }

    imageInput.on('change', function() {
        validateImageUrl(this.value);
    });
});