Texto de marcador de posición para formulario de registro

22 ene 2014, 05:17:04
Vistas: 15.5K
Votos: 7

Estoy intentando agregar texto de marcador de posición al formulario de registro nativo de WordPress. Actualmente estoy usando el plugin Register Plus Redux. ¿Cómo puedo añadir este texto de marcador en los campos de entrada de texto del formulario?

Necesito indicar a los usuarios que utilicen su nombre y apellido como nombre de usuario. Estaría muy agradecido si alguien pudiera ayudarme con esto.

0
Todas las respuestas a la pregunta 2
2
10

Otra forma sencilla de hacer esto sin necesidad de añadir otro script es utilizando la función str_replace de PHP.

$args = array(
    'echo' => false,
);

$form = wp_login_form( $args ); 

//agregar los placeholders
$form = str_replace('name="log"', 'name="log" placeholder="Nombre de usuario"', $form);
$form = str_replace('name="pwd"', 'name="pwd" placeholder="Contraseña"', $form);

echo $form;
11 ene 2017 01:41:04
Comentarios

A menos que me esté perdiendo algo, esta parece la solución ideal ya que así no dependes de js, lo que podría hacer que tus placeholders no se muestren si el usuario tiene js desactivado o hay un error de javascript. Y si ocultas tus etiquetas, tu formulario sería inútil en ese caso.

Trevor Trevor
24 may 2017 07:41:10

Esta es DEFINITIVAMENTE el enfoque correcto para esto, NO la opción con JS

vimes1984 vimes1984
19 ago 2018 12:45:37
7

Desafortunadamente no hay hooks/filtros para modificar el campo de entrada en el formulario de inicio de sesión/registro para agregarle un placeholder.

Pero puedes hacer esto con jQuery simple. A continuación agrego los pasos.

No estoy al tanto de cómo este plugin modifica el formulario pero puedes seguir el mismo procedimiento para él también. A continuación están los códigos que funcionan para la página predeterminada de inicio de sesión/registro.

Primero necesitas crear un archivo js. Yo lo creé en la carpeta js de mi tema activo y lo nombré custom.js

luego agregué la siguiente línea en este archivo.

/**
 * Archivo js personalizado.
 */

jQuery(document).ready(function(){
    jQuery('#user_login').attr('placeholder', 'Nombre de usuario');
    jQuery('#user_email').attr('placeholder', 'Correo electrónico');
    jQuery('#user_pass').attr('placeholder', 'Contraseña');
});

Lo anterior agrega placeholders como Nombre de usuario, Correo electrónico y Contraseña a los campos de entrada user_login, user_email, y user_pass respectivamente. Puedes cambiarlos según tus necesidades.

Ahora necesitas agregar/enqueue este archivo js lo cual puedes hacer agregando el siguiente código en el archivo functions.php de tu tema activo

add_action( 'login_enqueue_scripts', 'wpse_login_enqueue_scripts', 10 );
function wpse_login_enqueue_scripts() {
    wp_enqueue_script( 'custom.js', get_template_directory_uri() . '/js/custom.js', array( 'jquery' ), 1.0 );
}
22 ene 2014 08:37:17
Comentarios

¡Maruti, ME HAS ALEGRADO EL DÍA! No tengo palabras para agradecerte lo suficiente!!

mr_bythatmuch mr_bythatmuch
22 ene 2014 23:47:48

¿No puedo darte, como, una medalla de oro o algo así? :)

mr_bythatmuch mr_bythatmuch
22 ene 2014 23:49:44

Me alegra que te haya ayudado, y sobre la medalla, no, no puedes darme una medalla, al menos WPSE no tiene esa función todavía ;) pero seguramente puedes votar a favor mi respuesta y aceptarla para darme los máximos 25 puntos de ti :)

Maruti Mohanty Maruti Mohanty
23 ene 2014 07:26:15

@mr_bythatmuch Si esta solución funcionó para ti, acéptala para que ayude a otros con el mismo problema. cómo-funciona-aceptar-una-respuesta

Maruti Mohanty Maruti Mohanty
29 ene 2014 09:41:43

Contenido para remunerar con oro pero sin marcar como respuesta correcta. SMH.

Clarus Dignus Clarus Dignus
12 ene 2016 15:28:42

Para futuros lectores, los placeholders no son compatibles con <IE10. Considerando que 2 de cada 10 de tus visitantes usan IE8/IE9, recomiendo usar un plugin polyfill.

Clarus Dignus Clarus Dignus
12 ene 2016 16:34:25

¿Qué hay del soporte de localización? Creo que deberías usar wp_localize_script

emilushi emilushi
3 jun 2016 22:35:38
Mostrar los 2 comentarios restantes