Comienza Aquí tu Página en WordPress

Como Crear una Página Web en WordPress – Tutorial Paso a Paso

En este video tutorial veremos como crear una página web en WordPress, la principal aplicación de administración de contenidos o CMS utilizada para crear cualquier tipo de blog o página web. Aprenderemos desde como crear un plan de hosting, registrar dominio, instalar WordPress, plugins, y un tema para cambiar el diseño de la página web. La página web que vamos a crear es esta que podemos ver aquí.

Aprende con estos pasos como crear una página web en WordPress

Paso 1 Contar con un plan de hosting con cPanel

Paso 1 Contar con un plan de hosting con cPanel - tutorial como crear una pagina web en wordpress

WordPress funciona con una base de datos por lo que necesitamos un hosting que lo incluya, los planes de hosting de GoDaddy con cPanel funcionan muy bien para esto, son muy fáciles de manejar y sus servidores son rápidos, seguros y confiables.

Paso 2 Como Instalar WordPress desde cPanel

Paso 2 Como Instalar WordPress desde cPanel - tutorial como crear una pagina web en wordpress

Dentro del panel de administración de cPanel vamos a buscar la zona de aplicaciones y daremos clic en la que diga WordPress para iniciar la instalación. Le indicamos donde queremos que se instale la aplicación, en este caso seleccionaremos el sitio seguro https. También en esta parte de la instalación de WordPress debemos incluir un nombre de usuario y contraseña para el panel de administración, entre otras cosas.

Paso 2 Seleccionar el dominio seguro https - tutorial como crear una pagina web en wordpress

Paso 3 Ingresar al panel de administración de WordPress

Ahora ingresaremos a la zona de administración de WordPress con los datos que establecimos previamente y aquí es donde estaremos creando nuestra página web en WordPress, publicaciones, blog, menús, etc.

Paso 3 Ingresar al panel de administración de WordPress - tutorial como crear una pagina web en wordpress

Paso 4 Como añadir y subir un tema en WordPress

WordPress incluye por defecto un tema que podemos ver si visitamos el sitio, pero para este ejemplo vamos a utilizar el tema Typograph de themeforest.net , ya que tiene una imagen moderna y tiene algunas compatibilidades para el nuevo editor Gutenberg de WordPress este es un tema de paga pero existen miles de temas gratuitos que podemos consultar aquí.

Paso 4 Como añadir y subir un tema en WordPress para cambiar la apariencia - tutorial como crear una pagina web en wordpress

Paso 5 Como añadir plugins a WordPress

Paso 5 Como instalar o añadir plugins en WordPress - tutorial como crear una pagina web en wordpress

Ya que hemos añadido el archivo comprimido de nuestro tema de WordPress, vamos a ir a la zona de “install plugins” para instalar o añadir los que nos recomienda el desarrollador del tema para sacarle el mayor provecho.

Paso 6 Como crear páginas con el editor Gutenberg de WordPress

WordPress reciente mente ha realizado un cambio radical en su editor de contenidos, ahora el nuevo editor conocido como Gutenberg funciona a base de bloques como lo podemos ver en las siguientes imágenes.

Agregar un bloque de párrafo

Paso 6a Agregar un bloque de párrafo - texto en editor Gutenberg - tutorial como crear una pagina web en wordpress

Para agregar un nuevo bloque en el editor de WorPress basta con hacer clic en el símbolo de más, en este caso escribiremos texto, por lo tanto, incluiremos un bloque de párrafo.

Agregar un bloque de imagen

Paso 6b agregar un bloque de imagen con el editor Gutenberg - tutorial como crear una pagina web en wordpress

Para agregar una fotografía a nuestra página vamos a agregar un bloque de imagen como vemos a continuación, en la parte derecha podemos ver la configuración o ajustes del tipo de bloque en el que estamos trabajando.

Agregar un bloque de galería de imágenes

Paso 6c Agregar un bloque de galeria de imagenes con editor Gutenberg - tutorial como crear una pagina web en wordpress

También publicaremos un grupo de fotografías con el bloque de galería del editor Gutenberg de WordPress, como podemos apreciar en la barra o sidebar de la derecha podemos establecer cuantas columnas deseamos para presentar la galería fotográfica.

Agregar un bloque de columnas

Paso 6d Agregar un bloque de columnas en editor Gutenberg - tutorial como crear una pagina web en wordpress

Para presentar 3 productos utilizamos el bloque de columnas, así en cada una podemos incluir más bloques en este caso de encabezado para el nombre del producto, bloque de imagen y bloque de párrafo.

Agregar bloques de encabezado

Paso 6e Agregar bloques de encabezado en editor Gutenberg - tutorial como crear una pagina web en wordpress

Para resaltar los subtítulos de nuestra página web vamos a utilizar el bloque de encabezado, que viene representado con un T, aquí tenemos la opción de seleccionar desde el encabezado H2 hasta el H6 según la importancia.

Agregar imagen principal en el título de la página

Paso 6f Agregar imagen principal en el area del titulo - tutorial como crear una pagina web en wordpress

La imagen que vemos detrás del título la establecemos en las opciones que se han agregado con el tema que hemos puesto, es decir estas no vienen por defecto en la instalación de WordPress. Para establecer una imagen en el encabezado del título iremos a la parte de debajo “Page options” pestaña “header” ahí activaremos “Enable background image y seleccionamos la imagen que queramos.

Paso 7 Como crear categorías y entradas para blog en WordPress

Paso 7 Como crear categorias y entradas para hacer un blog en WordPress - tutorial como crear una pagina web en wordpress

Para crear un blog con WordPress utilizaremos el apartado de “Entradas” ahí primero crearemos las categorías de nuestro blog, y posteriormente iremos creando entradas en estas categorías. Funciona muy similar a la creación de páginas con WordPress, pero la diferencia es que el blog, lo presenta como un diario o revista, con fecha, autor, categoría, etc.

Paso 8 Editar opciones de diseño de nuestro tema de WordPress

Paso 8 Editar opciones de diseño del tema Typograph tema de WordPress - tutorial como crear una pagina web en wordpress

Como hemos instalado el tema Typograph de WordPress en el apartado de “Apariencia” nos han aparecido algunas opciones entre ellas la de “Theme Options” que es donde podemos modificar las opciones de configuración y apariencia del tema.

Modificar el layout de la página web

Paso 8a Modificar el layout de la pagina web - tutorial como crear una pagina web en wordpress

En “General options” podemos establecer los colores principales que deseamos utilizar, también la estructura o layout, entre otras cosas.

Subir logotipo de la página web

Paso 8b Subir logotipo en imagen png transparente - tutorial como crear una pagina web en wordpress

En “Header options” seleccionaremos la opción “Overlay style” que es la que nos permite utilizar de fondo una imagen en toda la parte de atrás de la parte superior de la página web. También vemos la pestaña de Logo, aquí podemos subir la imagen de nuestro logotipo, en este caso utilizamos un logo con fondo transparente en formato .png para que pueda lucir mejor con la imagen de fondo.

Opciones de menú para teléfonos celulares

Paso 8c opciones de menu para telefonos celulares - tutorial como crear una pagina web en wordpress

En la pestaña de “Mobile header” podemos configurar elementos de apariencia en la versión responsiva de la página web, es decir la que verán en los teléfonos celulares y otros dispositivos móviles, podemos elegir colores, un logo especial para teléfonos móviles, etc.

Paso 9 Como modificar el tipo de letra de WordPress desde la configuración del tema

Paso 9 Como modificar el tipo de letra de WordPress desde la configuracion del tema Typograph - tutorial como crear una pagina web en wordpress

En la parte de “Typography” podemos agregar un tipo de letra si así lo deseamos, podemos consultar los tipos de letra disponibles para nuestra página web en Google Fonts, la identificamos con el nombre y posteriormente la agregamos a nuestro sitio. Ahí también podemos establecerla en los diferentes formatos de texto que conforman nuestro sitio.

Paso 10 Como crear menús en WordPress

Paso 10 Como crear menus - tutorial como crear una pagina web en wordpress

En esta parte del proceso de cómo crear una página web en WordPress vamos a ver cómo crear menús, para esto, vamos al apartado de “Menú” y vamos a crear nuestro menú principal, primero lo creamos escribiendo el nombre para identificarlo, posteriormente le agregamos las opciones o los enlaces, en este caso serán enlaces a páginas y una categoría para que aparezca nuestro blog. También podemos poner en el menú enlaces personalizados y/o entradas individuales del blog.

Paso 11 Como incluir una forma de contacto en WordPress

Paso 11 Como incluir una forma de contacto con plugin contact form 7 - tutorial como crear una pagina web en wordpress

Vamos a crear una página con un formulario de contacto para que los visitantes puedan enviarnos un mensaje a un correo electrónico desde el sitio web. Para esto utilizaremos el plugin de WordPress Contact Form 7 que lo instalamos al principio. Este plugin nos permite de una forma muy simple crear formas o formularios con campos y publicarlas en una página o entrada, el plugin ya tiene una forma de contacto básica por default, por lo que solamente tenemos que copiar y pegar la línea de código del formulario en donde queremos que aparezca.

Paso 12 Copiar y pegar el código para banner de certificado de seguridad SSL de GoDaddy

Paso 12 Copiar y pegar el codigo para presentar el sello de seguridad del certificado SSL de GoDaddy - tutorial como crear una pagina web en wordpress

Vamos a poner un banner en la parte de abajo que nos proporciona GoDaddy el cual sirve para comunicar que nuestro sitio web es seguro ya que cuenta con un certificado de seguridad.

Para esto vamos a la administración del certificado de seguridad SSL en nuestro panel de GoDaddy y copiamos y pegamos el código HTML en donde queramos que aparezca, en este caso lo publicaremos en el área del “footer” o pie de página del tema que se llama “Copyright”.

Paso 12a crear widget para html personalizado - tutorial como crear una pagina web en wordpress

El desarrollador del tema ha puesto en los “Widgets” una pestaña en donde podemos controlar esta área, por lo que pondremos el código agregando el widget de “HTML personalizado” y abajo uno de “Texto” donde podremos incluir datos generales de la empresa.

Paso 13 Vista previa de nuestra página web en WordPress

Para ver como ha quedado nuestra página web en WordPress podemos dar clic en la parte superior izquierda en “Visitar sitio” o bien podemos consultar directamente nuestra dirección url en internet lamparassolaresgd.com.

Con esto hemos concluido el tutorial de como crear una página web en WordPress, como hemos visto es un poco más extenso que el tutorial de como crear una página web con el creador de sitios pero WordPress nos permite integrar y modificar muchas más cosas en nuestro sitio web. Cualquier duda la pueden dejar en los comentarios, les deseamos mucho éxito con su proyecto!

50% de Descuento en Hosting con cPanel


 

Facebookgoogle_plusyoutubevimeo

Empieza la Conversación