03.- Crear una Plantilla en Wordpress [Plantilla en bootstrap]


INTRODUCCIÓN

En este tutorial vamos a descargar un html y ese html lo vamos a convertir en una plantilla de wordpress.

PROCEDIMIENTOS

1.- Descargamos dopetrope.zip desde aqui

2.- Copiamos dopetrope en temapn (la carpeta donde creamos nuestra plantilla).

3.- Extraemos en contenido de /assets/css/main.css en style.css

4.- Reparamos los paths de style.css (Buscamos todo lo que diga url)
Sustituimos
    "font-awesome.min.css" por "assets/css/font-awesome.min.css"
    "images/" por "assets/css/images/"
    "../../images/pic01.jpg" por "images/pic01.jpg"
    "bg01.png" por "bg.png"
    "bg02.png" por "bg.png"

5.- Copiamos el contenido de index.html y lo pegamos en index.php y borramos index.html

6.- En el header.php colocamos esto


<html <?php language_attributes(); ?>>
    <head>
        <title><?php echo bloginfo("name");// Nos da el nombre del blog ?></title>
        <meta charset="<?php bloginfo("charset");//Nos da el charset del blog ?>" />
        <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
        <link rel="stylesheet" href="<?php echo get_template_directory_uri()."/style.css"; ?>">
    </head>

7.- Creamos el archivo header.php y footer.php donde colocaremos el header y footer del index respectivamente.

8.- En el index cologar:
<?php get_header(); ?>
y
<?php get_footer(); ?>

9.- Colocar en footer.php

<script src="<?php echo get_template_directory_uri() ?>/assets/js/jquery.min.js"></script>
<script src="<?php echo get_template_directory_uri() ?>/assets/js/jquery.dropotron.min.js"></script>
<script src="<?php echo get_template_directory_uri() ?>/assets/js/browser.min.js"></script>
<script src="<?php echo get_template_directory_uri() ?>/assets/js/breakpoints.min.js"></script>
<script src="<?php echo get_template_directory_uri() ?>/assets/js/util.js"></script>
<script src="<?php echo get_template_directory_uri() ?>/assets/js/main.js"></script>


En el siguiente tutorial arreglaremos la imagenes que nos faltaron y agregaremos trabajaremos con el archivo functions.php y con las funciones wp_head y wp_footer




Comentarios

Facebook Like

Entri Populer

hackear wifi con kali linux 📡

Instalar Netbeans 10 en Windows 10

Instalar netbeans 10 en ubuntu 18.04