Tutorial: Crear Página Web De Noticias Con Wordpress En 30 Minutos [Actualizado Y Recomendado]

FGERETTO dijo:

¡Bienvenidos a mi TUTORIAL para Crear una PÁGINA WEB DE NOTICIAS con WordPress en 30 minutos!

¿Prefieres verlo en video? Tenemos un video para ti
¿Prefieres seguir el tutorial a través de la lectura de texto e imágenes? También tenemos el paso a paso escrito y detallado.

Aclaración: En este tutorial comenzamos desde un WordPress recientemente instalado.
Se recomienda tener conocimientos básicos en WordPress.

TUTORIAL EN FORMATO VIDEO 🎥💻



TUTORIAL EN FORMATO LECTURA DE TEXTO E IMAGENES 📝💻

Lo primero que vemos luego de instalar WordPress e ingresar al Panel de administración, es lo siguiente:

Ver el archivo adjunto 739351


CONFIGURACIONES BÁSICAS DE WORDPRESS

• Clic en "Descartar" para ocultar el cartel que dice Bienvenidos a WordPress.
• Hacemos Clic en "Opciones de Pantalla" ubicado arriba a la derecha y sacamos todas las tildes para dejar el Escritorio de WordPress totalmente limpio.
• Borramos todo el contenido que viene cargado previamente con WordPress, como lo pueden ser Entradas, Páginas, Comentarios o Widgets.
• Ingresamos a "Usuarios > Perfil", ubicado en la barra lateral izquierda. En Idioma elegimos "Español" y Guardamos.
• Ahora nos dirigimos a "Ajustes"
  • Ajustes Generales:
    • Título del sitio = Diario La Realidad Argentina
    • Descripción = El diario online de la Realidad Argentina y del Mundo
    • Zona horaria = Elijan la de su país
    • Formato de fecha y de hora = La que les parezca mejor
    • La semana comienza el lunes.
    • (GUARDAR CAMBIOS)
  • Ajustes de Enlaces Permanentes:
    • En "Ajustes Comunes" elegimos Estructura Personalizada. Borramos lo que viene por defecto y agregamos %category% y %postname%.
    • Luego, en "Opcional" escribimos como base de categorías la palabra categorias y en la base de etiquetas: etiquetas.
    • (GUARDAR CAMBIOS)
• Instalación del Tema = Lo haremos desde "Apariencias > Temas" y "Añadir Nuevo". Buscamos "NewsCard". Instalar y Activar.

Si visitamos el sitio luego de realizar correctamente estos pasos, veremos que ya cambio un poco el diseño:

Ver el archivo adjunto 739408

Esto se verá realmente increíble cuando finalicemos el tutorial.

COMENZANDO A ORGANIZAR Y CREAR CONTENIDO

1. Volvemos al Panel de Administrador de WordPress y nos dirigimos a "Entradas > Categorías".
2. Editamos la Categoría que viene creada por defecto como "Sin categoría" y le ponemos otro nombre, en mi caso "POLÍTICA" con el slug "politica".
3. Ingresamos a Categorías nuevamente y vamos agregando nuestras categorías una por una. Yo voy a agregar además de POLÍTICA, las categorías: ECONOMÍA, DEPORTES, TECNO, ESPECTÁCULOS, INTERNACIONALES.
4. Recordar poner el "slug" ya que es lo que aparece en el link o enlace de la página web.
5. El siguiente paso es cargar o subir NOTICIAS a estas CATEGORÍAS para poder comenzar el sitio web con algo de contenido y forma.
6. A cada NOTICIA la subimos desde "Entrada > Añadir Nueva", escribiendo la noticia con imagen destacada y seleccionando la categoría que le corresponde.

Para este tutorial, voy a subir 4 (cuatro) noticias distintas para cada categoría creada, teniendo un total de 24 noticias.

Ver el archivo adjunto 739423

Ver el archivo adjunto 739425

PERSONALIZAR LA APARIENCIA DEL SITIO WEB

Si visitamos el sitio web una vez que cargamos el contenido vemos que ya tiene una estructura similar a una página de noticias profesional. Esto se puede ver en la siguiente imagen:

Ver el archivo adjunto 739976

Para personalizarlo tenemos que ir a "Apariencia > Personalizar" desde la barra izquierda del panel de administración de WordPress.
Se tiene que abrir lo siguiente:

Ver el archivo adjunto 739977

IDENTIDAD DEL SITIO

• Seleccionamos un Logotipo (Medida recomendada: 260 x 100px)
• Colocamos Título y Descripción pero la OCULTAMOS para dejar únicamente el logo
• Y cargamos un Icono del sitio o lo que se conoce también como Favicon

COLORES

• Se puede cambiar únicamente el color de fondo. Voy a elegir un gris claro.

MEDIOS DEL ENCABEZADO

• Es para colocar un video o una imagen por arriba del logo

IMAGEN DEL FONDO

• Le acabamos de dar el color gris al fondo de la página así que no voy a colocar una imagen ya que quedaría muy saturado en una página de noticias.

MENÚS

• Crear Nuevo Menú
  • El nombre va a ser "Principal" y la ubicación "Principal"
  • Añadir elementos al menú recién creado. Abrimos categorías y añadimos una por una todas las que tenemos.

Antes de continuar, veamos como está quedando nuestra página web de noticias:
Ver el archivo adjunto 739987

Continuemos con la personalización...

DISPOSICIÓN

• Es el diseño de la página. Por ahora vamos a utilizar "Con barra lateral derecha".

PERFILES SOCIALES

Aquí tenemos que colocar los links o enlaces de nuestros perfiles sociales. En mi caso serían los enlaces de Facebook, Instagram, Twitter y Youtube. Todos separados por una coma ",".
Por ejemplo: https://www.facebook.com/mejornet, https://www.instagram.com/mejornet/, https://twitter.com/, https://www.youtube.com/channel/UCL9zIBhAKu4Qq34GscgiPYw
Cuando hacemos esto, se agregan automáticamente los iconos en la barra superior de la página web y también en el pie de página.

CABEERA

• Ocultar perfiles sociales = Voy a dejarla desmarcada.
• Ocultar barra superior = Sí, ya que en la versión gratuita de este tema no se puede modificar el contenido que viene por defecto con fecha y perfiles sociales, aunque también queda lindo.
• Elementos de navegación en mayúsculas = Sí
• Ocultar migas de pan = No, así le muestra a las visitas el recorrido que hacen para llegar a una noticia
• Imagen de fondo de la cabecera = Se coloca como fondo en al parte superior por detrás del logo. En mi caso voy a cargar una que ya tengo editada por lo que en superposición de fondo dejo marcada la opción "Ninguno".
• Imagen de publicidad o URL de imagen publicitaria = Se ubica del lado contrario al logo. Vamos a dejarlo vacío.

ENTRADA DE NOTICIA DESTACADA

Es la barra que tenemos debajo del menú en la página de inicio. Podemos ocultarla o dejarla, y cambiarle el nombre. Pongamos lo siguiente:
Título = Últimas noticias
Marcar la opción "Mostrar las últimas entradas"

BANNER

• Configuración del banner = Mostrar solo en la página de inicio
• Carrusel destacado = Es lo que se ve en la página de inicio con dos flechas que cambian de noticias automáticamente. Voy a dejarlo pero con el título "POLÍTICA" para mostrar noticias únicamente de política. Para esto elegimos la opción "Mostrar entradas de la categoría" > POLÍTICA.
• Entradas destacadas 1 = Están al lado de la sección anterior. En este caso voy a marcar "Ocultar entradas destacadas 1"
• Entradas destacadas 2 = El título va a ser ECONOMÍA y elegimos "Mostrar las entradas de la categoría ECONOMÍA".

Veamos como viene la apariencia de nuestra página:

Ver el archivo adjunto 740002

¡PERFECTO! Ya se parece a un portal de noticias profesional. Continuemos un poco más.

ENTRADAS DESTACADAS DE LA CABECERA

Es lo que aparece ahora como "Historias populares" en nuestra página de inicio.

• Vamos a tildar "Mostrar solo en la página de inicio"
• Título de Entradas = Voy a colocar "DEPORTES", ya que es mi tercera categoría más popular
• Mostrar entradas de la categoría: Deportes

ENTRADAS DESTACADAS DEL PIE DE PÁGINA

Se encuentran al final de la página.
Aquí podemos colocar como Título: "ACTUALIDAD" y dejamos marcada la opción "Mostrar las últimas entradas".

AJUSTES DE NEWSCARD

• Mostrar imagen destacada en entrada individual. La tildamos para que la imagen destacada de cada entrada se coloque también dentro de la noticia.
• Mostrar imagen destacada en la página y Ocultar la etiqueta del título en archivos lo dejamos sin tilde.

Ahora sí, ya casi terminamos EL SITIO WEB DE PÁGINA DE NOTICIAS.

VOLVAMOS A WIDGETS

• Pie columna 1 = Buscamos el Widget de imagen y agregamos una imagen de nuestro logo para que se muestre también al final de la página.
• Pie columna 2 = Añadimos el Widget de Categorías.

Para el Pie de columna 3 y Pie de columna 4 necesitamos antes hacer algunas cosas.

VAMOS A PUBLICAR TODO LO QUE HICIMOS Y SALIR DE LA PERSONALIZACIÓN DE LA APARIENCIA.
NOS DIRIGIMOS NUEVAMENTE AL PANEL DE ADMINISTRACIÓN DE WORDPRESS PARA ULTIMAR DETALLES

CREACIÓN DE 3 (TRES) PÁGINAS ADICIONALES

Crearemos 3 Páginas desde "Páginas > Añadir nueva".

• La primer página tendrá el nombre "Política de Cookies"
• La segunda página tendrá el nombre "Política de Privacidad"
• Y la tercera el nombre "Aviso Legal".

Para aprender a crear el contenido de estas páginas les dejo un tutorial de mi autoría:



Por ahora solo nos importa tener las 3 páginas creadas con los títulos nombrados recientemente.

INSTALACIÓN DE DOS PLUGINS

Para esto ingresamos a "Plugins > Añadir nuevo" desde la barra lateral izquierda.

• El primer plugin se llama "Tiempo" y es el siguiente:

Ver el archivo adjunto 740027

Instalar y Activar

• Al segundo plugin lo buscamos como Social Media. Es el siguiente:

Ver el archivo adjunto 740028

Instalar y Activar.

Nos va a redirigir a una página.
Clic en "Permitir y Continuar"
Y bajamos para ver los pasos de configuración del plugin:

1. ¿Qué iconos quieres mostrar en tu sitio? = En este caso dejamos con tilde a Facebook, Twitter, YouTube, Instagram y WhatsApp. Guardar.
2. ¿Qué quieres que hagan los iconos=
   1. En Twitter quiero que visite mi perfil por lo que hay que colocar nuestro enlace.
   2. EN YouTube también quiero que permita a los usuarios de la página visitar mi canal. Ponemos el enlace. Y viene una opción para que se suscriban directamente.
   3. Colocamos enlace de Instagram
   4. Y en WhatsApp la opción gratuita es para "Permitir a los usuarios compartir mi página a través de WhatsApp. Guardar.
3. ¿Dónde se deberían mostrar? = Elegimos la opción "MOSTRARLOS EN UN WIDGET" y Guardamos.
4. Es un paso Opcional para elegir el diseño de los iconos. En esta ocasión van a ser con forma circular y sin efectos.

¡MUY BIEN! Ya tenemos las 3 PÁGINAS CREADAS (Política de Cookies, Políticas de Privacidad y Aviso Legal) y los 2 PLUGINS INSTALADOS Y ACTIVADOS (Tiempo y Social Media).

NOS DIRIGIMOS A APARIENCIA > WIDGETS

Nos quedaba por completar el Pie de Página 3 y Pie de Página 4.

• Pie de Página 3 = Aquí hay que agregar el de las redes sociales que recién configuramos. Su nombre es "Ultimatum Social Media Icons". Y como título colocamos "Síguenos en nuestras redes sociales". Guardar.
• Pi de Página 4 = Agregamos el Widget llamado "Páginas".
• Por último, vamos a los Widgets ubicados en la "Barra lateral derecha" y borramos si existe algo. En este lugar añadimos el Widget llamado "Tiempo" que es el plugin instalado anteriormente. Ciudad le voy a poner Córdoba y País Argentina. Mostrar clima actual. Mostrar probabilidad de lluvia, viento y humedad. Mostrar hora de salida y puesta del sol. Pronostico de 3 días.

GUARDAMOS Y LISTO.

¡PÁGINA FINALIZADA!

En el siguiente video vemos como quedó el sitio web realizado paso a paso con este tutorial, con un tema gratuito y dos plugins también gratuitos.



A mi gusto, es una de las mejores formas para crear un portal de noticias.

Espero que les guste y hasta la próxima!

Hacer clic para expandir...