DESAFÍO CONSTRUYE TU WEB EN 5 DÍAS

Sin conocimientos técnicos y desde cero

 (Páginas Web para Emprendedores, Pequeñas Empresas y Comercios)

TIEMPO DE LECTURA: 9 minutos
Antes de comenzar a construir tu web, o la de tu negocio, es IMPORTANTE dejar claro una cosa: lo que realmente va a hacer que tu web funcione no es la tecnología… los themes, los plugins…, etc;… lo único que hará es alejarte de lo que realmente es importantante: EL CONTENIDO.

Y solo puedes acertar de una forma conociendo quien es tu cliente ideal, a quien te dirijes, que problemas tiene y… cual es LA SOLUCiÓN a sus probelmas (esta es tu parte).

Por eso es importante que descargues la hoja de trabajo para construir tu cliente ideal.

Ahora si tendrás claro a quien le vendes y porqué comprará.

 

Resumen

 

Sigue los pasos en este orden

DIA #1

Guía Web con WordPress Paso a Paso, #1

Instalación WordPress #2

Configurando WordPress #3

Mejorando tu instalación WordPress #4

 

DIA #2

Instalación del Theme: Divi #5

Optimizando tu instación: Analaytics y Search Control #6

¿Necesitamos un Child Theme? #7

Los 3 secretos que harán de tu web un sitio profesionaldiferente a los demás #8

 

DIA #3

Creando la página de inicio #9

Fijando la página de inicio y creando el menú #10

Añadir contenido al blog: los posts #11

Usando el contructor en los posts #12

 

DIA #4

Sidebar y widgets #13

Una página de blog que mola #14

Tuneando el footer (pié de página) #15

Más potencia a WordPress: Bloom, formularios de suscripción #16

 

DIA #5

Barra inferior del pié de página #17

Insertar un botón de llamada en un clic para móvil #18

Llevar tu web a otro nivel: Plantilla de estructura #19

Guía de imágenes #20

 

 

Instrucciones paso a paso para la creación de una página web para empresarios, comercios y pequeñas empresas locales

Este post es para tres tipos de empresarios

  1. personas que gestionan comercios tradicionales y no quieren comercio electrónico
  2. gerentes de pequeñas empresas
  3. profesionales liberales como abogados, gestores, psicólogos, dentistas…

Y cuyo objetivo es, ser encontrados en la red ya que esta se ha convertido en el primer (y casi único medio de búsqueda por parte de los usuarios)…

y no necesitan de un gran desarrollo web sino que lo que precisan es una ficha de negocio personalizada para dirigir tráfico offline o la venta de una primera cita o consulta.

¿eres de alguno de estos tipos de personas?

-Genial, porqué estás en el sitio adecuado, así que… vamos a empezar.

 

Antes de continuar, quisiera dejar claro qué NO vamos a ver en esta guía, qué vamos a necesitar y una advertencia. En esta guía NO veremos nada sobre:

  • uso de FTP
  • nada de código CSS ni HTML
  • Google ads / ads en general
  • SEO
  • diseño en local
  • como ganar pasta con un blog (si esto es lo que te interesa puedes ir aquí)
  • nada que crea que es demasiado técnico y que aleje esta guía de su propósito

 

“Materiales” necesarios:

 

ADVERTENCIA

a lo largo de la guía encontrarás enlaces a sitios de interés de servicios y productos que recomendamos y que SIEMPRE, SIEMPRE HEMOS PROBADO Y USAMOS. Algunos son de afiliado. ¿Qué significa esto? que si finalmente compras, nosotros recibiremos una pequeña comisión. ¿Esto te perjudica? en absoluto. NO verás el precio incrementado por el hecho que vayas por medio de nuestro enlace. En cualquier caso, si quieres echar un vistazo, abre una nueva pestaña y ve directamente.

 

Y… ya entrando en materia…

¿Cuantas veces lo has pensado y nunca arrancaste con este nuevo proyecto?

Vamos a comenzar a establecer nuestra presencia online y sabes bien que comienza por tener tu espacio propio en internet.

Un espacio que tu controles 100%, ya sea para fines personales y escribir sobre tu afición… o por fines profesionales y necesitas ser encontrado para generar negocio, que si te apetece cambiar su color, lo cambies, que si te apetece escribir, escribes, que tiene el nombre que tu decidas, por ejemplo tu propia marca…

¿Seguimos?

 

 

Tu página web es el único espacio en internet que controlas 100%

DÍA #1

WordPress Paso a Paso, #1

 

Tener presencia online pasa por tener una página web, sea cual sea la plataforma que escojamos si queremos dar un paso más allá y tener algo un poco más profesional deberemos escoger un nombre de dominio, el nombre de tu web.

Las dos plataformas de blogging gratuito mas conocidas son Blogger y WordPress.

Ambas son buenas para iniciarte en este campo, pero, si lo que quieres es dar un paso adelante en la configuración de tu presencia digital, habrás de tener un nombre propio, tu marca, nombre de tu empresa o blog.

 

Elegir un nombre de dominio

Es lo primero que debemos hacer. A veces no es sencillo y si lees más blogs verás que cada uno te recomienda una cosa distinta.

Que si debe tener las palabras claves para tu negocio en el nombre, que mejor un punto com que punto es… etc.

Podríamos estar así durante días. Mi dominio es pepemontoro.es, es donde los usuarios encontrarán mi blog, aunque tenga aspecto de página web, depende donde estés mirando,

¿Porqué lo escogí?

pues quería enfocarme en público de habla hispana y quería hacerlo en forma de consultor autónomo, así que decidí que fuera mi nombre y primer apellido y que tuviera la extensión .es

Como ves no escogí .com ni tampoco las palabras marketing online que es a lo que me dedico.

Una palabra, mas corta o más larga, reconocible; incluso como hacen algunos bancos sobre todo, dominios más largos, incluso son una frase, pero que son fácilmente recordables.

 

Otras cuestiones sobre los nombres de dominio

Muchos de los que me seguís sabéis que imparto cursos de diseño web con wordpress sobre la creación de páginas webs y blogs con WordPress, pues bien, es raro que estos talleres no me pregunten varios cuestiones que siempre se repiten, dos que no fallan son:

¿Donde compras los dominios? Pues la verdad es que he cambiado bastante de proveedor, pero a ti que empiezas en esto te voy a recomendar DonDominio, por varias razones (y no… no llevo comisión).

 

 

Está integramente en castellano, los precios son razonables, ahora hablamos de esto, y lo que más me gusta es que en el proceso de compra es obligatorio, si no no puedes completarlo, que configures las DNS, también hablamos de eso más adelante.

¿Cuanto cuestan? Los hay de todos los precios. Unas veces depende de si están en oferta y otras por la extensión, no cuesta lo mismo un .com que un .XXX o un .co. Entre 10 y 15 euros/año es razonable.

Ya estamos preparados para la segunda parte que es elegir un hosting para tu blog. ¿Un que? eso, un sitio donde alojar tu web.

 

 

Elegir un Hosting para tu Blog

Otra decisión importante.

Una página web o blog tiene que “vivir” en un soporte físico, en un disco duro, tu alojamiento, o hosting, será la “casa” de tu web.

Será donde irán nuestros lectores, donde podrán acceder a los contenidos que publiques.

De igual forma que con el tema anterior, todos te recomendaremos cosas distintas, a cada uno de nosotros nos ha ido la película de forma distinta así que…

Unos te diremos que si debe tener IP ¿?¿? española, que si mejor que tengan soporte en castellano, que si tal o que si cual.

Otros te diremos que nunca hospedes la web donde compras el dominio otros que si, que donde compres el dominio también contrates el hosting, en fin, como ves un lío.

Lo único que puedo hacer es decirte que yo lo he hecho de todas formas y que me ha ido bien de unas y de otras, no he notado diferencias.

Unicamente que en el caso que decidas tener el alojamiento en otro lugar, todo este proceso inicial habrás de completarlo con otro paso más que es redirigir las DNS de tu blog, recuerdas que lo nombramos antes.

Para este tema de las dns prefiero dejarte un video donde compro un dominio y hago el proceso de redirección, claro que, si decides hacerlo con el hosting en otro proveedor, deberás contratar el hosting primero y comprar el dominio después.

Si has echado un vistazo a proveedores de hosting, habrás comprobado que todos tienen distintos planes y que no es fácil elegir, ya que te hablan de términos como capacidad, y transferencia, y tu no sabes cuanto te hace falta de lo uno ni de lo otro.

Pues te voy a dar a continuación un consejo que va bastante bien.

¿Qué Plan de Alojamiento debo Comprar para mi Página Web?

Seguro que tienes móvil,

¿recuerdas cuando tuviste que elegir que tarifa te venía mejor?,

¿No te encuentras ahora con esto del hosting igual?

Es un lio tremendo.

Que si plan baby, plan emprende, plan avanzado… ¿sigo? y cada uno con características y precios distintos.

Escoge un par de proveedores, bichea en la web, twitter y facebook a ver que comentamos los usuarios de ellos, y cuando decidas con quién, coge el más barato, siempre hay oportunidad de escoger otro plan más amplio.

No pienses que por quedarte corto vas a tener problemas, siempre es más fácil ampliar el plan que regresar a otro mas corto

Instalación WordPress #2

 

Instalaremos el CMS de uso más extendido en el mundo, que nos permitirá ser totalmente independientes gracias a su asequible curva de aprendizaje.

 

instalar wordpress

 

Recuerdo una charla en el que un ponente recomendó tener un blog personal para comenzar a tener identidad digital y que comentó que la mejor plataforma para hacerlo era WordPress.

Así que a la vuelta, busqué algunas referencias y de todo lo leído lo que más me gusto fue que podia hacerse casi todo y que no era tan difícil.

Entonces la plataforma no era ni de lejos lo que es hoy, cumplía su misión que era tener un blog, pero nada de florituras.

Poco a poco a una velocidad tremenda, al menos para mi, la cantidad de posibilidades que brinda este gestor de contenidos son inagotables lo que hace que el número de webs y blogs bajo esta plataforma aumente día a día casi de firma exponencial.

¿Qué podemos hacer si nos decidimos por instalar WordPress?

WordPress por un lado es una base o cuore de programa, común a todos los blogs y webs del mundo basados en él. Y por otro, y para que nos entendamos podemos “tunearlo” con trozos extra de programa que podemos acoplarle y es que lo que se llaman plugins.

Hay un respositorio, una especie de biblioteca con plugins, son todos gratuitos, y te los puedes descargar e instalar en tu wordpress libremente. Los hay para casi todo.

Además los hay de pago. Un método muy común son los plugin freemium, estos son que tienen dos versiones una básica, a veces te sorprenderás de lo que llamamos básico, y otras versiones con funcionalidades extra a la que se accede si pagas, aveces una sola vez y otras una cuota anual.

Pues bien añadiendo algunos de estos extra de programa, podremos adaptar WordPress a nuestras necesidades, por ejemplo, hay plugins que añaden funciones capaces de tener un motor de reservas si nuestra web se dedica a un pequeño hotel o casa rural, o en ocasiones es posible que lo que queramos es una tienda online lo que también es posible con la instalación de otro plugin.

Así que dependiendo de nuestros objetivos o necesidades y de los plugins que instalemos podremos hacer que WordPress se muestre como:

  • Un Blog
  • Una página web
  • Una página web con blog
  • Una tienda online
  • Una red social
  • Una red de blogs

Requisitos para instalar WordPress

Como ya vimos en el capitulo uno de esta guía, tendremos que tener un dominio y un plan de alojamiento previamente contratados a este paso.

Además necesitas una base de datos que puedes crear en tu alojamiento, pero gracias a la popularidad de WordPress, casi todos, por no decir todos los proveedores de hosting, disponen de instaladores automáticos, de forma que no has de tener conocimientos algunos a nivel técnico.

Depende el proveedor, este autoinstalador cambia, pero básicamente son: QuickInstall, Fantástico y Softaculous.

Procedimiento para instalar WordPress

Como en tantas otras ocasiones se tarda más en explicarlo que en verlo así que te dejo un video donde podrás ver como instalar wordpress con Quickinstall.

Pero antes una advertencia: En el proceso de instalación deberás poner un email de administrador.

En este campo pon tu email de trabajo, el que consultas todos los días. Todos tenemos varias cuentas y no se bien la razón normalmente se usa para este campo un email de estos que tenemos para otras cosas que a veces no recordamos ni la contraseña porque entramos de vez en cuando.

Pues bien, este email de administrador será EL NEXO DE UNIÓN ENTRE TU Y TU BLOG así que si alguna vez no recuerdas la contraseña y necesitas recuperarla WORPRESS LA ENVIARÁ A ESE EMAIL , si se diera el caso que no pudieras acceder al correo electrónico para recuperar la contraseña existen otros medios pero mejor que cuentes con un servicio de emergencias para recuperar el acceso a tu web.

En el paso anterior vimos como instalar wordpress en alojamiento o hosting.

Antes de continuar, una advertencia: lo único que tendrás que hacer será contestar a una serie de preguntas, no es necesario ningún nivel de conocimientos técnicos para realizar la configuración mínima necesaria.

Comenzamos a configurar wordpress desde cero.

 

Configurar WordPress

 

Cualquier sitio web, independientemente de como lo hayan construido, muestra dos aspectos.

Por un lado lo que vemos cuando navegamos, tuempresa.es por ejemplo. Pero también muestra una “puerta de atrás”, que será por donde accederemos para cualquier tarea que necesitemos hacer ya sea de diseño, estructura o generar contenidos.

Para poder acceder a administrar tu instalación wordpress deberás poner en tu barra de navegación tudominio.es/wp-admin, sustituyendo tudominio.es por el nombre del dominio que has comprado para tu página web.

Como ves en la imagen, tendrás delante simplemente un casillero para que pongas el usuario, que escogiste durante la instalación de wordpress, y tu contraseña, que la propia plataforma te envió al email que diste como email de administrador cuando se realizó la instalación de wordpress.

Ahora que hemos accedido podemos continuar con el siguiente paso.

Configurar WordPress desde Cero #3

 

Una vez introducidos usuario y contraseña, podemos comenzar a configurar wordpress. Todas las opciones se encuentran en el menú principal, en el lateral izquierdo.

 

 

En el caso que lo tengas en Inglés, tranquilo eso lo arreglamos ahora, así que busca Settings (Ajustes) en el menú y ahora General pon el idioma Español y guarda los cambios.

Verás que sólo consiste en poenr nuestras preferencias y no hay ninguna opción que nos complique la existencia. Haz lo mismo con los ajustes de Lectura y Escritura.

Quizás lo más importante para poder empezar a trabajar con wordpress es configurar, y hacerlo ahora es importante, el apartado Enlaces Permanentes.

 

 

Puedes seleccionar lo que mejor te parezca, pero lo más usado y es la opción que generará las url’s más limpias y amigables es la opción personalizada, selecciona y guarda los cambios.

Seguro que antes de empezar pensabas en otra cosa, pero no, ya está, podemos empezar a trabajar.

Más adelante puede que con la instalación de algún plugin necesitemos volver a configurar alguna otra cosa, pero lo mínimo para poder comenzar ya lo tenemos.

Mejorando tu instalación WordPress #4

 

Siempre explico que wordpress es como una Harley Davison, ya tenemos lo básico pero podemos seguir “tuneando” hasta el infinito y más allá, según nuestras necesidades o preferencias.

Estas ampliaciones de capacidades y funciones se incorporan a tu instalación añadiendo plugins o trozos extra de programación con una finalidad concreta.

Atento porqué los hay gratis y de pago… y algunos que comienzan gratis y si quieres ampliar pasan a ser de pago… vamos a ver algunos de los que para mí, son imprescindibles.

 

Copias de seguridad: UpdraftPlus

 

Fundamental. Este plugin te permite hacer copias completas de tu instalación, incluyendo: base de datos, plugins, archivos como imágenes o pdfs que hayas subido…, etc

Podrás vincularlo a tu cuenta de Dropbox para guardar una copia allí además de la que tengas en tu servidor.

Además podrás programar las copias y definir cuantas y con que frecuencia y todo… gratis total aunque también tiene versión de pago que por supuesto incluye más funciones.

 

 

Este paso será obligatorio cada vez que queramos instalar un nuevo plugin. A continuación iremos a esta pantalla…

 

 

Los plugins no solo habrá que instalarlos sino que también activarlos y es lo que vamos a hacer ahora

 

 

Y por último… configurarlo. Bueno esto depende, los habrá tan sencillos que solo al activarlos ya funcionen… otros más complejos necesitarán más… incluso tendras que buscar un manual para guiarte. Hay distintas opciones para entrar en la configuración.

En la imagen tienes las dos más usuales, pero también te podrás encontrar que hay un nuevo item en el menú principal de la izquierda, se irán añadiendo debajo de ajustes normalmente.

 

 

A continuación tendremos por delante la pantalla principal de configuración del plugin

 

 

Con lo que vamos a hacer tendremos programas las copias. Puedes seguir curioseando pero con esto es suficiente. La primera parte la tienes en esta imagen

 

 

Seguimos con la segunda parte de los ajustes, déjalo tal cual está en la imagen

 

Spam: Akismet

Desde sus comienzos WordPress ha sido una pieza codiciada para el spam. La “puerta” de los comentarios siempre pusieron las cosas fáciles en ese sentido.

A estas altura de la película te habrás dado cuenta ya que tu instalación viene de fabrica con un plugin instalado, mejor dicho dos. Uno, Hello Dolly lo puedes borrar del tirón. Y dos Akismet, muy recomendable para evitar el spam.

Puede que tu instalación, dependiendo de donde tengas alojado en hosting traiga más, pero estos son lo normal. Así que directamente pasamos a activarlo, ya que está instalado

 

Haciendo clic en actualizar, esperamos…

Ahora si, hacemos clic en activar…

Ahora necesitamos una clave para terminar la activación del plugin. Vamos a conseguir una clave Akismet y terminamos de protegernos contra el spam. Hacemos clic en el botón azul…

Clicamos de nuevo en el botón azul (en caso que sea la primera vez que usas akismet)

Lo dejaremos como muestra la imagen

   

ahora si activamos   

y seremos redirigidos a nuestra web, guardamos y ya estamos seguros en cuanto a spam se refiere… y gratis.

 

Seguridad: IThemes Security

Seguimos con la seguridad. Un aspecto muy importante, ya que el aumento de webs y blogs con wordpress aumenta día a día, encontrar vulnerabilidades es un medio de asegurarse métodos para entrar en cantidad de webs.

Tenemos varias opciones, tanto de pago como gratis. Yo uso IThemes Security y por tanto esa es mi recomendación, aunque también os podría valer All in one wp security o Wordfence Security, ambas son opciones estupendas.

El procedimiento es el mismo: Plugins, añadir nuevo buscamos en el casillero instalamos y activamos… y llegaremos a la siguiente pantalla

Tendrás delante una pantalla como esta. No voy a entrara en detalle en todas las opciones. Te recomiendo que te descargues el manual (lo tienes a la derecha en la imagen) y vayas configurando según tus preferencias.

Existen millones de plugins, hay uno para casi cada cosa que se nos ocurra. Se habla mucho del número recomendable de plugins instalados ya que un gran número de estos sobrecargará la web en exceso y todos sabemos lo importante que es el tema de la velocidad de carga.

Para cuestiones estéticas, la verdad es que instalando Divi nos ahorraremos muchos: sliders, formularios… etc

También habrá que tener en cuenta cual es nuestro negocio. Si lo que queremos es montar una tienda online tendremos que instala woocommerce.

Si somos una casita rural y queremos tener un motor de reservas hay varios medios de hacerlo pero también podríamos hacerlo con woocommerce y la extensión para reservas. En el caso que queramos una escuela online o vender cursos nos vendrían bien instalar un plugin que actuara de LMS (Learning Management System)

Como ves… casi infinitas las posibilidades. Pero sea cual sea el caso gestionar nuestras oportunidades de venta será imprescindible y para eso uso dos plugins que los vemos a continuación.

Thrive Leads

Si tienes que hacer crecer una lista de suscriptores, este plugin para mi, también es imprescindible. Es más que un generador de formularios para la captura de leads, es todo un sistema completo, estadísticas incluidas.

Podrás poner formularios según categorías, en páginas determinadas, en el sidebar de los posts… y de todo tipo: scroll matt, popups, ribbon…etc Personalmente lo combino con…

Thrive Architect

…Antes Thrive Content Builder o TCB. En mi opinión junto con el Divi Builder el constructor visual más potente del mercado… además de intuitivo.

Con el puedes construir una web completa si quieres pero la mayoría de la gente para lo que los usa es para construir todos los elementos necesarios para embudos de venta: Página de captura o de Opt-in, página de gracias, página de descargas…

Incluso, si tu objetivo es vender un curso online, no muy complejo de estructura, podrías hacerlo ya que trae multitud de páginas predefinidas a las que tan solo tendrás que cambiar los textos de muestra por los tuyos… y a funcionar.

Echa un vistazo aquí.

DÍA #2

Diseña cualquier página, págin de aterrizaje, página de producto…

sustituye imágenes y textos por los tuyos

Plantilla Wireframe

Instalación del theme: Divi Theme #5

Desde que salió al mercado no uso otro. Entonces ¿todas las webs que haces son iguales? En absoluto, es tan flexible y versátil que puedes hacer infinidad de webs con esta plantilla y todas serán distintas (si así lo quieres, claro). Habrás visto que en muchas webs, te recomiendan temas en función del sector de actividad, bien pues con Divi las tienes cubiertas casi todas (por no decir todas que queda mal). Echa un vistazo aquí y verás varias webs de varios sectores y todas con Divi. Como te comentaba antes, Divi Theme viene con Divi Builder el plugin que dota a tu instalación de un potente constructor visual lo que hace que puedas hacer tu propia web casi, casi sin ningún conocimiento técnico y que… si te apetece con posterioridad… puedes mejorar, podríamos decir que… jugando. Fíjate bien como funciona esta maravilla, haz clic aquí. En el capítulo plantilla o themes, como prefieras, dos últimas consideraciones:

  1. Existen millones de plantilla gratuitas, puedes verlas desde tu propia instalación en el menú Apariencia –> añadir tema nuevo
  2. Por mi experiencia… NO recomiendo plugins ni plantillas de Theme Forest.

Estos funcionan como un supermercado donde los autores venden sus creaciones. El problema viene cuando retiran el producto, lo hacen sin previo aviso y te quedas sin soporte con lo que es imposible que puedas actualizarlos y con el tiempo comiencen a dar incompatibilidades con otros componentes o la plataforma wordpress. Vamos con el paso a paso para instalar Divi (aunque vale para cualquier theme). Ve a Elegantthemes y compra una licencia. Te recomiendo que hagas un esfuerzo y compres la Lifetime, aparte de ahorrar una importante cantidad de pasta, tendrás accesoa tooodos las plantilla y los plugins, así como al diseño en PSD. Una vez “dentro” descarga en tu equipo el archivo del theme Haz clic en Apariencia >> Temas Clica en añadir nuevo… y ahora en subir nuevo navega hasta la carpeta de tu equipo donde hayas descargado Divi (Downloads, descargas, escritorio…) seleccionalo y clica en abrir… ¿lo tienes? .. haz clic en instalar ahora, tomará un par de minutos y tendrás esto haz clic en activar… Asegurate que tienes Divi activo (como en la imagen) y, como prefieras… borra todos los demás. WordPress permite que instales tantos themes como quieras. De esta forma puedes probar distintas plantillas, pero activos SOLO PUEDES TENER UNO DE ELLOS. Ahora, si vas a tu sitio verás el aspecto que tomando tu nueva web pero ya con Divi instalado… será más o menos esto… ¿deprimido? No te preocupes. Iremos más adelante a arreglar esto. Ahora tenemos otras tareas por delante Seguimos…

Optimizando tu instalación: Analytics y Search Control #6

Pueden que ni te suenen, pero ya habrá tiempo que busques más info y aprendas. El caso es que aunque no tengas intención de trabajar mucho el SEO de tu web, ten vendrá bien saber al menos de donde procede el tráfico a tu web (sobre todo si pagas por él). También es necesario que vincules tu sitio a Google Search Control (antes Webmastertools de Google). No son totalmente imprescindibles ahora, pero conviene hacerlo. Hará falta que tengas una cuenta de gmail y con ella accedes o creas una de analytics. Una vez logados añdimos la cuenta de nuestra nueva página y rellenamos los datos para crear la cuenta. Una vez tengamos el código de seguimiento lo seleccionamos y copiamos para a continuación pegarlo en la opción de Divi para ello Ya estamos casi, vamos a terminar de configurar Deja todo como en la imagena continuación… y muy importante, ANTES DE GUARDAR… haz clic en ajustes de Search Control A continuación clica en añadir y continua con añadir un sitio a search control Serás redirigido a Search Control (hasta ahora estabas aún en Analytics… y verás la siguinete pantalla, clica en el botón rojo     Bien, la verdad, y no te asustes es que hasta aquí podría haberlo hecho cualquiera y cuando digo cualquiera me refiero a que podías NO ser tu. Google tiene un sistema para verificar que es quien debe ser quien ejecuta todas estas acciones y para ello tenemos que verificar el sitio. Existen varios métodos, nosotros vamos a escoger la pestaña métodos alternaativos y vamos a elegir hacerlo mediante google analytics.      Esperamos unos segundos tras hacer clic en el botón rojo “verificar” nos debe aparecer la imagen de abajo… ¡¡Hemos terminado!!

¿Necesitamos un Child Theme? #7

Si no has tocado ninguno de los ficheros originales de Divi, realmente NO lo necesitas… pero es conveniente. Igualmente, si no tienes pensado de momento hacer ninguna modificación del CSS no hará falta tampoco, además con el espacio que Divi trae para ese propósito tenemos suficiente ya que NO lo borrará cuando actualicemos la plantilla.

En cualquier caso, tampo tiene complicación y evitamos problemas posteriores y… hablando de posteriores puedes hacerlo después, no necesitas que sea ahora mismo.

Un poco de luz

¿Que es un child theme o tema hijo? Son un conjunto de archivos que proceden del tema padre y con los que podremos hacer modificaciones sin el riesgo de perderlas posteriormente cuando realicemos las actualizaciones de la plantilla original ya que estos archivos se guardan en una carpeta diferente en tu instalación y por tanto cuando actualices el theme estos, el hijo, NO SE VERÄ AFECTADO y por tanto tus modificaciones se guardarán. No pretendo darte una master, por eso nno vamos a entrar en materia en profundidad. Como te contaba antes puedes hacerlo otro día, otro mes… o no hacerlo si no vas a tocar los archivos del theme original, pero de todas formas te cuento como puedes tener un tema hijo (yo lo recomiendo) Podrías hacerlo de forma manual, creando los archivos y picando el código (son apenas unas lineas) pero como comentaba, ni esto es una master ni es el propósito del post (hacerlo lo más fácil) así que te recomiendo un par de opciones y tu escoges con el que te encuentres más cómodo. Por una lado Orbisius. Me gusta porque una vez creas el child, puedes borrar el plugin y así descargamos la instalación de “peso” innecesario. Te dejo este video… ¡¡en dos minutos listo!! https://youtu.be/BZUVq6ZTv-o Por otro lado Luis Alejandre de Divi4you tiene uno con el que no solo podrás hacer tu tema hijo sino que además trae un montón de opciones… y si, GRATIS.

Como ves en la imagen padre e hijo viven juntos, NO borres Divi, ten en cuenta que el child theme, SOLO tiene los archivos que han sido modificados, el resto los aporta el padre.

Los 3 secretos que harán de tu web un sitio profesional diferente a los demás #8

Cuando ves un sitio realizado por si mismo hay cosas que chocan a la vista y no sabemos bien que son pero que no causan buen efecto. La mayoría de los sitios profesionales se rigen por el código de diseño y que cumple siempre estos tres principio.

Secreto #1: Paleta de Colores

Define que colores integrarán tu web. Sin profundizar demasiado, existe 6 colores básicos que tienes que definir, aunque la mayoría de la herramientas te darán solo 5:

  • Color Principal
  • Color Secundario
  • Sombra Clara
  • Sombra Oscura
  • Sombra Fondo Clara
  • Sombra Fondo Oscura

Pero no te preocupes, existen herramientas que te ayudarán, por ejemplo colourlovers.com o pictacolous.

Secreto #2: Anchos de Contenidos

Puedes seguir la regla de situar un ancho a 1.100px y otro a 960px. Este simple efecto dará a tu web un aspecto elegante y te permitirá integrar distintos elemntos en tu web según tus necesidades, tamaños para imágenes, etc.

Secreto #3: Fuentes

Lo normal es una única pero puedes jugar con dos principal y secundaría, aunque ya te digo que esta es opcional.

DÍA #3

Creando la Página de inicio #9

¿Recuerdas más arriba cuando instalamos Divi? dijímos que la web se veía más o menos asi:     Pues bien lo primero que debemos hacer es añadir una página y comenzar a configurarla. El caso es que cuando instalmos wordpress, verás como ya tienes una “página de ejemplo”, vamos a usarla para que sea nuestra página de inicio, la que se verá cuando alguien visite tudominio.com    

Primeros pasos

Esta será la pantalla de edición de página. Sigue las instrucciones en el orden que ves:

  1. Cambia el nombre: aquí puedes poner lo que quieras… Inicio, Home, Homepage, el nombre de tu negocio… lo que quieras
  2. Clica el botón editar, aquí pon lo mismo que el nombre que le hayas dado, con esto conseguira que la url (la dirección) sea igual que el nombre de la página
  3. Selecciona tooodo el texto y borralo, no nos sirve
  4. Haz clic en el botón morado para usar el constructor de Divi
  5. Clica ahhora el formato de la página, despliega y selecciona Fullwidth (todo el ancho de página)
  6. La página está publicada, es decir, la podría ver cualquiera, selecciona el estado Borrador, de esta forma solo se verá por quien este logado editando wordpress
  7. Por último, guarda o actualiza para guardar los cambios

Este será el aspecto que tendrá ahora Por experiencia se que ahora viene lo más complicado, organizar el contenido y darle un aspecto agradable para su consumo por el usuario, que refleje nuestra marca… quienes y qué somos. Pero también para eso contamos con ayuda de parte de esta plantilla, haz clic en cargar de la biblioteca y lo vemos. Tendrás delante de ti, una de las herramientas mas potentes, la biblioteca de Divi. No solo por el montón de plantillas predefinidas que cubren casí cualquier tipo de página que quieras crear sino también porqué puedes crear las tuyas propias para reusarlas con posterioridad. También es posible que escojas por ejemplo la plantilla Shop Basic y no quieras este o aquel módulo. Puedes quitarlo y añadir un módulo de cualquiera de las plantillas restantes… las posibilidades son casi infinitas Nosotros vamos a hacer lo siguiente: Vamos a construir una web de una sola página, reduciendo lo más posible el tener varias y una estructura complicada. Vamos a poner en marcha la web lo más pronto posible, después… podremos seguir ampliando y completando todo lo que quieras… así que al lío.

Configurando la página Inicio

Haz clic en cargar de la biblioteca y carga Página de Inicio de Empresa Fíjate en la imagen superior. No es nuestro caso pero quiero dejarlo claro. Mucha atención con la casilla que ves señalada. Si cargaramos la plantilla ahora sobreescribiríamos el contenido que ya hubiera. Repito no es nuestro caso porque estamos empezando de cero, pero mucha atención a esto. Para hacerlo más sencillo y que no tengas que cargarlas todas para ver cual es la que mejor te conviene, descarga este PDF donde están todas y puedas ver mejor todos los módulos que las componen, así elegir te será más fácil.

Fijando la Página de inicio y creando el menú #10

A continuación vamos ajustes >> lectura Seleccionaremos como página de inicio la que acabamos de crear, en mi caso también se llama inicio También es importante que realizemos otros ajuste ahora, el de los enlaces permanentes Ve a ajustes >> enlaces permanentes Una vez alli selecciona el que muestra la imagen y haz clic en guardar Si ahora vas al frontend y haces clic en el logo, arriba a la izquierda verás como tenemos delante la plantilla que acabamos de seleccionar… ahora la web es más o menos esto

Menú

te habrás fijado ya que en la parte superior izquierda hay un menú de navegación y que no corresponde muy bien ni con lo que tenemos ni con lo que queremos. Ve a apariencia >> menús tendremos esto en pantalla escribimos el nombre del menú, puedes poner wl que quieras, primario, principal… y clicamos en crear… ahora toca añadir los elementos Tendremos a la izquierda un cuadro como este Podríamos escoger cualquiera de los elementos… páginas, actegorías… cualquiera Hoy nos interesa enlaces personalizados. Vamos a dividir la que será nuestra web en 3 zonas De momento es tan solo una división imaginaria… no efectiva, pero vamos a seguir Volvemos a nuestro menú vamos a crear tres enlaces personalizados (uno por zona) Escribe la url añadiendo el nombre de la sección, nosotros, testimosnios, contacto; a la url de tu página web (mira la imagen) Ahora en texto del enlace pon lo que quieras que aparezca en el menú y por último haz clic en añadir al menú. Repite 3 veces, una por cada sección. Ahora localizamos en nuestra página el modulo correspondiente a las secciones (es fácil, tranquilo)     y a continuación          Repite esta operación con las otras dos secciones que vamos a configurar en la página. Te debe de quedar así       Y si ahora actualizamos nuestra página de inicio debe quedar así Cuando cliquemos en cualquiera de ellos se desplazará suavemente hasta la parte que corresponde.

Añadir contenido al blog: Posts #11

Al tener Divi instalado tenemos dos posibilidades de añadir posts, mediante el editor tradicional y por medio del constructor de Divi. En ambos casos necesitaremos:

  • Un titulo
  • Una imagen que represente el post
  • contenido

Verás al acceder a la edición de posts que es muy parecido a la edición de páginas, pero en el caso de los posts tenemos más posibilidades. La primera diferencia con respecto a las páginas es la posibilidad de categorizar y etiquetar. Es como si tus recibos de casa y docuemntos personales los ordenarás mediante carpetas y post-its. La diferencia con el “mundo real” es que un documento, un recibo, por ejemplo, físicamente solo puede estar en una carpeta. Con las tecnologías de la información, podríamos meter ese docuemnto en dos o más carpetas, dos o más categorías. Ahora es cuestión de estrategía y planificación como queremos que el usuario, y Google, encuentren nuestros contenidos. Por ejemplo, si tuviéramos un blog de cocina y decidimos que ordenaremos nuestros posts en carnes, pescados y postres, categorías, no tendría sentido que un mismo posts estuviera en dos a la vez. Pero por otro lado, si tuviéramos un blog de marketing por ejemplo, podríamos tener un post sobre Facebook en marketing online y socialmedia. Después tenemos las etiquetas. En este caso si que hay que pensar menos en la cantidad, serían palabras relativas, que nos recordarán el tema principal del post, de esta forma, un usuario podría navegar por tus posts buscando por etiquetas. Siguiendo con el ejemplo del blog de cocina, un post de la categoría pescados, si lo etiquetamos con besugo, un usuario podría ver todas las entradas de pescado o seleccionar la etiqueta y encontrar todas las recetas etiquetads con besugo.

Creando contenido de forma estandar: el editor tradicional

La pantalla de edición no te resultará especialmente extraña, ya que como ves, es practicamente un editor de textos como Word o Docs de Google pero con muchas menos posibilidades de edición. Hablando de Word y Docs, hay quien acostumbra a escribir en estos soportes y después copiar y pegar en Wordprees. Este sistema es WYSWYG (What you see, what you get) >> “lo que ves es lo que te llevas”. Quiere decir que lo que ves difiere poco de lo que realmente publicarás. En cualquier caso puedes previsualizar el post antes de publicar y rectificar cuantas veces quieras, incluso si lo has publicado.

Creando contenido de una forma distinta: constructor de Divi

Igual que cuando creamos la página, accede al editor de entradas y haz clic en el botón morado de Divi Ahora el editor nativo de wordpress desaparece y en su lugar tendremos esto Ahora tienes un módulo de texto pero podrías usar cualquiera de los disponibles: imágenes, sliders, videos… y no solo eso, tambien podrías gestionar todo tipo de combinación de columnas

La decisión

Ahora es cuando toca decidir cual será el tipo de publicaciones de tu blog. Conviene que veamos algunos pros y contras: Editor WordPress Puedes jugar con la opción Formato de Posts, lo que te permitirá también hacer el juego de prestación de parrilla de posts muy original (caso que vayas a editar posts de distintas clases: videos, podcasts, textos) Confianza. Al parecerse a cualquier editor de texto que conocemos nos encontramos en un medio más habitual No hay pasos extra. Una vez escrito y corregido podemos publicar, solo etiquetar y categorizar Editor DIVI No hay opciones de Formato de Posts Puedes tener una o varias plantillas de posts, guardalas en la biblioteca y usarlas según te convengan Ganas en impacto visual a cambio de algunos pasos extra

usando el constructor en los posts #12

Lo mejor que puedes hacer… es dibujar como quieres que sean tus post. Si con papel y lapiz… como siempre Después podemos extrapolar ese diseño al constructo, lo grabamos y podemos usarlo tantas veces como queramos. he diseñado este para que veas que potencia tiene y el impacto visual que produce (es cierto que llva mas curro… pero quien algo quiere algo le cuesta) 🙂 Si te gusta puedes descargarlo (luego veremos como usarlo)

Grabando y reutilizando una pantilla

Lo genial de Divi es que todas estas plantillas las puedes grabar en su biblioteca para usarlas posteriormente… y lo mejor… puedes usarlas incluso en otros proyectos porque puedes exportarlas e importarlas (lo veremos más adelante) Esta es la plantilla que acabamos de hacer para este post Una vez este a nuestro gusto (la podemos retocar después sin problema) podemos grabarla en la biblioteca     Haz clic en guardar en biblioteca y a continuación dale nombre y guarda. Te devolverá a la edición del post, pero tranquilo que estará guardado       A continuación añadiremos una plantilla En el menú de la izquierda Entradas >> Añadir nueva Habilitamos usar el constructor y cargamos de la biblioteca     Clicamos el botón azul cargar y ya tendremos cargada la plantilla para reutilizarla y podremos hacerlo sin limite, tantas veces como se quiera, pero, … ¿y si quisieras usarlo en otra web, tuya o de un cliente? Vamos a verlo

Exportar una plantilla

Desde el escritorio, accedemos a Divi >> Biblioteca Y accedemos a la siguiente pantalla Seleccionamos la plantilla (en este caso solo tenemos una) y a continuación en importar exportar     Por último hacer clic en el botón inferior azul y ya tendremos en nuestro equipo el fichero de la plantilla

Importar una plantilla

Para importar, iremos tambien a Entradas >> Añadir una nueva y haremos clic en un pequeño icono arriba a la derecha con dos flechas A continuación , haz clic en el botón o arrastra el archivo que quieres importar Ahora verás como en tu nueva entrada tienes cargados todos los módulos. Por último cambia lo que necesites ya que la importación lo actualiza todo, contenidos incluidos

DÍA #4

Sidebars y widgets #13

He creado una página nueva y la he llamado blog     Este es el aspecto que presenta ahora, verás que he señalado un recuadro a la derecha, es la barra lateral, vamos a verla, como se configura y ponemos el contenido en ella. Vamos a Apariencia >> Widgets        A la izquierda, tienes los distintos widgets disponibles. Estos son los que trae una instalación de wordpress típicas, aunque puede haver muchos más. En ocasiones hay plugins que al instalrlos, añaden widgets para poder usarlos en los sidebars, como por ejemplo, plugins para gestion de redes sociales o formularios. A la derecha, lo primero que vemos es las distintas áreas donde estos widgets van a parecer. Por un lado tenemos la barra lateral y 4 áreas para el pié de página… y algo que no todos los themes tienen: puedes crear tantas como quieras y luego ponerlas donde quieras usando para ello el módulo de barras laterales del constructor. Por otro lado cada widget tienen su propia configuración que salvo en un par de casos concretos es super-simple.

Configurando la barra lateral

Como ves en la imagen es como viene por defecto una vez instalas wordpress. La barra lateral ha sido una característica de los blogs desde sus comienzos, y en muchos casos se ha usado para publicidad y spam. Quizás por eso como que nuestros ojos se han hecho “inmunes” y apenas si llama la atención lo que aperece en ella, esto puede ser una causa de porque ahora los bloggers se inclinan por no usarlas y hacen los posts a pantalla completa (como este que estás leyendo por ejemplo). En cualquier caso, vamos a configurar una que resulte útil para el usuario. Pondremos, un casillero para buscar, más posts realcionados con este que leen para aunmentar el número de páginas vista, las categorías y una nube de etiquetas. Como ves todo pensando en el usuario y que este pueda encontrar más info de su interés. Podríamos poner también, y esto lo hacen la inmesa mayoria de bloggers, un formulario de suscripción para que les envíemos por email los posts que vayamos publicando. Por partes. Dejar la barra vacía Como te he dicho viene ya con algunos widgets, vamos a quitarlos, fíjate en la imágen.     Lo desplegamos haciendo clic en el triangulo invertido de la parte derecha del widget y hacemos clic en borrar. Esto lo repetimos con Archivos y Meta. A continuación vamos a la parte izquierda y buscamos entre los disponibles “Nube de Etiquetas” (están por orden alfabético)       Podríamos elegir en el área que lo queremos, bastaría con clicar en ella, pero lo vamos a dejar tal cual y clic en añadir widget. Ahora tenemos la barra lateral con los widgets que necesitamos/queremos, quedaría ordenarla, y eso se hace clicando y sin soltar arrastar hasta el lugar que quieres el widget. Yo por ejemplo, la nuebe de etiquetas la quiero por encima de categorías, arrastro y suelto en su lugar y la barra quedaría de esta forma:     De igual forma que el editor tradicional de wordpress, esto también es WYSWYG, osea, que tal cual lo tienes, tal cual se verá, como puedes comprobar   Están en el mismo orden que hemos dejado la sidebar.

Añadir un widget nuevo

Antes de continuar. En alguna ocasión me han preguntado en un curso ¿los widgets se acaban? es decir, si usamos el de nueb de etiquetas, ¿podremos usarlo en otra sidebar otro de nube de etiquetas? Por supuesto que si, tantas veces como quieras, no, no se acaban. Dicho esto, echa un vistazo. Verás que no hay ninguno sobre instagram… ¿y si quisieramos poner nuestro instagram en la barra lateral? ¿Donde hay más widgets? Imagina que quieres que en la barra lateral aparezcan los iconos de tus redes sociales para aumentar tus seguidores. Esta opción, ni viene por defecto con wordpress ni hay ningún widget para ello Tendremos que instalar un plugin. Vamos a Plugins >> Añadir nuevo >> Subir (lo debes de haber descargado de ElegatThemes previamente y estará por tanto en tu equipo) lo instlamos y lo activamos. Sigue las instrucciones para configurarlo (prácticamente te guía en el proceso) y una vez esté si volvemos a Apariencia >> Widgets verás esto…     Instalando el plugin hace que aparezca este nuevo widget que podrás llevar a tu barra del mismo modo que hicimos antes.

Creando una nueva Sidebar

Antes de nada una advertencia. Verás que si estas en widgets, el tecto que pone es “crear un nuevo widget” y esto es algo confuso. No se crean widgets aquí, se crean nuevas barras para poder persnalizar y usar donde nos convenga. Aclarado esto, lo único que hay que hacer es darle un nombre, por ejemplo, “barra personalizada”, clic en crear y actualizamos la página, tendremos esto Al igual que cualquier otra podemos incluir en ella los widgets que nos convengan. Para usarla, lo único que tenemos que hacer es incluir en el diseño el módulo barra lateral     Y en su confuguración, elegir la que necesitamos       

Una página de blog que mola #14

Esta es la página original de Divi en la que se muestran las entradas No es que sea muy molona… pero tiene arreglo Vamos con ello Como siempre, lo primero, hacer clic en usar el constructor de divi, usaremos ancho de página completo… Esta será la pagina que usaremos para el blog     Empezamos incluyendo la imagen superior y el título            Es sencillo, lo único a tener en cuenta es el módulo Post Destacado que tendremos que poner que solo muestre uno          A continuación el módulo con los tres últimos posts (en realidad 2º, 3º y 4º) y resto de posts (a partir del 5º incluido)       Ahora vamos a hacer que cada módulo muestro los post sin que repitan los ya mostrados. Para eso usaremos la siguiente opción     En la imagen el módulo resto de posts de la izquierda compensado con uno. Lo siguientes habremos de compensarlos con 2 y con 3. Esto hará que evite repetir el 2º y el 3º respectivamente Así tendremos este resultado       Si te gusta te la puedes llevar, haz clic en la imagen y descargala

tuneando el footer (pié de página) #15

Como ya hemos visto los widgets y como funcionan, estamos en disposición de personalizar el pié de página. Estos funcionan algo distinto ya que los vamos a trabajar por medio del personalizador Ahora hacemos clic en Pié y a continuación en Diseño     ahora elegimos el diseño que más se adecue a nuestro gusto Yo voy a escoger este para poner después un formulario en el espacio más ancho (lo veremos después cuando integremos Bloom, un plugin para crear listas de suscriptores) En los otros dos espacios podríamos poner un menú personalizado por categorías, para facilitar la lectura del blog… y en el segundo de los espacios más pequeños los datos de contacto. Por último el fondo, el que creas mejor para tu imagen corporativa. Ten en cuenta que también personalizaremos el espacio inferior bajo el pié. Una buena idea es usar el mismo tono pero un poco más oscuro para esta última zona. Volvemos hacia atrás y seleccionamos Widgets. Como hemos seleccionado un diseño con tres huecos solo será necesario usar estas zonas     La primera, más ancha, la dejamos para más adelante. En la del centro pondremos un menú personalizado solo con categorías que deberemos de tener creado previamente (recuerda que lo hicimos más arriba) Clicamos en Área de pié #2 y añadir widget y bajamos hasta seleccionar Menú Personalizado      Añadimos el widget y guaradr y publicar Como ves ya aparecen en la parte inferior las categorías, más tarde seguiremos personalizandolas. Vamos con la seguna zona de widgets (en nuestro caso 3ª zona), allí pondremos nuestros datos de contacto. Usaremos un widget de texto     Escribimos tal cual nuestros datos y guara y publicar            Ya te habrás fijado como quedan pegados a la izquierda, esto es porque el área #1, la más ancha, la hemos reservado para poner un formulario de suscripción y al quedar vacía, se ajustan al margen izquierdo. En cuanto pongamos el área #1 se solucionará esto. Dejamos de momento la personalización del pié aquí y volvemos cuando hayamos instalado y configurado Bloom (formualrio de suscripción). La barra inferior también la dejaremos para más adelante, antes instalaremos otro plugin y usaremos esta zona para colocar los enlaces de privacidad y cookies.

más potencia a wordpress: bloom, formularios de suscripción #16

Tanto bloggers profesionales como empresas y emprendedores coinciden en una cosa: “Hubiera empezado a construir mi lista de suscriptores desde el día uno” Hoy en día el bien más preciado en internet es la atención del usuario, pero no hay atención sin usuario. Esto que te puede parecer una perogrullada no quiere decir ni más ni menos que sin tráfico no hay nada. Pero debemos tener un plan trazado “para después” para una vez que el usuario llegue a nuestra web. ¿Porqué es tan importante tener una lista, una buena base de datos de usuarios? Por que ese tráfico será gratis. Tanto el posicionamiento como la publicidad son de pago. En el primer caso pagamos tiempo y recursos y en el segundo pagaremos con pasta. Pero a nuestros suscriptores tan solo tenemos que enviarles un email, el táfico es totañmente nuestro… y a coste prácticamente cero. ¿Como comenzar a construir nuestra lista? Materiales necesarios Debemos tener 2 elementos básicos:

  • Un plugina para la captura de los datos y…
  • un proveedor de emailmarketing

Para lo primero usaremos Bloom, un plugin también de ElegantThemes lo que garantiza una compatibilidad del 100% con Divi. Y para lo segundo tenemos en el mercado infinidad, cada uno con sus cosas buenas y sus cosas malas. Personalmente uso ActiveCampign, pero para este manual usaremos Mailchimp por tener la parte gratuita más amplia (hasta 2.000 suscriptores y 12.000 emails/mes)

Crear una cuenta en Mailchimp

Empezaremos por aquí ya que nos hará falta alguna cosa para poder configurar posteriormente Bloom, así que allá vamos. Accedemos a la web de Mailchimp     Completa el alta rellenando el formulario        Haz clic en Listas y crea una       Completa el formulario para creación de listas y vuelve al dashboard. A continuación, haz clic en tu usuario y seguido en account.          Ahora ve a Extras >> Api Keys     Haz clic en Create api key Ahora selecciona y copia la api (lo que ves sombreado) y guardala para después (nos hará falta para configurar Bloom)         

Instalando, activando y configurando Bloom

De nuevo tenemos que descargar el plugin Bloom desde la web de ElegentThemes de la misma forma que descargamos el theme. Lo instalaremos de la misma forma que ya hicimos… en Plugins >> Añadir Nuevo… y ahora en subir lo seleccionamos desde el directorio que lo hayamos descargado, subimos y a continuación activar. Ahora aparecerá un nuevo item en el memnú principal de la izquierda de tu pantalla     Y hacemos clic en Optim Forms y en nuevo optin; y ahora escogemos el tipo Nosotros escogeremos widget ya que lo que queremos es que aparezca en una zona de widgets del pié de página            Seguimos, dale un nombre, selecciona tu proveedor (MailChimp) tu nombre de usuario y la cave api (la que guardamos antes)           Clicamos en siguiente y pasamos al diseño del formulario   Escoge el que quieras y… abajo del todo, clic en siguiente             Esta es la configuración que le he dado, yu puedes cambiar lo que prefieras            Finalmente haz clic en el icono y previsualiza como ha quedado     Seguimos en Apariencia >> Widgets Clica Bloom y arrastra has Área pié #1        Configura así y…     ¿Genial? pero aún podemos mejorarlo… ve ahora a personalizador y juega con las opciones hasta dejarlo como te gusta       

DÍA #5

Barra inferior del pié de página #17

Esta zona es ideal para inserta la información legal: Aviso de Cookies, Política de Cookies… etc Antes de nada vamosa instalar un plugin llamad Asesor de Cookies (ya sabes el camino, no me hagas explicarlo de nuevo) Recuerda instalar y activar Vamos a Herramientas >> Asesor de cookies Y configuramos     Déjalo como en la imágen, y muy importante, haz clic en generar páginas y por último graba El plugin, como acabas de ver generará dos páginas, una de más info sobre cookies y otra de política de cookies, copia sus url’s, nos harán falta ahora. Vamos de nuevo al personalizador y déjalo a tu gusto En la parte inferior hay una caja (resaltada en la imagen)          Aquí pega directamente lo siguiente:

Información Cookies | Política Cookies

Quedará así:        Ya va tomando forma Solo queda ir a Divi >> Opciones del Tema y configuramos las redes sociales que tengamos, las que no, las descativamos        y este será el resultado final     

Insertar un botón llamada en 1 clic para móvil #18

La mayoría del tráfico que llegará a vuestras páginas será a traves de móvil, esto ya no es noticia… pero la gente aún se olvida. Lo que el usuario tiene en la mano es un teléfono, aún así, si quiere contactar en la mayoría de los casos lo envíamos a un formulario… y a veces condemasiados campos a rellenar. ¿No sería buena idea que pudiera hacer una llamada tan solo con hacer clic en un botón? Un botón con un color llamativo, texto bien legible y que pueda clicarse tan solo con una mano, ya sabes, de esos que no hay que apuntar, sobrevolarlo y hacer clic. Vamos a insertar uno de estos. Un botón situado casí en el pié, por debajo del formulario, pero… que solo se vea cuando el usuario se conecte desde móvil. Vamos En primer lugar vamos a insertar una nueva sección normal, tamaño una sola columna y seleccionamos el módulo botón. Abrimos el módulo y lo configuramos. Comenzamos por a pestaña contenidos y esta la dejamos tal como se ve en la imágen. Seguimos con la pestaña Diseño, esta la dejamos como se ve a continuación Por último vamos a la pestaña Avanzado y la dejamos todo tal cual excepto lo que muestra la imagen y ya por último Guardar y Salir. Con este último paso como ves, desactivamos el módulo para Tablets y equipos de escritorio.

Llevar tu web a otro nivel:

plantilla de estructura #19

Vamos a avanzar un poco más. Tanto para ti si eres un profesional independiente, pymes, start up… o bien, estás pensando en ganarte la vida con el diseño de páginas web, esta herramienta te va a simplificar mucho, pero mucho, el diseño de una página web. Se trata de una plantilla, multipropósito, ya que la puedes aplicar para: diseño de páginas web de producto de empresas comercio electrónico páginas de aterrizaje… y además, para cualquier sector de actividad… como ves una auténtica joya. Practicamente, lo único que tendrías que hacer sería sustituir los textos e imágenes que ya trae por los tuyos, ocultar aquellas secciones que no te hagan falta y duplicar y tunear aquellas que necesites.     Comenzar a trabajar con esta plantilla es tán fácil como ir a Divi >> Biblioteca de Divi y seleccionar importar. Seleccionamos entonces el archivo zip que te puedes descargar más abajo e importarlo. A continuación crea una página nueva, selecciona el constructor de Divi y Añadir desde biblioteca, eso será todo. Y como te comentaba un poco más arriba, ahora solo queda sustituir textos e imagenes por los que necesites y listo.

Guía de imágenes #20

Sin duda hoy en día las imágenes osn una parte muy importante a la hora de diseñar una página web. En ocasiones es dificil acertar con el tamaño adecuado de las mismas con respecto a la columna donde van a ser insertada. Con el objeto de hacer más fácil esta tarea te dejo estás guías. Son propias de ElegantThemes con lo que tienes garantía de ser acertadas, ya que están hechas por sus propios diseñadores. Los formatos que mejor van son JPG, PNG y GIF, este va genial ya que tienen la posibilidad de animaciones (como si fueran pequeños videos) Los tamaños que vas a ver a continuación están pensados para un ancho de página de 1080 px y separación de columna de 3.          

Pasos siguientes…

Espera que hayas disfrutado de esta guía… y que te haya despejado una duda o dos de las que tuvieras Ese era mi objetivo al escribirla… y antes de despedirnos, deja que te pregunte algo ¿Tienes ya una página web para ti o tu negocio? Si es así ¿Está optimizada para laventa y te proporciona contactos comerciales? ¿cada día? Tómate un minuto y piénsalo ¿Sientes que podrías darle un empujon a tu negocio…? Entonces debes estar muy atento los próximos días a tu buzón de correo Te voy a envíar un minicurso en video que ter,minará de resolver esas duas que aún te persiguen… Estoy completamente seguro que te va a encantar… Pero necesito saber que te vas a poner en serio que no vas a leer la guía y  ver los videos y ya Ponte a ello… ¡AHORA! Seguimos… es hora de ponerse en marcha

Share This