Blog sobre desarrollo WordPress en Español Desarrollo WordPress en Español
osm contact info

OSM Contact Info Widget

Éste plugin de creación propia agrega un widget en el área de administración que te permite añadir tu información de contacto a tus widgets.

screenshot-1

 

Permite elegir entre 3 tipos diferentes de formatos: texto plano, hCard, o con iconos de Font Awesome. En cualquiera de los tres formatos puedes maquetar el widget para adaptarlo a tu diseño usando las clases que escribe por defecto:

//hCard <h2 class="widget-title">Contact Information</h2> <div id="osm-contact-info-widget-wrapper"> <div id="hcard-Company Name" class="vcard"> <div class="fn org"> Company Name </div> <div class="adr"> <span class="street-address">Address</span><br /> <span class="postal-code">Postal Code</span> <span class="locality">City</span>, <span class="region">Province</span> (<span class="country-name">Country</span>) </div> <a href="mailto:email@email.com" class="email">email@email.com</a> <div class="tel"> <span class="type">work</span>: <span class="value">555 555 555</span> </div> <div class="tel"> <span class="type">work</span>: <span class="value">777 777 777</span> </div> <div class="tel"> <span class="type">fax</span>: <span class="value">999 999 999</span> </div> </div><!-- vcard --> <p>lorem ipsum dolor sit amet</p> </div><!-- osm-contact-info-widget-wrapper --> //Texto plano <h2 class="widget-title">Contact Information</h2> <div id="osm-contact-info-widget-wrapper"> <div class="contactinfo-company"> Company Name </div> <div class="contactinfo-address"> Address<br /> Postal Code City, Province (Country) </div><!-- contactinfo-address --> <div class="contactinfo-phones"> Phone 1: 555 555 555<br /> Phone 2: 777 777 777<br /> Fax: 999 999 999<br /> </div><!-- contactinfo-phones --> <div class="contactinfo-email"> <a href="mailto:email@email.com" class="email">email@email.com</a> </div><!-- contactinfo-email --> <p class="contactinfo-text">lorem ipsum dolor sit amet</p> </div><!-- osm-contact-info-widget-wrapper --> //Font Awesome <h2 class="widget-title">Contact Information</h2> <div id="osm-contact-info-widget-wrapper"> <div class="contactinfo-company"> <i class="fa fa-list"></i> Company Name </div> <div class="contactinfo-address"> <i class="fa fa-map-marker"></i> Address<br /> Postal Code City, Province (Country) </div><!-- contactinfo-address --> <div class="contactinfo-phones"> <i class="fa fa-phone"></i> 555 555 555<br /> <i class="fa fa-phone"></i> 777 777 777<br /> <i class="fa fa-fax"></i> 999 999 999<br /> </div><!-- contactinfo-phones --> <div class="contactinfo-email"> <i class="fa fa-envelope"></i> <a href="mailto:email@email.com">email@email.com</a> </div><!-- contactinfo-email --> <p class="contactinfo-text">lorem ipsum dolor sit amet</p> </div><!-- osm-contact-info-widget-wrapper -->

Simplemente dirígete a Plugins => Añadir Nuevo, busca “OSM Contact Info Widget” e instálalo, o si lo prefieres te los puedes descargar pinchando aquí. Una vez instalado, ve a Apariencia => Widgets, selecciona el widget “OSM Contact Info Widget” y arrástralo a tu sidebar.

Puede que también te interese

Cómo solucionar el error de las cabeceras han sido enviadas en WordPress
Cómo solucionar el error de las cabeceras han sido enviadas en WordPress
El error de las cabeceras han sido enviadas es uno de los errores más comunes, no sólo en WordPress. Normalmente te aparece en pantalla un mensaje…
Reemplazar palabras por enlaces en nuestras entradas
Reemplazar palabras por enlaces en nuestras entradas
En algunas ocasiones puede ser de utilidad crear una función para automatizar un proceso como por ejemplo sustituir palabras por enlaces dentro del contenido de…
No indexes las páginas de error 404
No indexes las páginas de error 404
En este post vamos a ver cómo indicar a los robots de búsqueda que no indexen las páginas de error 404 en WordPress. Un error 404…
Mejora la puntuación de Google PageSpeed Insights: Eliminar el JavaScript que bloquea la visualización del contenido de la mitad superior de la página
Mejora la puntuación de Google PageSpeed Insights: Eliminar el JavaScript que bloquea la visualización del contenido de la mitad superior de la página
1. Optimizar imágenes 2. Minificar CSS y JS 3. Especificar caché de navegador 4. Habilita la compresión 5. Reducir el tiempo de respuesta del servidor…