Blog de Estrategia y Marketing Digital

Cómo poner iconos de redes sociales en Wordpress - Solución a problemas

[Solución a problemas] Iconos de redes sociales en WordPress

Cómo poner iconos de redes sociales en WordPress - Solución a problemasHace un tiempo escribí un post en el que explicaba una forma de poner los iconos de redes sociales en WordPress.

En este post cuento el proceso completo, desde cómo subir las imágenes a nuestro WordPress hasta qué código usar y cómo poner varias filas de iconos.

Sin embargo, casi todas las semanas me llega algún mensaje, ya sea desde los comentarios o por e-mail, en el que me dicen que no les salen y me preguntan sus dudas. La verdad es que cuando yo estuve investigando sobre cómo ponerlos también me costó la misma vida.

Las dudas siempre son las mismas, así que he pensado que hacer una “respuesta general” puede ayudar bastante a los que lleguen aquí en busca de cómo poner los iconos.

No me reconoce/sale la imagen

Esto suele ser por 2 motivos:

  1. La imagen tiene caracteres que WordPress no reconoce, por ejemplo: Ñ, ¿ ?, ( ), ¡ ! El nombre de la imagen solo debe contener letras (excepto la Ñ), números, guión bajo o guión medio. Si le pones otros caracteres puede ser que WordPress no reconozca el nombre y, por lo tanto, no muestre la imagen.
  2. Se han duplicado las comillas. Esto os ha pasado a muchos, que al guardar el código en el widget se os duplican las comillas (es posible que esto sea porque habéis copiado y pegado). Si pasa esto prueba a borrar el código y a escribirlo a mano, usando la comilla simple que está en la misma tecla del signo de interrogación. Es decir, para entendernos mejor: el código que puse en el post era el siguiente (y que funciona bien):

<center>
<tr>
<td>
<a href=’URL DE DESTINO style=’display:inline-block;’ target=’_blank’><img border=’0′ src=’URL DE LA IMAGEN‘ target=’_blank’/></a>
</td>
</tr>
</center>

Como ves lo que utilizo es la comilla simple, la que está en la misma tecla del signo de interrogación (?). Cuando me meto a ver por qué no os sale bien el icono me suelo encontrar esto:

<center>
<tr>
<td>
<a href=”‘URL DE DESTINO‘” style=”‘display:inline-block;”‘ target=”‘_blank'”><img border=”‘0′” src=”‘URL DE LA IMAGEN‘” target=”‘_blank'”/></a>
</td>
</tr>
</center>

Como ves se han duplicado las comillas, ahora salen las dobles (“) y la simple (‘). Creo que esto pasa al copiar y pegar, por lo que lo ideal es borrar todo el código y escribirlo a mano, con la comilla simple de la tecla (‘).

El tamaño no sale como quiero

Lo ideal es subir la imagen directamente del tamaño que quieras que aparezca, pero si no puedes jugar con los códigos width y height.

<center>
<tr>
<td>
<a href=’URL DE DESTINO‘ style=’display:inline-block;’ target=’_blank’><img border=’0′ src=’URL DE LA IMAGEN‘ target=’_blank’ width=’X‘ height=’X‘/></a>
</td>
</tr>
</center>

Poniendo en la X el número de píxeles que quieras que tenga la imagen.

Espero que te haya servido y hayas resuelto tus dudas, de todas maneras, por aquí seguimos para cualquier pregunta 🙂

Imagen

Deja tu comentario

Tu correo electónico no será publicado. Los campos obligatorios estan marcados con un *