Crear un tema de Wordpress. Clase 2

En el primer post habíamos visto los dos archivos básicos styles.css e index.php.

Ahora veremos dos archivos más funciones.php y sidebar.php

1.- Otros archivos necesarios

Cada archivo de la plantilla debe utilizar el nombre correcto definido por la documentación de WordPress.

Algunos de los archivos de plantilla aparte de index.php:

• header.php
• index.php
• footer.php
• funciones.php
• sidebar.php
• single.php
• page.php

Los copiamos dentro de la carpeta wp-content/themes/chaveztoro/ (este es en mi caso).

2.- Antes de iniciar el desarrollo

En primer lugar, incluiremos un archivo CSS denominado normalize.css. Diferentes navegadores tienen diferentes ajustes predeterminados para cosas como los márgenes de página y el relleno.

Normalize.css establece explícitamente un número de atributos para garantizar que todos los navegadores muestren su página exactamente igual.

3.- funciones.php

Abrir functions.php y agrega el siguiente código

<?php
// This function enqueues the Normalize.css for use. The first parameter is a name for the stylesheet, the second is the URL. Here we
// use an online version of the css file.
function add_normalize_CSS() {
    wp_enqueue_style( 'normalize-styles', "https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css");
}

4.- activar los widgets de la barra lateral

Si no incluyes este código, el enlace del menú de widgets no estará visible en el panel de control del administrador y no podrás agregar ningún widget.

debajo de la función anterior, agregue el código siguiente:

// Register a new sidebar simply named 'sidebar'
function add_widget_Support() {
                register_sidebar( array(
                                'name'          => 'Sidebar',
                                'id'            => 'sidebar',
                                'before_widget' => '<div>',
                                'after_widget'  => '</div>',
                                'before_title'  => '<h2>',
                                'after_title'   => '</h2>',
                ) );
}
// Hook the widget initiation and run our function
add_action( 'widgets_init', 'add_Widget_Support' );

5.- Registrar un menú de navegación personalizado para permitir el uso de la función Apariencia -> Menús

Debajo del código anterior, añada lo siguiente:

// Register a new navigation menu
function add_Main_Nav() {
  register_nav_menu('header-menu',__( 'Header Menu' ));
}
// Hook to the init action hook, run our navigation menu function
add_action( 'init', 'add_Main_Nav' );

Guardar functions.php y subelo al directorio de tu tema.

En mi caso, el tema se llama chaveztoro.
Y la ruta sería: wp-content/themes/chaveztoro/

6.- sidebar.php

abre el archivo sidebar.php y el siguiente código. Hace que la barra lateral y los widgets aparezcan en su tema dondequiera que se llame a get_sidebar().

<?php if ( is_active_sidebar( 'sidebar' ) ) : ?>
  <aside id="primary-sidebar" class="primary-sidebar widget-area" role="complementary">
    <?php dynamic_sidebar( 'sidebar' ); ?>
  </aside>
<?php endif; ?>

La primera línea indica a WordPress que si no se habilitan widgets, no se debe mostrar el código HTML de la barra lateral. La segunda línea establece los atributos del elemento que contiene los widgets.

Guardar y cargar sidebar.php en el directorio de su tema.

Bueno, eso es todo por hoy.
Nos vemos en la siguiente clase.