Tutorial para Genesis Framework

Hay mucha confusión sobre como funciona Genesis, y creo que esto provoca un poco de frustración en los programadores que empiezan a trabajar con este framework. Un framework es una estructura básica para el desarrollo e implementación de estructuras mas grandes y complejas.

Por ejemplo, para desarrollar un tema para WordPress de la forma tradicional, se empieza copiando componentes clave en nuevos archivos. Por ejemplo, podemos empezar con single.php, page.php o index.php para personalizar las páginas de archivos individuales. En Genesis, muchos de esos archivos no existen, o solo contienen una sola línea de código:

<?php
  genesis();

En un tema hijo, solo hay un archivo style.css y un archivo functions.php. El archivo functions.php puede tener una sola línea de código en él. A partir de este pequeño fragmento de código, pueden crearse enormes cambios en la vista y el comportamiento de un tema, y para lograrlo solo hay que condificar algunas cuantas líneas mas.

Este sitema te permite programar de una manera muy eficiente, pero solo cuando los conceptos básicos se han comprendido correctamente. Para tal fin, Nick Croft conocido como “Nick the Geek”, creo esta serie en donde explica cómo podemos usar el framework para desarrollar o modificar rápidamente los temas derivados de Genesis.

Cómo entender el Framework Genesis

Cuando hablamos de Genesis como un Framework, piensa que es como un juego de bloques como Lego o similar. Es una plataforma en la que las piezas que la forman pueden moverse o quitarse. Al igual que los legos, algunas piezas solo caben en ciertos lugares, mientras que otras pueden colocarse donde sea.

Sin embargo, la plataforma básica no puede alterarse, y veamos por qué.

<?php
/**
 * WARNING: This file is part of the core Genesis framework. DO NOT edit
 * this file under any circumstances. Please do all modifications
 * in the form of a child theme.
 *
 * Initialize the framework from template files.
 *
 * @package Genesis
 */

/**
 * This function is used to initialize the framework in the various
 * template files. It pulls in all the basic, necessary components
 * like Header/Footer, the basic markup structure, and hooks.
 *
 * @since 1.3
 */
function genesis() {
  get_header();
  do_action( 'genesis_before_content_sidebar_wrap' );
  ?>
  <div id="content-sidebar-wrap">
    <?php do_action( 'genesis_before_content' ); ?>
    <div id="content" class="hfeed">
      <?php
        do_action( 'genesis_before_loop' );
        do_action( 'genesis_loop' );
        do_action( 'genesis_after_loop' );
      ?>
    </div><!-- end #content -->
    <?php do_action( 'genesis_after_content' ); ?>
  </div><!-- end #content-sidebar-wrap -->
  <?php
  do_action( 'genesis_after_content_sidebar_wrap' );

  get_footer();
}

Este es el archivo framework.php, uno de los 3 archivos que debe permanecer inalterado. Y la nota al principio, en inglés, nos dice precisamente eso, que el archivo no debe ser editado, como en general no deben editarse los archivos de Genesis. Cualquier cambio que hagas se perderá en la siguiente actualización, por lo que todos los cambios debes hacerlos a través de los temas hijos o derivados.

Mas abajo, en la línea 19, es dónde empieza la acción. La función genesis() es invocada en prácticamente todos los archivos de plantilla estándar. Esta función carga este archivo.

Al principio y al final, podemos ver dos funciones conocidas: “get_header()” y “get_footer()“. Estas funciones se encargan de llamar al archivo header.php y footer.php respectivamente. Estos dos archivos, de hecho, tampoco pueden cambiarse, porque forman parte del núcleo de la aplicación.

Entre el encabezado y el pie de página, está la estructura html y las funciones “do_action()“. Estos son los “ganchos” (“hooks” les dicen en inglés) a dónde vamos a “colgar” nuestras acciones. En otras palabras, son como esas pequeñas bolitas que sirve para enganchar las piezas de lego, unas con otras.

En este archivo hay 7 ganchos, pero algunos de esos también tendrán dentro otros ganchos. Todo depende de que funciones sean agregadas por las acciones. Explicaremos las acciones mas adelante, pero por ahora, lo haremos simple mostrando la estructura típica de los ganchos.

La referencia completa de todos los ganchos la pueden encontrar en el sitio de Desarrollo de StudioPress. En este sitio encontrarás una gran cantidad de artículos que explican conceptos clave sobre el Framework Genesis.

De todas formas, a continuación encontrarás una referencia simplificada a todos los ganchos, empezando con el gancho que carga al propio framework.

• genesis_pre
• genesis_pre_framework
• genesis_init
• header.php
  • genesis_title
  • genesis_meta
  • genesis_before
  • genesis_before_header
  • genesis_header
    • genesis_site_title
    • genesis_site_description
  • genesis_after_header
• framework.php
  • genesis_before_content_sidebar_wrap
  • genesis_before_content
  • genesis_before_loop
  • genesis_loop
    • genesis_before_post
    • genesis_before_post_title
    • genesis_post_title
    • genesis_after_post_title
    • genesis_before_post_content
    • genesis_post_content
    • genesis_after_post_content
    • genesis_after_post
      • genesis_before_comments
      • genesis_comments
        • genesis_list_comments
        • genesis_before_pings
        • genesis_pings
          • genesis_list_pings
        • genesis_after_pings
        • genesis_before_comment
        • genesis_after_comment
        • genesis_before_comment_form
        • genesis_comment_form
        • genesis_after_comment_form
    • genesis_after_endwhile
    • genesis_loop_else
  • genesis_after_loop
  • genesis_after_content
    • genesis_sidebar
      • genesis_before_sidebar_widget_area
      • genesis_after_sidebar_widget_area
    • genesis_sidebar_alt
      • genesis_before_sidebar_alt_widget_area
      • genesis_after_sidebar_alt_widget_area
  • genesis_after_sidebar_content_wrap
• footer.php
  • genesis_before_footer
  • genesis_footer
  • genesis_after_footer
  • genesis_after

¡Es una cantidad enorme de ganchos! Y cada uno de ellos agrega funciones adiciones. Y con unas cuantas líneas de código puedes mover secciones enteras de tu sitio. En los siguientes artículos de la serie, Nick “the Geek”, explica como leer los archivos de Genesis para encontrar la forma mas eficiente de usar el código para el tema que estamos editando.

Si te sientes un poco perdido, no te preocupes mucho, en este sitio poco a poco empezarán a aparecer todos los artículos de la serie de Nick y también los artículos del sitio de desarrollo de StudioPress, así que no te pierdas el próximo artículo.

Si necesitas ayuda con Genesis puedes ponerte en contacto conmigo o bien usar los foros para recibir asistencia gratuita.