La mayoría de los proyectos que realizo generalmente son autoadministrables, esto quiere decir que mis clientes pueden subir, cambiar o modificar cualquier parte de su pagina web.

Asi que aquí dejo algunos temas explicados e  incluso con algunos vídeos tutoriales que le harán mas facil esta tarea.

  Temas Generales

 

Paso 1.- Teclear en la ventana del nevegador el dominio de su pagina seguido del siguiente texto /wp-admin 

Ejemplo: www.mi-sitio-web/wp-admin

Paso 2.- Aparecerá la siguiente imagen, y procederemos a teclear el usuario y password que se les proporciono.

Paso 3.- Listo! veran una ventana como esta, a la cual le llamaremos escritorio.


En ocasiones vamos a tener que echar mano del codigo html para editar texto. Los códigos html son el lenguaje universal que se utiliza para programar y elaborar sitios web.

Este codigo para que se pueda leer, siempre debe tener una etiqueta de inicio y una de cierre.

Cada etiqueta va encerrada entre los signos de < (menor que) y > (mayor que)… la etiqueta de cierre se acompaña ademas de un / (slach)

Por ejemplo, si queremos hacer negrita una palabra seria asi:

Palabra de ejemplo a resaltar


Esto se vería así :   Palabra de ejemplo a resaltar

Así que aquí les dejo una lista de las etiquetas básicas mas usadas para la edición de texto.

HTML de Formato

            Negritas

          Negritas pero ademas que es importante

              Letra Italica

HTML Links 


Empezaremos por definir que es el Blog. El blog es una serie de publicaciones, cada una de estas publicaciones se le llaman entradas, artículos o post.

Cada entrada esta compuesta principalmente de:

  • Titulo
  • Contenido,
  • Imagen destacada
  • Categoría a la  que pertenece
  • Etiquetas.

Asi que sin mas preámbulos, les dejo un vídeo de como dar de alta una entrada al Blog.

En ocasiones necesitamos de copiar una entrada y solo cambiar ciertos elementos de la entrada, esto con el objetivo de ahorrarnos tiempo. Por ejemplo: en una pagina de una agencia de viaje, utilizamos el blog para publicar los paquetes de viajes que ellos promocionan, así que cada entrada, en el titulo se describe el nombre del paquete, y en la descripción, se ponen todos los datos adicionales como: la salida, horario, costo, lo que incluye el paquete y al final aparecen los botones para realizar la llamada y comunicarse a la oficina para hacer las reservaciones, también aparecen los términos y condiciones del viaje. Estos dos últimos puntos en cada entrada es lo mismo, entonces para ahorrarnos tiempo y no equivocarnos, ya que se maneja codigo html, es preferible clonar la entrada que hacer una nueva. Asi que lo que hay que hacer es: estando en el escritorio seleccionar en el menu izquierdo ENTRADAS y luego posicionaremos el cursor en la entrada a clonar y aparecerá unas opciones y seleccionaremos clonar Aparecera una nueva entrada igualita pero con la palabra borrador a un lado, como se muestra en la siguiente imagen Lo siguiente es entrar a editarla, cambiar todo excepto lo que se desea conservar, en este caso los botones de llamada directa y los terminos y condiciones.


Paso 1: Entrar a youtube y seleccionar el video a enlasar.

Paso 2: Darle click derecho al video y seleccionar copiar codigo de insercion.

Paso 3: Ir a la entrada donde se colocara el video y pegar lo que se copio anteriormente en la pestaña de html.

Paso 4:  Una vez pegado el codigo cambiaremos el elemento width por 100%

Ejemplo…. si dice width=”640″

debe quedar width=”100%”


Aveces se requiere hacer enlaces a otras paginas o otras secciones.

 Tienda

 

PASO 1: Para entrar a dar de alta los productos, seleccionar la opción Productos que se encuentra en el menu de la barra lateral izquierda del escritorio, se desplegara un submenu donde eligiremos la opcion Agregar nuevo. Posteriormente entraremos directamente a la pantalla donde capturaremos todos los datos del nuevo producto.

PASO 4: A continuación les dejo un vídeo tutorial que nos mostrara como dar de alta un producto simple.

PASO 5: Por ultimo, una vez agregado el primer producto, para agregar otro, existen dos opciones: haciendo click en donde dice Agregar Nuevo en la parte superior de la pantalla,  o donde dice Agregar Nuevo en el menú izquierdo del escritorio, como se muestra en la siguiente pantalla.

 

Un producto variable es aquel que maneja varios colores o tamaños y dependiendo de esto muchas veces también varia su precio.

A continuación les dejo un vídeo que explica como daremos de alta este tipo de producto.

 Editor de Contenido

Para el diseño de las paginas me valgo de una herramienta (plugin) denominado Elementor, el cual toma su nombre por que es un conjunto de elementos que se manipulan por separado.

En este fragmento de página de un de mis clientes te muestro los diferentes elementos que contiene:

Ahora, para editar la pagina hay que seleccionar la, pero para no batallar en buscar cual es la página, les voy a enseñar un truquito.   Estando en el escritorio, nos vamos a la esquina superior izquierda en donde aparece el nombre del sitio y al posicionarnos en el aparecerá una opción que dice  Visitar el Sitio, le damos click en esa opción.

Ahora nos aparecerá nuestro sitio web,  la única diferencia es que nos aparece un menú adicional horizontal en la parte de arriba de color negro con letras blancas.

Vista de cerquitas se verá asi

 

 

Entonces le damos click a Editar con Elementor y pasaremos a ver la página a editar con una barra lateral izquierda adicional.

Ahora, para editar un elemento solo hay colocarse encima del y seleccionarlo dándole un click y ese momento en nuestra barra lateral izquierda nos aparecerá las opciones a modificar a ese elemento.

Cada elemento generalmente contiene las tres mismas propiedades a modificar: Contenido, Estilo y Avanzado.

Observe que el elemento a modificar aparecerá en un recuadro de color azulito y en la barra lateral izquierda indica el nombre del elemento que se está seleccionado listo para modificar.

Entonces dependiendo del elemento aparecerán sus opciones.

El Editor Elementor contiene a la fecha mas de 35 elementos, aquí solo les mostrare algunos de ellos, de hecho cada elemento es muy intuitivo, solo es cuestión de experimentar a moverle y no tenerle miedo, total todo se puede ir deshaciendo con nuestro ya famosisimo Ctrl+Z.

Para continuar con este tutorial nos vamos auxiliar de un video que muestra los elementos básicos del Elementor y como editarlos, aunque lo ideal es vieran todo el video completo,  aquí les dejo su índice por si se quieren ahorrar tiempo.

Minuto        Elemento

00:30  Encabezados

04:34  Columnas

05:38  Imágenes

06:15  Editor de Texto

07:34  Video

08:28  Botones

11:18  Separadores

12:58  Cuadro de Imagen

 

 Correo Electrónico

Una vez que ya compramos nuestro dominio y nuestras cuentas de correo, toca como configurar nuestro correo para poder visualizarlo en nuestro celular.

Aqui nos vamos a valer de una pagina que nos llevara de la mano para realizar  esta tarea, por lo que teclearemos en nuestra barra del navegador la siguiente liga: www.emailwizard.co

A continuación nos aparecerán las siguientes pantallas, donde iremos siguiendo las flechitas rojas

Luego les aparecera una pantalla donde eligiran la imagen de su dispositovo, y listo…siguen las instrucciones que les marca. Suerte. 

Una vez que ya compramos nuestro dominio y nuestras cuentas de correo toca como configurar nuestro correo para poder visualizarlo.

Existen varios tipos de correo, aquí vamos a ver como configurar el  correo denominado Business Email, este tipo de correo es el que requiere de una aplicación de mensajería para poder visualizar los correos, la mas conocida de ellas es la denomina Outlook de Microsoft y esa es la que vamos a ver aquí.

Así que lo primero que tenemos que tener a la mano es que versión de Outlook tiene nuestra computadora.

El siguiente paso vamos abrir una pagina que nos llevara de la mano para realizar la configuración, por lo que teclearemos en nuestra barra del navegador la siguiente liga: www.emailwizard.co

A continuación nos aparecerán las siguientes pantallas, donde iremos siguiendo las flechitas rojas

En la siguiente pantalla seleccionaremos dependiendo la versión de outlook con la que contemos en nuestra computadora.

y a partir de aquí, seguiremos las instrucciones que nos da esta pagina. Suerte y animo, tu puedes!

NOTA:  Si tu versión de  outlook es  2013, sigue los pasos de outlook 2016.