Smiley

Cómo ocultar las estadísticas de emoticonos de WordPress de la manera correcta

SmileyPara todos aquellos que usan el Complemento de estadísticas de WordPress.com, notará que inserta una pequeña imagen sonriente en su pie de página. Esta imagen debe cargarse para realizar un seguimiento de las estadísticas.

Algunas personas pueden pensar que esta carita sonriente es “linda”. El resto de ustedes encontrarán la imagen sonriente desagradable (y posiblemente maligna) y buscarán formas de eliminarla. Esta publicación revisará:

  • Primero que nada, que no que hacer mientras esconde el smiley
  • Cómo ocultarlo correctamente, con una calidad posicional absoluta adicional para algunos diseños
  • Si prefiere no ocultarlo, cómo centrar fácilmente la imagen del emoticón

Lo que no debes hacer

Nunca usar pantalla: ninguna para ocultar las estadísticas de Smiley WP.

En primer lugar, quiero volver a la única cosa que no debería hacer cuando intentas ocultar el Smiley de WP Stats, y se usa: display:none. Sí, lo dije dos veces, pero solo me aseguré de que no te lo perdieras.

Sí, ese es el mismo código que puedes usar para obtener un Efecto CSS Killswitch, pero definitivamente no es algo que desee usar para no mostrar una imagen, que debe cargarse para mostrar las estadísticas con precisión.

Que hacer en su lugar

De acuerdo a esta publicación, el desarrollador recomienda usar el siguiente código en su hoja de estilo (p. ej. style.css) si quieres ocultar el emoticón:

img#wpstats{width:0px;height:0px;overflow:hidden}

Algo similar al código anterior se vería así:

img#wpstats{visibility:hidden}

la diferencia entre visibilidad: oculta y pantalla: ninguna is visibilidad: oculto siempre ocupará espacio de diseño, mientras que display: none no lo hará (y recuerde, no puede usar display: none a menos que desee que su rastreador de estadísticas esté bloqueado).

En algunos diseños hay un pequeño problema con este código que ocupa espacio debajo del pie de página, así que pensé en una solución más creativa.

Aquí hay un ejemplo de lo que estoy hablando, observe la cara sonriente en la esquina inferior izquierda que hace que el diseño del pie de página se rompa.

Smiley malvado

Con los dos ejemplos anteriores, la imagen, aunque no visible, aún ocuparía espacio en el diseño, haciendo que esa barra gris claro (que es el color de fondo) aparezca. Plan) en el pie de página.

Posicionamiento absoluto

Una combinación de posicionamiento absoluto y el código anterior es una buena forma de eliminar este problema. Puedes probar algo como esto:

img#wpstats{position:absolute;top:0;width:0px;height:0px;overflow:hidden}

Centrar la imagen

Dependiendo de su diseño, en lugar de ocultarlo, podría verse un poco mejor si la imagen del emoticón estuviera centrada. Puede hacer esto fácilmente con el siguiente fragmento de código.

img#wpstats{display:block;margin: 0 auto}

Explicación:

  • Configura la imagen para que se muestre como un bloque (en lugar de en línea, de forma predeterminada).
  • Configure los márgenes izquierdo y derecho en automático para centrar eficazmente la imagen ahora atascada.

Puede utilizar este CSS para centrar correctamente casi cualquier etiqueta “img” sin utilizar marcado adicional.

Conclusión

Por cierto, si usa el WP Stats Smiley Remover plugin, no lo hagas. Porque haga lo que haga, agrega el CSS “display: none” a su encabezado. Exactamente lo que tu no se supone que haga.

Espero que les haya gustado la sugerencia de WordPress / CSS. Como el el último, Sé que fue relativamente simple. Puedo hacer otros más avanzados, así que si tienes alguna solicitud de consejos rápidos de CSS como este, házmelo saber en los comentarios.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Ir arriba