<?php
// Función para cargar Font Awesome si es necesario
function cargar_font_awesome_si_es_necesario() {
if (!wp_script_is('font-awesome', 'enqueued')) {
wp_enqueue_style('font-awesome', 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css', array(), null);
}
}
add_action('wp_enqueue_scripts', 'cargar_font_awesome_si_es_necesario');
// Función para cargar jQuery si es necesario
function cargar_jquery_si_es_necesario() {
if (!wp_script_is('jquery', 'enqueued')) {
// Si jQuery no está cargado, encolamos la versión incluida en WordPress
wp_enqueue_script('jquery');
}
}
add_action('wp_enqueue_scripts', 'cargar_jquery_si_es_necesario');
// Definir constante para el nombre de la taxonomía
define('CATEGORIA_USUARIO', 'categoria_usuario');
// Registrar una taxonomía personalizada para usuarios
function registrar_taxonomia_usuario() {
register_taxonomy(
CATEGORIA_USUARIO,
'user',
array(
'label' => 'Categoría de Usuario',
'rewrite' => array('slug' => 'categoria-usuario'),
'hierarchical' => true,
)
);
}
add_action('init', 'registrar_taxonomia_usuario');
// Agregar la pestaña de categorías de usuarios
function agregar_pestana_categorias_usuario() {
add_users_page('Categorías de Usuarios', 'Categorías de Usuarios', 'edit_users', 'edit-tags.php?taxonomy=' . CATEGORIA_USUARIO);
}
add_action('admin_menu', 'agregar_pestana_categorias_usuario');
// Mostrar campo de categoría en el perfil de usuario
function mostrar_campo_categoria_usuario($user) {
$categoria_usuario = get_user_meta($user->ID, 'categoria_usuario', true);
?>
<h3>Categoría de Usuario</h3>
<table class="form-table">
<tr>
<th><label for="categoria_usuario_nueva">Seleccionar Categoría</label></th>
<td>
<?php
// Obtener todas las categorías de usuario
$terms = get_terms('categoria_usuario', array('hide_empty' => false));
if (!empty($terms)) {
?>
<select name="categoria_usuario" id="categoria_usuario">
<option value="">Seleccionar Categoría</option>
<?php
foreach ($terms as $term) {
echo '<option value="' . esc_attr($term->slug) . '" ' . selected($categoria_usuario, $term->slug, false) . '>' . esc_html($term->name) . '</option>';
}
?>
</select>
<?php
} else {
echo 'No hay categorías disponibles. Por favor, crea categorías en la sección de Categorías de Usuarios.';
}
?>
</td>
</tr>
</table>
<?php
}
add_action('show_user_profile', 'mostrar_campo_categoria_usuario');
add_action('edit_user_profile', 'mostrar_campo_categoria_usuario');
// Guardar la categoría y relacionar al usuario al actualizar el perfil de usuario
function guardar_categoria_usuario($user_id) {
if (current_user_can('edit_user', $user_id)) {
$categoria_seleccionada = sanitize_text_field($_POST['categoria_usuario']);
// Guardar la categoría en el perfil del usuario
update_user_meta($user_id, 'categoria_usuario', $categoria_seleccionada);
// Asignar al usuario a la categoría
wp_set_object_terms($user_id, $categoria_seleccionada, 'categoria_usuario', false);
}
}
add_action('personal_options_update', 'guardar_categoria_usuario');
add_action('edit_user_profile_update', 'guardar_categoria_usuario');
// Mostrar campo de foto de perfil en el perfil de usuario
function mostrar_campo_foto_perfil($user) {
$foto_perfil = get_user_meta($user->ID, 'foto_perfil', true);
?>
<h3>Foto de Perfil</h3>
<table class="form-table">
<tr>
<th><label for="foto_perfil">Seleccionar Foto</label></th>
<td>
<input type="text" name="foto_perfil" id="foto_perfil" value="<?php echo esc_attr($foto_perfil); ?>" class="regular-text" />
<p class="description">Introduce la URL de tu foto de perfil.</p>
</td>
</tr>
</table>
<?php
}
add_action('show_user_profile', 'mostrar_campo_foto_perfil');
add_action('edit_user_profile', 'mostrar_campo_foto_perfil');
// Guardar la foto de perfil al actualizar el perfil de usuario
function guardar_foto_perfil($user_id) {
if (current_user_can('edit_user', $user_id)) {
$foto_perfil = sanitize_text_field($_POST['foto_perfil']);
update_user_meta($user_id, 'foto_perfil', $foto_perfil);
}
}
add_action('personal_options_update', 'guardar_foto_perfil');
add_action('edit_user_profile_update', 'guardar_foto_perfil');
// Agregar nueva columna en la página de usuarios
function agregar_columna_categoria_usuario($columns) {
$columns['categoria_usuario'] = 'Categoría';
return $columns;
}
add_filter('manage_users_columns', 'agregar_columna_categoria_usuario');
// Mostrar contenido en la nueva columna sin enlace de filtrado
function mostrar_contenido_columna_categoria_usuario($value, $column_name, $user_id) {
if ('categoria_usuario' === $column_name) {
$categoria_usuario = wp_get_object_terms($user_id, 'categoria_usuario');
if (!empty($categoria_usuario)) {
$categoria = array_shift($categoria_usuario);
$categoria_nombre = esc_html($categoria->name);
return $categoria_nombre;
} else {
return 'Sin categoría';
}
}
return $value;
}
add_action('manage_users_custom_column', 'mostrar_contenido_columna_categoria_usuario', 10, 3);
// Shortcode para mostrar usuarios por categoría
function mostrar_usuarios_por_categoria_shortcode($atts) {
ob_start();
// Muestra las categorías disponibles
$categorias = get_terms('categoria_usuario', array('hide_empty' => false));
if (!empty($categorias)) {
echo '<div class="categorias-filtro">';
echo '<a class="filtro-categoria" data-categoria="todas" href="#">Todas las categorías</a>';
foreach ($categorias as $categoria) {
echo '<a class="filtro-categoria" data-categoria="' . esc_attr(sanitize_title($categoria->name)) . '" href="#">' . esc_html($categoria->name) . '</a>';
}
echo '</div>';
}
// Muestra las cajas de usuarios
$args = array(
'role' => 'subscriber', // Cambia el rol según tus necesidades
);
// Realiza la consulta de usuarios
$usuarios = get_users($args);
if (!empty($usuarios)) {
echo '<div class="user-boxes-wrapper">';
foreach ($usuarios as $usuario) {
$usuario_data = get_userdata($usuario->ID);
// Obtenemos la URL de la foto de perfil
$foto_perfil_url = esc_url(get_user_meta($usuario->ID, 'foto_perfil', true));
$foto_perfil_html = '<img src="' . $foto_perfil_url . '" alt="Foto de perfil" width="300" height="200"/ class="user-avatar">';
// Obtenemos la categoría del usuario
$categoria_usuario = wp_get_object_terms($usuario->ID, 'categoria_usuario');
$categoria = !empty($categoria_usuario) ? array_shift($categoria_usuario)->name : 'Sin categoría';
// Unificamos el campo "Nombre" y "Apellidos"
$nombre_completo = esc_html($usuario_data->first_name . ' ' . $usuario_data->last_name);
$email = $usuario_data->user_email;
$pagina_web = esc_url($usuario_data->user_url);
// Nueva: Campos de redes sociales
$whatsapp = esc_html(get_user_meta($usuario->ID, 'whatsapp', true));
$facebook = esc_html(get_user_meta($usuario->ID, 'facebook', true));
$instagram = esc_html(get_user_meta($usuario->ID, 'instagram', true));
$linkedin = esc_html(get_user_meta($usuario->ID, 'linkedin', true));
// Nueva: Biografía del usuario
$biografia = esc_html(get_user_meta($usuario->ID, 'description', true));
echo '<div class="user-box categoria-' . esc_attr(sanitize_title($categoria)) . '">';
echo '<div class="user-avatar">' . $foto_perfil_html . '</div>';
echo '<div class="user-info">';
echo '<div class="categoria" data-label="Categoría"><span class="filtro-categoria" data-categoria="' . esc_attr(sanitize_title($categoria)) . '">' . esc_html($categoria) . '</span></div>';
echo '<div class="nombre" data-label="Nombre"><i class="fas fa-user"></i> ' . $nombre_completo . '</div>';
echo '<div class="email" data-label="Email"><i class="fas fa-envelope"></i> ' . esc_html($email) . '</div>';
echo '<div class="pagina-web" data-label="Página Web"><i class="fas fa-globe"></i> ' . esc_html($pagina_web) . '</div>';
// Nueva: Campos de redes sociales
echo '<div class="redes-sociales" data-label="Redes Sociales">';
if (!empty($whatsapp)) {
echo '<div class="whatsapp"><a href="' . esc_url($whatsapp) . '" target="_blank" rel="noopener noreferrer"><i class="fab fa-whatsapp"></i></a></div>';
}
if (!empty($facebook)) {
echo '<div class="facebook"><a href="' . esc_url($facebook) . '" target="_blank" rel="noopener noreferrer"><i class="fab fa-facebook"></i></a></div>';
}
if (!empty($instagram)) {
echo '<div class="instagram"><a href="' . esc_url($instagram) . '" target="_blank" rel="noopener noreferrer"><i class="fab fa-instagram"></i></a></div>';
}
if (!empty($linkedin)) {
echo '<div class="linkedin"><a href="' . esc_url($linkedin) . '" target="_blank" rel="noopener noreferrer"><i class="fab fa-linkedin"></i></a></div>';
}
echo '</div>';
// Nueva: Biografía del usuario
if (!empty($biografia)) {
echo '<div class="biografia" data-label="Biografía"><i class="fas fa-info-circle"></i> ' . $biografia . '</div>';
}
echo '</div>';
echo '</div>';
}
echo '</div>';
} else {
echo 'No hay usuarios disponibles.';
}
// Agrega el script jQuery para manejar el filtrado
?>
<script>
jQuery(document).ready(function($) {
$('.filtro-categoria').on('click', function() {
var categoria = $(this).data('categoria');
// Oculta todos los usuarios
$('.user-box').hide();
// Muestra los usuarios de la categoría seleccionada
if (categoria === 'todas') {
$('.user-box').show();
} else {
$('.categoria-' + categoria).show();
}
});
});
</script>
<?php
return ob_get_clean();
}
add_shortcode('mostrar_usuarios_por_categoria', 'mostrar_usuarios_por_categoria_shortcode');
// Mostrar campos de redes sociales en el perfil de usuario
function mostrar_campos_redes_sociales($user) {
?>
<h3>Redes Sociales</h3>
<table class="form-table">
<tr>
<th><label for="whatsapp">WhatsApp</label></th>
<td>
<input type="text" name="whatsapp" id="whatsapp" value="<?php echo esc_attr(get_user_meta($user->ID, 'whatsapp', true)); ?>" class="regular-text" />
<p class="description">Ingresa la URL de WhatsApp.</p>
</td>
</tr>
<tr>
<th><label for="facebook">Facebook</label></th>
<td>
<input type="text" name="facebook" id="facebook" value="<?php echo esc_attr(get_user_meta($user->ID, 'facebook', true)); ?>" class="regular-text" />
<p class="description">Ingresa la URL de Facebook.</p>
</td>
</tr>
<tr>
<th><label for="instagram">Instagram</label></th>
<td>
<input type="text" name="instagram" id="instagram" value="<?php echo esc_attr(get_user_meta($user->ID, 'instagram', true)); ?>" class="regular-text" />
<p class="description">Ingresa la URL de Instagram.</p>
</td>
</tr>
<tr>
<th><label for="linkedin">LinkedIn</label></th>
<td>
<input type="text" name="linkedin" id="linkedin" value="<?php echo esc_attr(get_user_meta($user->ID, 'linkedin', true)); ?>" class="regular-text" />
<p class="description">Ingresa la URL de LinkedIn.</p>
</td>
</tr>
</table>
<?php
}
add_action('show_user_profile', 'mostrar_campos_redes_sociales');
add_action('edit_user_profile', 'mostrar_campos_redes_sociales');
// Guardar URLs de redes sociales al actualizar el perfil de usuario
function guardar_redes_sociales($user_id) {
if (current_user_can('edit_user', $user_id)) {
$whatsapp = sanitize_text_field($_POST['whatsapp']);
$facebook = sanitize_text_field($_POST['facebook']);
$instagram = sanitize_text_field($_POST['instagram']);
$linkedin = sanitize_text_field($_POST['linkedin']);
update_user_meta($user_id, 'whatsapp', $whatsapp);
update_user_meta($user_id, 'facebook', $facebook);
update_user_meta($user_id, 'instagram', $instagram);
update_user_meta($user_id, 'linkedin', $linkedin);
}
}
add_action('personal_options_update', 'guardar_redes_sociales');
add_action('edit_user_profile_update', 'guardar_redes_sociales');
// Definir una función para agregar estilos a la tabla de usuarios
function estilo_tabla_usuarios() {
echo '<style>
.categorias-filtro {
text-align: center;
margin-bottom: 20px;
}
.filtro-categoria {
display: inline-block;
padding: 8px 16px;
margin: 5px;
background-color: Transparent; /* Color de fondo del botón */
color: #4286F3; /* Color del texto del botón */
text-decoration: none;
border: 1px solid #4286F3;
border-radius: 4px;
cursor: pointer;
}
.filtro-categoria:hover {
background-color: #4286F3; /* Cambia el color de fondo al pasar el ratón por encima */
color:white;
}
.user-boxes-wrapper {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: 800px; /* Ajusta el ancho máximo según sea necesario */
margin: 0 auto; /* Centra el contenedor de usuarios */
}
.user-box {
width: calc(33.33% - 20px);
margin-bottom: 20px;
border: 1px solid #ddd;
padding: 50px;
box-sizing: border-box;
text-align: center;
transition: box-shadow 0.3s ease;
}
.user-box .user-avatar {
margin-bottom: 10px;
text-align:left;
}
.user-avatar img {
border-radius: 5%; /* Hace que la imagen sea redonda */
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); /* Agrega sombra a la imagen */
}
.user-box .user-info {
font-size: 14px;
text-align:left;
}
.user-info .nombre,
.user-info .email,
.user-info .pagina-web,
.user-info .categoria {
margin-bottom: 10px; /* Añade espacio entre elementos específicos dentro de .user-info */
}
/* Estilos para la sección de redes sociales */
.redes-sociales {
display: flex;
justify-content: center; /* Alinea los elementos al centro */
align-items: center;
margin-top: 10px;
float:left;
}
.redes-sociales div {
margin-right: 10px;
}
.redes-sociales a {
text-decoration: none;
color: #333; /* Color del enlace */
display: flex;
align-items: center; /* Alinea los elementos verticalmente */
}
.redes-sociales i {
font-size: 24px; /* Tamaño del icono */
margin-right: 5px;
color: #4286F3; /* Color del icono */
}
/* Estilos específicos para cada red social */
.whatsapp i {
color: #25D366; /* Color verde de WhatsApp */
}
.facebook i {
color: #1877F2; /* Color azul de Facebook */
}
.instagram i {
color: #E4405F; /* Color rosado de Instagram */
}
.linkedin i {
color: #0077B5; /* Color azul de LinkedIn */
}
/* Estilos para pantallas pequeñas */
@media only screen and (max-width: 600px) {
.user-box {
width: 100%; /* Mostrar una caja por fila en dispositivos móviles */
}
}
</style>';
}
add_action('wp_head', 'estilo_tabla_usuarios');
