Crear boton “Ir Arriba” en WordPress

Crear boton “Ir Arriba” en WordPress

La experiencia de usuario es muy importante para nuestra página web y entre todas las piezas que componen una buena UIX esta el tener acceso al contenido de nuestro sitio si problemas.

A quien no le ha pasado estar en una página web leyendo un articulo largo y una vez abajo de la página tener que hacer un deslizamiento infinito hacia arriba para acceder al menú de cabecera. Esto no da ganas de leer otro articulo y aun es mas notable cuando lo hacemos en un dispositivo móvil.

La mayoría de los temas de WordPress más populares implementan algún tipo de botón o enlace para retorno al principio de la pagina, pero tambien me he topado con muchos que no. Pues bien, en este articulo te explicare que soluciones puedes adaptar a estos temas. En principio explicare como hacerlo con dos plugins gratuitos que tenemos en el repositorio de wordpress y cómo hacerlo con código que es la que más me gusta a mi.

Vamos al lio!!!-

Crear boton “Ir Arriba” con plugins.

Para instalar un plugin en WP debemos ir a nuestro panel de administrador , seleccionamos plugin y pinchamos “Añadir nuevo”.

Nos aparece una lista de plugins por si lo queremos buscar en el repositorio , lo buscamos y le damos al botón “Instalar” y una vez instalado “Activar” ,Listo!!!👍.

Si por el contrario descargamos el plugin desde el enlace que te proporcionó en cada sección , depues de “Añadir nuevo” , tendrás el botón “Subir plugin” , buscas el archivo con extensión .zip del complemento , “Instalar ahora” y cuando termine el proceso “Activar”.

SrollTop plugin para crear botón de "Ir Arriba" en WordPress.

ScrollTop

ScrollTop es un complemento de los más sencillos de la lista,aunque su sencillez es suficiente para tener esta funcionalidad cubierta de sobras.

ScrollTop opciones del plugin.
ScrollTop opciones del plugin segunda parte.

Una vez instalado vamos a buscar las opciones del plugin en el panel de admin Ajustes > ScrollTop.

Las opciones que nos da son muy intuitivas , pero las veremos una a una:

  • Enable (Enable ScrollTop) : Es bastante obvio , sirve para activar o desactivar el botón.
  • Type : Podemos escoger entre si queremos un icono con flecha o un texto , muchas veces se utiliza el segundo con texto tipo “Arriba” o “ir arriba” según nuestro gusto.
  • Position : Establecemos la posición del botón o texto , hay dos opciones abajo derecha (Right Side) o abajo izquierda (Left Side), por defecto estará en la derecha.
  • Color : Esta opción definirá el color del icono o texto según hayamos escogido en la opción Type.
  • Background color : Color de fondo del botón, por defecto es negro.
  • Animation : Animación del botón al aparecer y desaparecer , hay dos opcione fade y slide , esta ultima da un efecto muy bueno.
  • Style : Estilo que quieres para tu botón.
  • Speed : Esta establece la velocidad en milisegundos con que nuestra página se desplazará hacia arriba, una buena medida sería un segundo osea 1000 ,haz pruebas con otras medidas hasta llegar a la que te parezca mejor.
  • Distance : El botón se muestra cuando estamos a una cierta distancia entre el elemento “target” y el final de la pagina, aqui puedes cambiar ese parámetro.
  • Target : Esta opción es para elegir hasta qué elemento quieres que llegue el desplazamiento. Por defecto será en la cabecera, pero segun diseño es posible que quieras que pare en otra parte como por ejemplo en el primer título , el H1 o en menú , para ello tenemos que saber que tag ,id o clase css tiene el elemento en cuestión , si no sabes html o css esto deberías consultarlo con alguien que sí o dejar tu duda en los comentarios.😊
  • Custom Css : Si sabes css aqui pueder dar estilo propio al botón o al texto en caso de que lo elijas así.

Algunos ejemplos de cómo puede quedar:

WPSFront scroll top.

Este complemento es mucho mas completo y personalizable que el antecesor sin duda ,vamos haber su panel de opciones que da para bastante.

Una vez instalado vamos nuestro panel de admin Ajustes > Scroll al inicio.

En esta primera parte tenemos…

  • Activado : Activar o no el plugin (Obvio).
  • Javascript asíncrono : Esto significa que el código Javascript lo cargara de forma asíncrona por lo tanto no interfiere en el flujo del sitio y ganamos puntos en la velocidad de nuestra web.Por defecto viene deshabilitado si no entiendes de que que va puedes dejarlo así.
  • Compensación del scroll : Esto resumidas cuentas es la media en píxeles que nos deslizamos en la ventana para que aparezca el botón o texto de ir arriba.
  • Tamaño del botón : Podemos darle un ancho y alto personalizado desde aquí.
  • Opacidad del botón : La transparencia que queremos que tenga en un porcentaje de 0 a 100.
  • Duración de la desaparición del botón : Tiempo en milisegundos que durará el efecto de desaparecer del botón.
  • Duración del scroll : Tiempo en milisegundos que durara el scroll hacia arriba cuando pulsamos el botón , haz pruebas , lo elegante es un movimiento ni muy rápido ni muy lento.
  • Ocultar automáticamente : Una se muestra el botón y con la página parada, determina si ocultar o no el botón.
  • Ocultar automaticamente despues de : En segundos tiempo de espera para ocultar el botón con página parada y habiendo activado la opción anterior.
  • Ocultar en dispositivos pequeños : Si no quieres que se muestre en dispositivos móviles marca esta opción.
  • Anchura máxima de los dispositivos pequeños : Tenido la casilla anterior activada, hasta que ancho de pantalla quieres que tenga en pixeles para que se oculte.
  • Ocultar en ventanas pequeñas : Esta opción es la misma que la anterior pero cuando se trata de un navegador web.
  • Anchura máxima de las ventanas pequeñas : Igual, determinamos el ancho máximo en pixeles de la ventana para que oculte el botón.
  • Ocultar en WP-ADMIN : Este plugin también muestra el boton en tu panel de administracion , tu decides si quieres o no.
  • Ocultar en iframes : Ocultar cuando hay ventanas emergentes o iframes , si no entiendes esto puedes dejarlo como viene.
  • Estilo del botón : Esta opción es importante porque depende lo que escojamos se mostraran unas opciones u otras más adelante, en definitiva nos dice, ¿que queremos mostrar?, un botón, un texto o un icono de Font Awesome , que es un servicio que provee de iconos para el desarrollo web en pocas palabras.
  • Acción del botón : Qué acción realizara nuestro botón:
  • Desplazarse hacia arriba : Esta es la opción por defecto , nuestra ventana se desplazara hasta arriba del todo.
  • Desplazarse al elemento : Es posible que nuestro tope arriba sea diferente y queremos que la ventana desplace a un elemento en concreto, debemos determinar un selector css , si no saber de programación hay un enlace hacia un tutorial que lo explica.

WpFront plugin elegimos la opción desplazamiento a elemento.

  • Enlace a al página : En esta podemos elegir si queremos que el botón nos enlace a una página fuera de la que estamos , para ello debemos introducir un enlace a esta.
WpFront plugin elegimos la opción desplazamiento a página.

  • Ubicación : Elige la ubicación del botón entre las cuatro posibilidades . por defecto abajo derecha.
  • Margen x : Margen en pixeles en la horizontal , admite valor negativo para mejor ajuste.
  • Margen y : Igual que el anterior pero esta vez en la vertical.
  • Filtrar : Nos permite determinar mediante filtros donde queremos y donde no que se muestre el boton, con combinación de entradas y paginas muy personalizable.

Este último bloque de ajustes dependerá de lo que hayamos escogido en la opción Estilo del botón.

  • Imagen Botón: Nos muestra una lista de diseños de botones , entre los que podemos elegir.
WPFront botones entre los que podemos elejir.
  • Texto del botón : Si elegimos Texto , podemos establecer color del texto , color al pasar el ratón sobre el css personalizado para darle mas estilo.

  • Font Awesome : FW es un famoso framework css que nos provee de iconos a los desarrolladores , con esta opción podemos usar estos ícono como botón. En primer lugar tenemos que especificar la clase css del icono, La url de CDN , osea la url para cargar las hojas de font Awesome, color de icono y css personalizado para darle más estilo.

Con esto y hemos repasado todo lo que da de si este fantástico plugin , como ves es mas configurable que el anterior. La eleccion dependera hasta cuanto necesites tu en tu sitio, si con las prestaciones de ScrollTop ya cumples tus objetivos o necesitas más personalización con WPFront .

También te pueden interesar estos plugins…

Cómo hacerlo sin plugins.

Como siempre se dice entre programadores.

El mejor plugin para WordPress es el que no se usa.

Usar plugins para todo tiene un coste en tu web a nivel rendimiento, por el simple echo que siempre hay funcionalidad , archivos y recursos que incluye este que no se usan,, pero tiene un peso y hacen que nuestro sitio tenga mas trabajo innecesario al cargarlos. Esto seria en resumidas cuentas porque me gusta mas esta opcion y yo intento al maximo evitar plugins en mis paginas con WP.

También hay que tener en cuenta que no todo el mundo sabe manejar código, ni adentrarse en editar archivos del backend para incluir funcionalidad, Por eso los plugins son tan prácticos y hacen que todo sea mucho más fácil.

Vamos a ello…

Lo más importante antes de nada.

Lo primero que deberías hacer antes de tocar codigo es asegurarte la jugada y hacer una copia de seguridad de tu sitio. Normalmente los proveedores de hosting integran este servicio de forma gratuita, informate del tuyo y haz tu copia.En le caso de que no puedes utilizar plugins como estos:

Otro paso importante antes de hacer nada es que dispongas de un tema hijo de tu tema principal , esto ayuda mucho a no perder las modificaciones que hagas ahora en caso de que se actualice tu tema.

Si no sabes como hacerlo puedes mirar este video.

Vamos al lio…

Primero crearemos un archivo llamado boton-hacia-arriba.js y le pegaremos este código:

jQuery(document).ready(function($) {
		$header = $('header');
		
		$('#boton-hacia-arriba').on("click",function(e){
			e.preventDefault();
			$('html,body').animate({ scrollTop: 0 }, 800);
		});
		
		$(window).on('scroll', function() { 
			 var $top = jQuery(this).scrollTop();
			if ($top >= $header.outerHeight(true)) {
				$('#boton-hacia-arriba').css({ 'bottom':'50px' });
			} else {
				$('#boton-hacia-arriba').css({ 'bottom':'-100px' });
			}
		});
	});

En el directorio de tu tem, dentro de su carpeta busca si hay una llamada js, si no la hay la creas , ósea en la ruta de tu wordpress, wp-content>themes/nombre-de-tu-tema/js , copia el archivo en ella.

Si ya tienes tu tema hijo como recomendamos , en su directorio crea si no existe un fichero con nombre functions.php y pega el siguiente código. Si no tienes tema hijo, en los archivos del tema que uses debería existir este archivo ,pega el código al final del archivo y listo!!.

/**
 * Enqueue button javascript script.
 */
function themeslug_add_button_script() {
  wp_enqueue_script( 'custom-script', get_stylesheet_directory_uri() . '/js/boton-ir-hacia-arriba.js', array( 'jquery' ) );
}
add_action( 'wp_enqueue_scripts', 'themeslug_add_button_script' );
/**
 * Add button HTML to the footer section.
 */
function themeslug_add_scroll_button() {
  echo '<a href="#" id="boton-hacia-arriba">
			  <div class="arrow-side side-1"></div>
			  <div class="arrow-side side-2"></div>
		  </a>';
}
add_action( 'wp_footer', 'themeslug_add_scroll_button' );

Ahora en el menú de tu WordPress ves a Apariencia > Personalizar > Css Personalizado y pega al final el siguiente código:

#boton-hacia-arriba{
	background-color: #000000;/* Puedes cambiar el color de tu boton aqui*/
    	opacity: .6;
    	position: fixed;
    	bottom: -100px;
    	right: 50px;
    	padding: 5px;
    	height: 35px;
    	width: 35px;
      border-radius: 50%;
    	cursor: pointer;
    	transition: bottom .8s;
}
#boton-hacia-arriba:hover{
	opacity:1;
}
#boton-hacia-arriba .arrow-side{
	display:block;
	position:absolute;
	width:16px;
	height:3px;
	background-color:#ffffff;
	border-radius:10px;
	vertical-align:middle;
}
#boton-hacia-arriba .arrow-side.side-1{
	transform: rotate(130deg);
    	position: absolute;
    	top: 14px;
    	left: 5px;
}
#boton-hacia-arriba .arrow-side.side-2{
	transform: rotate(230deg);
    	position: absolute;
    	top: 14px;
    	right: 4px
	}

Y con esto ya tendríamos nuestro botón sin usar plugins. Es posible que el código en algunos temas por su estructura no se adapte bien del todo , pero si entiendes de css , tiene arreglo seguro. En caso contrario que no sepas nada de código y tengas problemas puedes comentar como te a ido y miramos de darle solución.

Puedes ver como ha quedado:

¿Que te ha parecido el articulo?, ¿conoces mas plugins similares? o simplemente tienes alguna sugerencia , haz un comentario.

Ivanicof Tema Gratuito

Ivanicof Tema Gratuito

Como ya sabéis los que me seguís hace tiempo una de mis hobbies es diseñar temas para WordPress de forma desinteresada y gratuita para todo el mundo.

En esta ocasión he realizado un tema limpio y claro con motivo de blog personal, estilo de vida y en definitiva enfocado a publicaciones claras con imágenes que digan mucho de su contenido.

Las características mas importantes de Ivanicof en cuestión de diseño serian:

  • Elección de dos o una columna para distribuir los posts.
  • Podemos escoger la tipografía y estilo de letra para títulos y contenido.
  • Cabecera personalizable en imagen ,iconos sociales y buscador.
  • Elección de ocultar barra lateral o tenerla a al izquierda o derecha.
  • Iconos sociales en cabecera y pie de pagina

Como una imagen vale mas que mil palabras aqui dejo algunas capturas:

 

También podéis visualizar la demo desde aquí.

Mas temas gratis realizados por un servidor aqui.

Pues bien espero que el tema sea de vuestro agrado y si encontráis algún problema con el o queréis comentar algo , ya sabéis, usar los comentarios y responderé lo mas brevemente posible , un saludo

Entrada anterior y siguiente con imagen destacada.

Entrada anterior y siguiente con imagen destacada.

A la hora de crear nuestros temas de WordPress debemos ser originales o por lo menos intentarlo.

Aunque está todo hecho e inventado en el mundo de los temas de wp siempre podemos dar un toque diferente que nos haga lucir nuestra web atractiva al usuario final.

En esta ocasión vamos hacer que en nuestra entrada individual en el blog el post anterior y siguiente se muestra la imagen destacada correspondiente a cada uno y no el típico “Next” , “Previous” que vemos siempre.

Para veais a lo que me refiero , esto seria lo que vemos en el tema Twenty Nineteen:

Aquí se muestra un enlace a Entrada anterior y posterior con el título de la entrada y el código seria algo como esto:

the_post_navigation( array(
	'prev_text' => __( ' %title','fitness-passion' ),
	'next_text' => __( ' %title →','fitness-passion' ),
        'screen_reader_text' => __( 'Continue Reading','fitness-passion' ),
) );

Pues vamos a hacer algo como lo siguiente , que seria lo mismo pero mostrando las imágenes destacadas y un poco de css para mejorar la apariencia.

Para ello usaré una función, la cual usa get_previous_post y get_next_post y a partir de ellas obtenemos el $post y usamos sus propiedades para montar nuestra navegación.

<?php 
themeslug_posts_navigation(){ global $post; ?> 
        <div class="posts-navigation"> 
            <div class="nav-links">
              <?php $prevPost = get_previous_post(true); if($prevPost) { $args = array( 
                    'posts_per_page' => 1, 
                    'include' =>; $prevPost->;ID ); 
                    $prevPost = get_posts($args); 
                    foreach ($prevPost as $post) { setup_postdata($post);?> 
               <div class="nav-previous" style="background-image: url(<?php echo get_the_post_thumbnail_url('get_the_ID('),'large');?>"> 
                <h4><?php echo get_the_post_title();?></h4> </div> 
                       <?php wp_reset_postdata(); 
                    } //end foreach } // end if 
                  $nextPost = get_next_post(true); if($nextPost) { $args = array( 
                  'posts_per_page' =>; 1, 
                  'include' => $nextPost->ID ); 
                   $nextPost = get_posts($args); 
                   foreach ($nextPost as $post) { setup_postdata($post); ?> 
              <div class="nav-next" style="background-image: url(<?php echo get_the_post_thumbnail_url('get_the_ID('),'large'); ?>"> 
                <h4><?php echo get_the_post_title();?></h4> </div> <?php wp_reset_postdata(); } //end foreach } // end if ?></div> </div>

Ten en cuenta que themeslug sería el slug de tu tema.

La función su lugar más habitual seria en el single.php de tu tema después del contenido , por ejemplo así:

y con un poco de css en nuestro style.css.

.posts-navigation { 
   margin: 0 0 1.5em; 
   width: 100%; 
   text-transform: uppercase; } 

.posts-navigation .nav-links { 
   display: -webkit-box; 
   display: -ms-flexbox; 
   display: flex; 
   -webkit-box-pack: justify; 
   -ms-flex-pack: justify; 
   justify-content: space-between; } 

.posts-navigation .nav-next, .posts-navigation .nav-previous { 
   overflow: hidden; 
  flex: 1; 
  min-height: 10rem; 
  background-repeat: no-repeat; 
  background-size: cover; 
  background-position: 20% 50%; } 

.posts-navigation .nav-next h4, .posts-navigation .nav-previous h4 { 
  width: 100%; 
  height: 100%; 
  margin: 0; 
  background-color: #0e0e0e42; 
  transition: background-color .4s ease-in; font-size: .8rem; 
  font-weight: 100; } 

.posts-navigation .nav-next h4:hover, .posts-navigation .nav-previous h4:hover { 
  background-color: #a1624c; } 

.posts-navigation .nav-next h4 { text-align: right; } 

.posts-navigation .nav-next a, .posts-navigation .nav-previous a { 
  color: white; 
  height: 100%; 
  display: flex; 
  justify-content: center; 
  align-items: center; }

Ya tienes otra forma de mostrar tu navegación de post en WordPress , seguro tu tema te lo agradecerá.

Si te ha gustado la entrada o tienes algo que aportar haz tu comentario, un saludo y hasta la próxima.

Divi el tema para wordpress mas usado.

Divi el tema para wordpress mas usado.

El tema Divi es una de las plantillas más usadas por los usuarios y desarrolladores de WordPress sin duda .

Esto es debido a que los chicos de Elegant Themes has sabido crear un producto que facilita la vida a la gente.

Con Divi y su constructor visual integrado , construir páginas en wp es una tarea muy fácil y no necesita conocimientos en programación ni maquetación previos.

Además dispone de módulos que abarcan casi cualquier situación que se te presente para maquetar y lo que no cubren sus módulos seguro hay algún plugin que hace lo necesario.

Si quieres disponer de el tienes dos planes de compra en Elegant Themes.

  • Plan anual: Con este plan tendrás acceso a todos los contenidos de Divi , plugins y temas de Elegant Themes por un año , a partir de hay no dispondrás de actualizaciones.
  • Plan De por Vida: Dispones de lo mismo que el anual pero para siempre sin preocuparte de mas pagos que uno único de 248$ ahora mismo.

Mas información en su web.

Si quieres probar divi antes de adquirir un plan , puedes usar el builder online de divi o descargarte el tema gratuito desde aquí :

Divi 3.11 Descarga

Si es para un proyecto personal puedes usar el tema gratuito ,pero si piensas usarlo con clientes lo mejor es que te acojas a un plan de Elegant Themes.

Nota: algunos de los enlaces en esta publicación son” enlaces de afiliados “. Esto significa que si hace clic en el enlace y compra el artículo, recibiré una comisión de afiliado”.

Herramientas para desarrolladores de temas en WordPress

Herramientas para desarrolladores de temas en WordPress

Si eres desarrollador de temas de wordpress sabrás que es un trabajo  arduo donde hay que tener muchas cosas en cuenta, y para ello no vendrá mal un poco de ayuda .

Existen muchas herramientas que te ayudaran en tu trabajo, yo aquí voy a enumerar las que a día de hoy mas utilizo y de mas ayuda me sirven.

Empezaremos con los Temas en blanco o “starter themes” son temas sin estilo con la estructura de archivos necesaria  y funcionalidad para comenzar a montar un tema desde cero.

Hay muchos en la red pero yo solo he usado dos y creo que son mas que suficientes:

2018-06-03_1123

Underscores

De la mano de automatic que forman parte de los  desarrolladores de wordpress nos brindan este tema base.

Para obtenerlo debemos acceder a la plataforma de Underscores  e introducir el nombre que queremos que tenga nuestro tema así la aplicación lo generara con todos los prefijos de funciones y dominios de texto ya con dicho nombre , sin duda un ahorro de tiempo que no ofrecen otros.

Como positivo:

Aparte de lo dicho antes sobre la plataforma también destacaría que si tu intención es compartir tus temas en el repositorio de wordpress ya tienes mucho trabajo echo en lo referente a requerimientos que este nos pide.

Como negativo:

A mi gusto tiene muchos estilos css predefinidos que me sobran , utiliza una fracción de normalize.css y eso esta bien, pero hay mas donde define colores de elementos y demás que yo veo innecesarios y suelo borrar nada mas empezar.

2018-06-03_1316

HTML5 Blank

Como segunda opcion se encuentra HTML5 Blank .creado por Tood Moto , un estupendo desarrollador web que ha creado este tema en blanco con muchas características ya definidas en su codigo , sin duda una buenisima segunda opcion para empezar con tu tema,

Como positivo:

Todo el código esta muy bien documentado y comentado, eso es muy importante a la hora de desechar o preservar la funcionalidad que mejor se nos adapta a nuestro proyecto.

Como negativo:

Muchas características que trae ( siempre a mi parecer ) excluyen cosas del core de WP por lo tanto si quieres subir el tema al repositorio de wordpress tendrás que eliminar muchas de sus funciones.

2018-06-03_1833

FakerPress

Siguiendo con el desarrollo de temas uno de los plugins que mas he utilizado es FakerPress .

Este plugin es un generador de contenido y otras cosas, con el podemos crear en nuestras bases de datos entradas con sus imágenes , usuarios , comentarios , taxonomías (categorías, etiquetas, custom).

Y todo esto para que? , si no lo has deducido ya cuando creamos temas es muy importante probar todas sus características en escenarios reales o instalaciones de wp con contenido ya y con esta herramienta pasamos de tener una instalación limpia de wp en nuestro servidor local a tener todo el contenido de un blog en pleno funcionamiento y solo con unos “clicks”.

2018-06-03_1923

Query Monitor

Query Monitor es una herramienta muy completa que nos proporciona accesos a un panel para administradores o desarroladores donde podemos acceder a toda la información sobre el sitio que tratamos.

Desde el panel de QM podemos ver entra otras informaciones:

  1. Estilos y scripts que se están cargando.
  2. Velocidad y peso de la carga de la pagina actual.
  3. Plantilla y jerarquía de estas que se muestra en ese momento.
  4. Peticiones y consultas a la base de datos.
  5. Peticiones ajax
  6. Errores php que puedan darse.
  7. Solicitudes http.
  8. “Hooks” que estan siendo llamados.

Esto es solo un resumen de todo lo que query Monitor nos muestra , sin duda un plugin muy util para el desarrollo con toda la información que nos brinda.

2018-06-03_1939

Otro complemente muy usado es Regenerate Thumbnails , si has creado algún tema te sonara este código en el functions.php

add_image_size( 'post', 1400, 9999);

y si no te diré que wordpress por defecto redimensiona las imágenes de tus post a unos tamaños establecidos como son “thumbnail” , “medium”, “large”  y alguno mas para usar en cada tipo de contenido el tamaño de imagen mas acorde, por ejemplo si tu posts tiene una miniatura de 150px x 150px no es nada bueno que la imagen que contenga sea la que tu has subido de 1400px x 700px , esto al final resiente la velocidad de tu sitio.

Pues bien el código mencionado es el utilizado para que el desarrollador cree su propias dimensiones de imágenes  de acuerdo con el tema que tiene entre manos y durante el desarrollo con este plugin redimensionamos las imágenes a los tamaños que vayamos añadiendo, es muy útil.

También lo podemos utilizar al cambiar de tema para que se adapten a las especificaciones de este, pero decir que esto esta bien en una instalación de pruebas donde tenemos pocas imágenes destacadas, ya que en una web con muchas entradas e imágenes el trabajo es arduo y tarda una eternidad.

2018-06-04_0942

Theme Check

Theme check es un complemento que se encarga de revisar que tu plantilla cumpla con los estándares de revisión de temas de wordpress.

Cuando subes tu tema al repositorio de wp este te hace una comprobación inicial la cual debe aprobar para después pasara a una revisión manual de parte de los revisores de temas.

Pues bien Theme Check nos sirve para hacer esa revisión inicial desde el “dashboard” de nuestra instalación y ahorrarnos ese paso.

Si quieres compartir tus plantillas en wordpress.org deberías usar este plugin sin duda.

Theme Sniffer

Para reforzar el test de posibles errores en nuestro tema , también podemos usar Theme Sniffer , que aunque no es el oficial de wordpress realiza comprobaciones mas exhaustivas que Theme Check no hace.

Puedes descargarlo del repositorio de Github.

Espero que sean de utilidad estas referencias en tu desarrollos, seguire añadiendo nuevas herramientas que crea son útiles.

Comenta si tu utilizas otras o simplemente da tu opinión sobre el tema.