wordpress: scroll infinito o Load More

Buenas a tod@s

Por exigencias ajenas a mi necesitaba un scroll infinito pero que fuera clickando y no automatico, es decir; cuando llegas al final de los posts visualizados que se carguen mas sin recargar la web pero solo si el usuario hace click

Gracias al plug-in Easy Load More en dos minutos lo tendremos preparado:

  • lo descargamos y lo instalamos
  • lo activamos y vamos a configuracion
  • en el primer campo nos solicita Post List Wrap Selector aqui debemos indicar el id del div que contiene el bucle que muestra los posts
  • guardamos y a continuacion vamos al php donde queremos agregar el boton load more
  • tenemos que incluir load_more_button(); entre las marcas de codigo php justo despues del cierre del contenedor o div donde esta el bucle

Yo lo he probado y funciona muy bien, ahora queda css y dejarlo bonito. Suerte!

Anuncios

Los mejores plugins de #Photoshop que todo diseñador debe instalar by @GTechDesignNet

Los mejores plugins de #Photoshop que todo diseñador debe instalar by @GTechDesignNet

fuente: http://gtechdesign.net/es/blog/mejores-plugins-de-photoshop-que-todo-disenador-debe-instalar

los-mejores-plugins-de-photoshop-que-todo-disenador-debe-instalar-by-gtechdesignnet

Photoshop es la herramienta más usada entre los creativos del diseño a nivel mundial. Pero, ¿cómo se pueden mejorar las características de Photoshop para que sea más productivo?. Adobe Photoshop soporta plugins externos que mejoran sus capacidades de manera impresionante.

A continuación ofrecemos una lista con 11 de las mejores extensiones para Photoshop que todo diseñador debe tener. Estos plugins te ayudarán a ahorrar tiempo y automatizar muchos procesos tediosos, serás capaz de trabajar más rápido y de forma más productiva utilizando estos sorprendentes extensiones de Adobe Photoshop

Ver artículo completo en la web del autor

Las 5 mejores extensiones de #Google #Chrome para #SEO by @Abrelink

Las 5 mejores extensiones de #Google #Chrome para #SEO by @Abrelink

fuente: http://www.abrelink.com/5-extensiones-chrome-seo/

las-5-mejores-extensiones-de-google-chrome-para-seo-by-abrelink

13Las 5 mejores extensiones de Google Chrome para SEO

Muchas veces, cuando hablamos de analítica SEO, inmediatamente pensamos en complejas aplicaciones para instalar en nuestro ordenador o en herramientas online, algunas gratuitas y otras de pago. Sin embargo, hay atajos mucho más rápidos para obtener una información útil sin tener que indagar en profundidad. Pues bien, si tu navegador es Google Chrome (Firefox tiene sus propios complementos y Explorer…, bueno Explorer no tiene nada) y te dedicas al posicionamiento web, ya sea como aficionado o como experto, harías bien en instalar estas 5 extensiones para SEO, indispensables para cualquier profesional. Todas ellas son gratuitas y resultan de una ayuda inestimable.

Ahora, antes de enumerarlas, una recomendación: descárgatelas siempre de Chrome Web Store, si no quieres que se te instale malware en la toolbar, con los quebraderos de cabeza que ello conlleva.

1- MozBar

Es mi preferida, y la utilizo a diario. Nos indica el PA y el DA de la página web que tengamos abierta. También nos muestra su Spam Score y las señales sociales de Facebook y Google +. Si pinchamos en el icono de la lupa, se nos abre un desplegable con los elementos On-Page (URL, title, description, keywords, h1, h2, bold/strong, italic/em, texto alt), los atributos generales (como el rel=”canonical”, el meta robots o el tiempo de carga), las métricas (MozRank, MozTrust, links externos), los marcadores para Schema y microformatos, así como las Twitter Cards y los Open Graph, y el Http Status, donde puedes observar si hay una redirección 301 ó 302.

De la misma manera, si hacemos clic en el icono del lápiz, podemos marcar en colores (cian, fucsia, azul, amarillo) los links follow, nofollow, externos e internos.

Adicionalmente, MozBar te permite cambiar las opciones de configuración y desplazar la barra de arriba hacia abajo.

2- SEOquake

Esta extensión ocupa el segundo lugar en mi orden de preferencias, y no puede faltar en ninguna lista ni barra de navegación. SEOquake te facilita una información de la página con los principales valores: title, meta keywords, meta description, links internos, links externos, servidor, señales sociales (incluso de Pinterest y Linkedin), antigüedad del dominio, presencia en Dmoz y backlinks para SEMrush, entre muchos otros.

También te ofrece un diagnóstico o auditoría SEO de la página donde te informa de si tienes bien configurado el robots.txt, el sitemap xml, si tienes especificado el idioma de la página y el doctype, o si está correctamente implementado el código de Google Analytics, y si usas microformatos y hasta si tienes un favicon. Asimismo, mide el número de caracteres del title y del meta description, los encabezados y el atributo ALT de las imágenes, así como el ratio texto/HTML, y te da consejos sobre cómo mejorar cualquier aspecto que presente deficiencias.

Por último, SEOquake es especialmente útil para analizar la densidad de palabras clave, y no sólo por palabras aisladas, sino también en frases de dos o más términos. Incluso te muestra el texto original como bloque.

3- Open SEO Stats

Esta extensión nos proporciona una información bastante completa y valiosa, como el número de páginas indexadas por Google y Bing, señales sociales en Facebook y Google Plus, robots.txt y sitemap.xml, Whois del dominio, info de la página con los típicos atributos, incluyendo enlaces externos e internos y etiqueta canonical, y una lista completa de todos los links con sus correspondientes anchor text. También te señala la velocidad de carga, y un acceso directo a una serie de herramientas como Google Webmasters Tool, Google Trends y Keyword Planner.

4- Quick SEO by Rank Signals

Se trata de una extensión creada por la compañía Rank Signals, que nos permite consultar nuestro Pagerank, backlinks únicos y totales y, como curiosidad, pone un enlace a Wayback Machine y un Whois. Aunque esta herramienta a través de su web es gratuita, sólo nos muestra un número limitado de enlaces. Eso sí, nos indica si son follow o nofollow.

5- Majestic Backlink Analyzer

Como su propio nombre indica, es una extensión para Chrome creada por la prestigiosa compañía Majestic que con un simple clic te ofrece las métricas características de esta empresa: Trust Flow y Citation Flow, junto con los backlinks externos y los dominios de referencia. También incluye otras APPs avanzadas sólo disponibles para suscriptores.

Hay otras extensiones SEO que bien podrían figurar en esta lista y que probablemente encontraréis en otras del mismo género, como SEO SERP o SEO for Chrome, y que yo mismo suelo usar en mi trabajo de posicionamiento web, pero quería hacer una lista breve con las que a mi entender son las más útiles y mejores. Espero que a vosotros también os hayan servido.

#wordpress: plug-in para desarrollar en el servidor final mostrando coming soon

Buenas

A mi me gusta desarrollarlo todo en el servidor final (probablemente mal hecho pero soy asi). Desarrollar en un servidor local es ligero, facil, recomendable, etc … y luego migrar de servidor local a servidor web final esta “chupao”, pero no me fio ya lleve alguna vez mas de un disgusto con la migracion dichosa

Problema: si desarrollamos en server final se nos ve el plumero de lo que estamos haciendo por el tema de las urls y el htacces … por mucho que queramos poner coming soon se nos vera el index del wordpress

Con el plug-in UnderConstruction podremos poner el coming soon (proximamente) y todo el mundo que acceda sin estar logado en wordpress lo vera, nosotros al estar logados veremos el index del wordpress y podremos desarrollar a salvo de miradas indiscretas xDD

Como siempre espero haber sido de ayuda a alguien mas que a mi, escribo este blog con el animo de recordar las cosas que hago no de ser la luz que guie los pasos de nadie … pero bueno de paso si puedo ayudar pues como dios 😉

Un saludo!

P.D.: seguramente el articulillo podria haber sido escrito mucho mejor, mas claro y menos lioso … pero es lo que tiene andar con prisa y escribir “al vuelo”, sorry

wordpress-plug-in-para-desarrollar-en-el-servidor-final-mostrando-coming-soon

#photoshop: retrato #ilustración con el filtro topaz labs, #gta style by @castrocao

fuente: http://gustavo-castro.com/blog/retrato-ilustracion-con-el-filtro-topaz-labs/

¿Que tal? Primero desearos un feliz año 2014. Hoy vamos a ver como crear un efecto de ilustración, parecido a las ilustraciones del famoso videojuego GTA, sobre un retrato. Un efecto muy bueno que lo haremos mediante los filtros de Topaz labs, “Topaz Adjust” y “Topaz clean”. Aunque no hay nada como hacer las cosas lo más artesanalmente posible para dominar y controlar el efecto, los filtros de Topaz Labs son francamente buenos y podemos conseguir efectos increibles.


Perfecto. Primero os muestro a continuación la imagen de partida que he utilizado, para que así podáis comparar el resultado. (Ver imagen).

Lo primero que vamos a hacer una vez que tengamos abierta la imagen es convertirla en objeto inteligente haciendo clik con el botón derecho. Cuando lo tengamos, nos vamos a “filtro / Topaz Labs / Topaz Adjust”. De este conjunto de filtros, para este efecto sólo vamos a utilizar dos. Podeís ver la ubicación de los filtros. (Ver imagen).

Cuando se nos abra la ventana de configuración de los filtros, lo primero que vamos a hacer es en el lado izquierdo seleccionar el grupo de efectos “Styliced Collection” y el preset “Vivacious”. Ahora nos vamos a la parte derecha a “Global Adjustments / Adaptative Exposure” y ponemos unos valores como los que os muestro en la imagen. De aquí solo moveremos los valores de exposición y las zonas para darle más o menos detalle. (Ver imagen).

A continuación seleccionamos “Global Adjustments / Color”, y aquí lo que haremos será bajar un poquito el valor de la saturación para apagar los colores. (Ver imagen).

Aplicamos cambios pulsando “ok”. Ahora a por la segunda parte. Nos vamos a “filtro / Topaz Labs / Topaz Clean” y cuando se nos abra seleccionamos en el lado izquierdo el grupo de efectos “Cartooned”. Ahora en la pestaña “Clean” del lado derecho, ponemos unos valores como en la imagen. Estos valores harán que se asemeje a una ilustración. Podéis jugar con los valores para marcar más o menos el efecto. (Ver imagen).

Seguimos en esta ventana pero ahora en la pestaña “Edges”, donde marcaremos bastante el efecto mediante el enfoque. (Ver imagen).

Ahora vamos para finalizar, a la pestaña “Texture” donde moveremos el valor de la textura un poquito solamente ya que este valor saca la textura original de la imagen, luego si lo queremos más tipo ilustración no nos quedaría bien. (Ver imagen).

Aplicamos y ya lo tenemos.
Impresionante ¿Verdad?

Cómo crear formularios de #contacto en #WordPress by @manuelvicedo

fuente: http://manuelvicedo.com/wordpress/crear-formularios-wordpress/

Los formularios siempre han sido una parte esencial de Internet, y se utilizan desde hace muchos años para introducir datos y enviar información importante de un lugar a otro. En concreto, los formularios de contacto son una pieza integral de la mayoría de los sitios web, ya que es la principal forma que tienen los visitantes de comunicarse con el webmaster.

Utilizando los plugins adecuados, en WordPress puedes crear tus propios formularios con relativa facilidad. Es más, gracias a ellos puedes llegar a crear una gran variedad de páginas: desde simples formularios de contacto, hasta calendarios de citas y reservas para tu propio negocio.

Por qué los formularios son tan importantes

Los formularios son la clase de elementos que todo sitio web tarde o temprano necesita utilizar, ya que es la única manera posible de enviar información estructurada y almacenarla correctamente en una página web.

Ya seas una pequeña empresa o una tienda online, tener algo tan sencillo como un formulario de contacto es necesario para poder recibir mensajes y comunicaciones de tus visitantes. Aunque en teoría podrías prescindir de un formulario y en su lugar publicar tu dirección de correo, eso sólo resultaría en una gran cantidad de spam para tu bandeja de entrada.

La gran ventaja de los formularios web es que te permiten procesar toda la información que en ellos se introduce, y así darle un uso particular dependiendo de tus necesidades. Por ejemplo, es posible que te interese guardar todas las direcciones de correo de tus solicitudes de contacto en una base de datos, para después saber quiénes te han estado contactando y enviarles alguna oferta.

Cómo crear formularios en WordPress

Es posible que te hayas percatado de que WordPress recién instalado ya viene con algunos formularios para usos específicos. Por ejemplo, está el buscador nativo que puedes añadir utilizando el widget correspondiente, y con el cual es posible realizar búsquedas avanzadas del contenido de tu sitio.

Sin embargo, si deseas crear formularios personalizados y utilizarlos para una tarea en particular, necesitarás hacer uso de algún plugin para ello. Aunque existen muchos plugins que te permiten trabajar con formularios de contacto y realizar una gran cantidad de tareas diferentes, mi recomendación es recurrir a uno de los más populares que existen: Contact Form 7.

Contact Form 7 es un plugin gratuito probado y madurado, con una enorme cantidad de descargas y un uso muy activo. Además, su uso es relativamente sencillo para quienes están empezando y te permite experimentar fácilmente nuevas formas de tomar datos desde tu página web. Por si eso fuera poco, en su sitio oficial puedes encontrar una documentación (en inglés) bastante completa.

Utilizando Contact Form 7

logo-contact-form-7

Este plugin te permite crear formularios sencillos, mediante los cuales puedes recibir la información que tus visitantes puedan introducir. Esto no sólo se limita a formularios de contacto, sino que ademáspuedes aprovecharlo para otros usos:

  • Formularios de registro
  • Consultas de citas
  • Solicitudes de presupuesto
  • Botones ‘Llámame’

Además, en el repositorio oficial de WordPress podrás encontrar algunos plugins adicionales que complementan la funcionalidad de Contact Form 7.

Cómo funciona Contact Form 7

La forma de trabajar con Contact Form 7 es bastante directa: una vez has instalado el plugin, verás que aparece una nueva sección en tu panel de administración denominada Contacto. En esta sección podrás crear tantos formularios como desees, cada uno con sus respectivos campos y textos de respuesta.

Los formularios, una vez creados, los podrás incrustar con un shortcode que el plugin te proporciona, basándose en una ID única para cada uno.

Este shortcode, al igual que todos los demás, lo puedes insertar en prácticamente cualquier partede tu sitio WordPress: puedes añadirlos al contenido de tus páginas, como un widget de texto, o incluso en algún area especial si el tema WordPress que utilizas lo permite. De esta forma, con Contact form 7 te es posible insertar formularios en casi cualquier parte de WordPress.

Cada vez que alguien rellene tu formulario, sus datos se enviarán en un email a la dirección que especifiques, y con el formato que desees. De esta forma puedes ser notificado cada vez que alguien desea ponerse en contacto contigo.

Creando tu primer formulario

En lugar de disponer de una interfaz para añadir o quitar campos, con Contact Form 7 deberás utilizar una amplia caja de texto para crear el formulario a mano. Esto le aporta mucha flexibilidad al plugin ya que lo convierte en un lienzo totalmente libre, pero también hace que sea un poco complejo de utilizar si no tienes conocimientos de HTML o algún lenguaje parecido.

Por suerte, a la derecha de la caja de texto podrás utilizar un generador de campos para hacerte la vida más fácil.

contact-form-7-formulario

Los formularios en Contact form 7 se crean mediante una combinación de etiquetas propias del plugin, las cuales sirven para insertar los diferentes campos del formulario e indicar los valores que deben tener. La sintaxis de estas etiquetas suele ser la siguiente:

[text* campo-nombre 30/50 “Introduce Tu Nombre”]

Como ejemplo, este código creará un campo de texto con los siguientes valores:

  • text: Indica que se trata de un campo de texto.
  • Asterisco (*): Hace que el campo sea obligatorio y no pueda estar vacío.
  • campo-nombre: Es el nombre de referencia del campo, y debe ser único.
  • 30/50: Indica el tamaño del campo (30), y la cantidad de caracteres máxima (50).
  • “Introduce Tu Nombre”: Es el texto mostrado cuando el campo está vacío.

Como ves, la sintaxis para crear los campos puede ser un poco compleja, pero a la vez te da muchas opciones para cubrir todos los casos de uso posibles. Por suerte, la gran mayoría de estos atributos es opcional, así que un campo más simplificado podría ser así:

[text* campo-nombre]

Ahora no parece tan complicado, ¿verdad? Toda la información acerca de los valores que puedes utilizar en tus campos está muy bien explicado en la documentación de Contact Form 7, de la cual puedes echar mano para crear verdaderas maravillas.

Este plugin no sólo te permite crear campos de texto, sino que te da la posibilidad de añadir todo tipo de elementos a tu formulario: listas desplegables, casillas, subida de archivos, campos de fecha, y muchos más. Debido a la naturaleza de cada uno de estos campos, muchos de ellos tienen su forma particular de ser configurados:

Un detalle muy importante es que, además de los campos que puedas introducir en tu formulario,también podrás insertar etiquetas HTML normales. Así, los usuarios avanzados que conozcan un poco de HTML y CSS pueden crear prácticamente cualquier diseño de formularios e incorporarlo en sus sitios web.

Configurando las opciones de tu formulario

Una vez has creado tu formulario, puedes configurar los mensajes de aviso/error y el email que Contact Form 7 te enviará.

Dentro del cuerpo del correo deberás colocar cada uno de los campos que has añadido en el propio formulario, ya que el plugin no te los mandará en un archivo adjunto ni automáticamente. Hacer esto es tan fácil como utilizar el nombre de referencia que le has dado a cada campo rodeado de unos corchetes– siguiendo el ejemplo anterior, para insertar el campo en el correo deberías añadir la siguiente etiqueta:

[campo-nombre]

Con esto podrás estructurar el correo de la forma que quieras, y también mandarlo a tantos destinatarios como desees.

contact-form-7-mensajes

Insertando tu formulario

Teniendo tu formulario creado, ahora sólo te queda insertarlo dentro de tu sitio web. Tanto en el listado de formularios como en la pantalla de edición, podrás ver que Contact Form 7 te proporciona en todo momento un shortcode para incrustarlo, con el siguiente aspecto:

[contact-form-7 id=”1045″]

En la mayoría de los casos, te bastará con copiar y pegar este código en cualquiera de tus páginas o entradas, y al cargarla podrás ver cómo aparece el formulario en medio de tu contenido.

formulario-contacto

Cabe decir que los temas premium de CPOThemes ofrecen integración con este plugin, y los formularios que construyas quedarán automáticamente estilizados e integrados con el resto del diseño. Muchos otros temas no proporcionan ningún tipo de estilo a los campos de los formularios, y por tanto se ven muy pobres.

Empieza a crear tus formularios en WordPress

Como ves, crear tus propios formularios en WordPress es bastante simple, y los ejemplos que hemos visto sólo rozan la superfici de todo lo que se puede hacer. Más adelante veremos otras opciones para crear formas de enviar datos a través de tu página web, además de trucos y técnicas que te permitirán darle más usos a este plugin.

¿Y tú? ¿Utilizas Contact Form 7 u otro plugin para los formularios de tu sitio WordPress?