Convierta una plantilla HTML en un poderoso tema de WordPress


Hace años, la mayoría de los sitios web estaban escritos en HTML. Si bien siguen siendo útiles y completamente funcionales, los sitios HTML deben actualizarse completamente por varias razones. Por un lado, generalmente no se ven muy bien en teléfonos inteligentes y tabletas. A medida que mejora el hardware, también debería hacerlo el código que se ejecuta en estos dispositivos.

Hoy en día, un gran porcentaje de los sitios web funcionan con WordPress, una plataforma de código abierto y muy fácil de usar para usuarios de todos los conjuntos de habilidades. Prácticamente no hay ninguna razón para no convertir HTML a WordPress.

Bootstrap es un marco de sitio web frontend para desarrollar sitios receptivos. Muchos usuarios navegan en tabletas y teléfonos inteligentes y los sitios HTML más antiguos a menudo no se muestran claramente en estos dispositivos. Hay varias plantillas HTML de Bootstrap en línea. Los elementos de diseño receptivo incluyen anchos de columna modificables, elementos apilados en lugar de flotantes y elementos redimensionados para una visualización adecuada en función del tamaño de la pantalla.

Convierta una plantilla HTML en un tema de WordPress

Para convertir una plantilla HTML en un tema de WordPress usando Bootstrap, instale WordPress, descargue y active Bootstrap. Si está probando en un sitio de WordPress en vivo, también debe instalar el complemento Theme Test Drive. Debajo wp-contentthemes, cree una nueva carpeta para Bootstrap. En esa carpeta, cree los siguientes archivos necesarios para todos los temas de WordPress:

  • index.php
  • style.css
  • header.php
  • footer.php
  • sidebar.php

Cuando convierta HTML a WordPress, primero copie todo desde su archivo index.html existente hasta arriba div class = ”main” en header.php. A continuación, copie todo, desde la etiqueta class = ”sidebar” a sidebar.php. Finalmente, todo lo que está debajo de la etiqueta de la barra lateral se copia en footer.php. Ha terminado con el archivo index.html por ahora.

Otra etiqueta importante para agregar a header.php es wp_head ():. Si falta esta etiqueta, es posible que algunos complementos no funcionen. También agregue un wp_footer () llamar a footer.php.

En el nuevo index.php file, agregue las llamadas a los otros archivos PHP coloque la llamada del encabezado en la parte superior y las llamadas de la barra lateral y el pie de página hacia la parte inferior.

A continuación, busque los enlaces al CSS y reemplace esas llamadas con la etiqueta de WordPress para vincular al CSS Bootstrap para cada página del sitio.

Modificar style.css archivo con lo siguiente:

Algunas otras llamadas a funciones pertinentes son:

• wp_list_pages ()
• get_sidebar ()
• the_permalink ()
• el título()
• el tiempo()
• comments_template ()

Una vez que haya creado el tema de WordPress, puede personalizar y modificar las páginas más fácilmente. No es necesario ir a cada página HTML y realizar las modificaciones. Los sitios web de WordPress tienden a cargarse más rápido porque es probable que el navegador ya haya descargado Javascript y, por lo tanto, se cargue desde la caché.

Para obtener el contenido en el nuevo sitio de WordPress, puede usar Importación HTML 2 enchufar. Esta herramienta importará un directorio de HTML estático bien formado en las páginas de WordPress.

Si prefiere no usar Bootstrap, puede optar por poner todo el código de formato en style.css ya que Bootstrap es un marco para CSS. Bootstrap le permite crear un prototipo de su sitio y ver cómo se vería antes de activar su nuevo tema. Convertir su sitio web HTML en un sitio impulsado por WordPress también facilita la optimización en todos los niveles. Esto también significa que los motores de búsqueda también pueden indexar fácilmente su sitio web.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Go up