Estas en: Home > funciones

Entradas etiquetadas con funciones

Cron Job WordPress

WordPress 3.x para desarrolladores: Temas y plantillas, functions.php

0

Como ya llevamos varias plantillas creadas con algunas llamadas a funciones del archivo functions.php, vamos a crearlo y añadir esas funciones, después continuaremos añadiendo más plantillas.

 

FUNCTIONS.PHP

Creamos el archivo functions.php y añadimos el siguiente código:

  1. <?php
  2.  
  3. /**
  4.  * Set the content width based on the theme's design and stylesheet.
  5.  */
  6. if ( ! isset( $content_width ) )
  7. $content_width = 584;

Este código creara una variable que nos indicará el ancho que tendrá el contenido.

  1. <?php
  2.  
  3. /**
  4.  * Tell WordPress to run newtheme_setup() when the 'after_setup_theme' hook is run.
  5.  */
  6. add_action( 'after_setup_theme', 'newtheme_setup' );
  7.  
  8. if ( ! function_exists( 'newtheme_setup' ) ):
  9.  
  10. function newtheme_setup() {
  11.  
  12. }
  13.  
  14. endif;

 

Le decimos a WordPress que ejecute newtheme_setup cuando el hook after_setup_theme esté funcionando. Creamos un condicional para comprobar que la función newtheme_setup no ha sido aun creada, y creamos la función.

Dentro de newtheme_setup añadiremos las siguientes lineas de código:

  1. <?php
  2.  
  3. load_theme_textdomain( 'newtheme', get_template_directory() . '/languages' );

Esta línea cargará el archivo de idioma correspondiente.

  1. <?php
  2.  
  3. add_editor_style();

Le indicamos a WordPress que cargue el editor de estilos. Para ello WordPress buscará el archivo editor-style.css dentro de la carpeta del tema, por tanto copiaremos los archivos editor-style.css y editor-style-rtl.css del tema Twenty Eleven a nuestro tema.

  1. <?php
  2.  
  3. require( get_template_directory() . '/inc/theme-options.php' );
  4. require( get_template_directory() . '/inc/widgets.php' );

Estas dos lineas cargan los archivos de las opciones del tema que se mostrarán en la administración y los widgets de los que disponga el tema.

  1. <?php
  2.  
  3. add_theme_support( 'automatic-feed-links' );

Le indicamos a WordPress que los links de este tema se añadirán a un archivo rss que se creará automáticamente. Más sobre otros argumentos de esta función: http://codex.wordpress.org/Function_Reference/add_theme_support

  1. <?php
  2.  
  3. register_nav_menu( 'primary', __( 'Primary Menu', 'newtheme' ) );

Registramos la barra de menú de la cabecera.

  1. <?php
  2. add_theme_support( 'post-formats', array( 'aside', 'link', 'gallery', 'status', 'quote', 'image' ) );

Añadimos soporte para varios tipos de formato de posts.

  1. <?php
  2.  
  3. $theme_options = newtheme_get_theme_options();
  4. if ( 'dark' == $theme_options['color_scheme'] )
  5. $default_background_color = '1d1d1d';
  6. else
  7. $default_background_color = 'f1f1f1';
  8.  
  9. // Add support for custom backgrounds.
  10. add_theme_support( 'custom-background', array(
  11. // Let WordPress know what our default background color is.
  12. // This is dependent on our current color scheme.
  13. 'default-color' => $default_background_color,
  14. ) );

Primero recuperamos las opciones del tema a través de la función newtheme_get_theme_options(), que se encuentra en el archivo inc/theme_options.php, el cual crearemos más delante.

Comprobamos que tipo de esquema de estilos se ha elegido y guardamos en la variable $default_background_color el valor correspondiente.

Le indicamos a WordPress el color de nuestro fondo de página.

  1. <?php
  2.  
  3. add_theme_support( 'post-thumbnails' );

Le indicamos a WordPress que este tema utilizará imágenes destacadas o thumbnails.

  1. <?php
  2.  
  3. $custom_header_support = array(
  4. // The default header text color.
  5. 'default-text-color' => '000',
  6. // The height and width of our custom header.
  7. 'width' => apply_filters( 'newtheme_header_image_width', 1000 ),
  8. 'height' => apply_filters( 'newtheme_header_image_height', 288 ),
  9. // Support flexible heights.
  10. 'flex-height' => true,
  11. // Random image rotation by default.
  12. 'random-default' => true,
  13. // Callback for styling the header.
  14. 'wp-head-callback' => 'newtheme_header_style',
  15. // Callback for styling the header preview in the admin.
  16. 'admin-head-callback' => 'newtheme_admin_header_style',
  17. // Callback used to display the header preview in the admin.
  18. 'admin-preview-callback' => 'newtheme_admin_header_image',
  19. );
  20.  
  21. add_theme_support( 'custom-header', $custom_header_support );

Creamos un array con los encabezados personalizados y se lo indicamos a WordPress.

  1. <?php
  2.  
  3. if ( ! function_exists( 'get_custom_header' ) ) {
  4. // This is all for compatibility with versions of WordPress prior to 3.4.
  5. define( 'HEADER_TEXTCOLOR', $custom_header_support['default-text-color'] );
  6. define( 'HEADER_IMAGE', '' );
  7. define( 'HEADER_IMAGE_WIDTH', $custom_header_support['width'] );
  8. define( 'HEADER_IMAGE_HEIGHT', $custom_header_support['height'] );
  9. add_custom_image_header( $custom_header_support['wp-head-callback'], $custom_header_support['admin-head-callback'], $custom_header_support['admin-preview-callback'] );
  10. add_custom_background();
  11. }

En el caso de que se utilizase este tema con una versión de WordPress inferior a la 3.4 creamos varias constantes, y añadimos las cabeceras personalizadas y el fondo a WordPress.

  1. <?php
  2.  
  3. set_post_thumbnail_size( $custom_header_support['width'], $custom_header_support['height'], true );

Configuramos la imagen destacada definiendo un ancho y alto.

  1. <?php
  2.  
  3. add_image_size( 'large-feature', $custom_header_support['width'], $custom_header_support['height'], true );
  4. // Used for featured posts if a large-feature doesn't exist.
  5. add_image_size( 'small-feature', 500, 300 );

Añadimos la imagen a la cabecera definiendo su ancho y alto, además añadimos una imagen más pequeña para los post en el caso de que no existe imagen para la cabecera.

  1. <?php
  2.  
  3. register_default_headers( array(
  4. 'wheel' => array(
  5. 'url' => '%s/images/headers/wheel.jpg',
  6. 'thumbnail_url' => '%s/images/headers/wheel-thumbnail.jpg',
  7. /* translators: header image description */
  8. 'description' => __( 'Wheel', 'newtheme' )
  9. ),
  10. 'shore' => array(
  11. 'url' => '%s/images/headers/shore.jpg',
  12. 'thumbnail_url' => '%s/images/headers/shore-thumbnail.jpg',
  13. /* translators: header image description */
  14. 'description' => __( 'Shore', 'newtheme' )
  15. ),
  16. 'trolley' => array(
  17. 'url' => '%s/images/headers/trolley.jpg',
  18. 'thumbnail_url' => '%s/images/headers/trolley-thumbnail.jpg',
  19. /* translators: header image description */
  20. 'description' => __( 'Trolley', 'newtheme' )
  21. ),
  22. 'pine-cone' => array(
  23. 'url' => '%s/images/headers/pine-cone.jpg',
  24. 'thumbnail_url' => '%s/images/headers/pine-cone-thumbnail.jpg',
  25. /* translators: header image description */
  26. 'description' => __( 'Pine Cone', 'newtheme' )
  27. ),
  28. 'chessboard' => array(
  29. 'url' => '%s/images/headers/chessboard.jpg',
  30. 'thumbnail_url' => '%s/images/headers/chessboard-thumbnail.jpg',
  31. /* translators: header image description */
  32. 'description' => __( 'Chessboard', 'newtheme' )
  33. ),
  34. 'lanterns' => array(
  35. 'url' => '%s/images/headers/lanterns.jpg',
  36. 'thumbnail_url' => '%s/images/headers/lanterns-thumbnail.jpg',
  37. /* translators: header image description */
  38. 'description' => __( 'Lanterns', 'newtheme' )
  39. ),
  40. 'willow' => array(
  41. 'url' => '%s/images/headers/willow.jpg',
  42. 'thumbnail_url' => '%s/images/headers/willow-thumbnail.jpg',
  43. /* translators: header image description */
  44. 'description' => __( 'Willow', 'newtheme' )
  45. ),
  46. 'hanoi' => array(
  47. 'url' => '%s/images/headers/hanoi.jpg',
  48. 'thumbnail_url' => '%s/images/headers/hanoi-thumbnail.jpg',
  49. /* translators: header image description */
  50. 'description' => __( 'Hanoi Plant', 'newtheme' )
  51. )
  52. ) );

Este es el paquete de imágenes que el tema Twenty Eleven trae por defecto, nosotros haremos lo mismo. Si no lo habéis hecho ya, copiad la carpeta images del tema Twenty Eleven a nuestro tema.

El marcador %s indica que se debe sustituir por la uri del tema.

Como esta función tiene llamadas a otras funciones dentro del mismo archivo functions.php, vamos a crearlas.

En primer lugar crearemos la función newtheme_header_style():

  1. <?php
  2.  
  3. if ( ! function_exists( 'newtheme_header_style' ) ) :
  4. /**
  5.  * Styles the header image and text displayed on the blog
  6.  */
  7. function newtheme_header_style() {
  8. $text_color = get_header_textcolor();
  9.  
  10. // If no custom options for text are set, let's bail.
  11. if ( $text_color == HEADER_TEXTCOLOR )
  12. return;
  13.  
  14. // If we get this far, we have custom styles. Let's do this.
  15. ?>
  16. <style type="text/css">
  17. <?php
  18. // Has the text been hidden?
  19. if ( 'blank' == $text_color ) :
  20. ?>
  21. #site-title,
  22. #site-description {
  23. position: absolute !important;
  24. clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
  25. clip: rect(1px, 1px, 1px, 1px);
  26. }
  27. <?php
  28. // If the user has set a custom color for the text use that
  29. else :
  30. ?>
  31. #site-title a,
  32. #site-description {
  33. color: #<?php echo $text_color; ?> !important;
  34. }
  35. <?php endif; ?>
  36. </style>
  37. <?php
  38. }
  39. endif; // newtheme_header_style

Simplemente en esta función se generan los estilos para el título y la descripción que se ubican en la cabecera de la página.

Creamos el método newtheme_admin_header_style():

  1. <?php
  2.  
  3. if ( ! function_exists( 'newtheme_admin_header_style' ) ) :
  4. /**
  5.  * Styles the header image displayed on the Appearance > Header admin panel.
  6.  *
  7.  * Referenced via add_theme_support('custom-header') in newtheme_setup().
  8.  */
  9. function newtheme_admin_header_style() {
  10. ?>
  11. <style type="text/css">
  12. .appearance_page_custom-header #headimg {
  13. border: none;
  14. }
  15. #headimg h1,
  16. #desc {
  17. font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
  18. }
  19. #headimg h1 {
  20. margin: 0;
  21. }
  22. #headimg h1 a {
  23. font-size: 32px;
  24. line-height: 36px;
  25. text-decoration: none;
  26. }
  27. #desc {
  28. font-size: 14px;
  29. line-height: 23px;
  30. padding: 0 0 3em;
  31. }
  32. <?php
  33. // If the user has set a custom color for the text use that
  34. if ( get_header_textcolor() != HEADER_TEXTCOLOR ) :
  35. ?>
  36. #site-title a,
  37. #site-description {
  38. color: #<?php echo get_header_textcolor(); ?>;
  39. }
  40. <?php endif; ?>
  41. #headimg img {
  42. max-width: 1000px;
  43. height: auto;
  44. width: 100%;
  45. }
  46. </style>
  47. <?php
  48. }
  49. endif; // newhtme_admin_header_style

Esta función permite dar estilos a la imagen de la cabecera dentro de su apartado de opciones en la administración de WordPress, donde se podrá configurar cómo se ve la imagen.

Creamos la función newtheme_admin_header_image():

  1. <?php
  2.  
  3. if ( ! function_exists( 'newtheme_admin_header_image' ) ) :
  4. /**
  5.  * Custom header image markup displayed on the Appearance > Header admin panel.
  6.  *
  7.  * Referenced via add_theme_support('custom-header') in newtheme_setup().
  8.  */
  9. function newtheme_admin_header_image() { ?>
  10. <div id="headimg">
  11. <?php
  12. $color = get_header_textcolor();
  13. $image = get_header_image();
  14. if ( $color && $color != 'blank' )
  15. $style = ' style="color:#' . $color . '"';
  16. else
  17. $style = ' style="display:none"';
  18. ?>
  19. <h1><a id="name"<?php echo $style; ?> onclick="return false;" href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a></h1>
  20. <div id="desc"<?php echo $style; ?>><?php bloginfo( 'description' ); ?></div>
  21. <?php if ( $image ) : ?>
  22. <img src="<?php echo esc_url( $image ); ?>" alt="" />
  23. <?php endif; ?>
  24. </div>
  25. <?php }
  26. endif; // newtheme_admin_header_image

Esta función crea el código html que mostrará la imagen, el título y la descripción en su respectiva zona de opciones de la administración de WordPress, para que el usuario pueda ver como quedaría.

  1. <?php
  2.  
  3. /**
  4.  * Sets the post excerpt length to 40 words.
  5.  *
  6.  * To override this length in a child theme, remove the filter and add your own
  7.  * function tied to the excerpt_length filter hook.
  8.  */
  9. function newtheme_excerpt_length( $length ) {
  10. return 40;
  11. }
  12. add_filter( 'excerpt_length', 'newtheme_excerpt_length' );

Esta función establece la longitud del extracto de un post a 40 palabras.

  1. <?php
  2.  
  3. /**
  4.  * Returns a "Continue Reading" link for excerpts
  5.  */
  6. function newtheme_continue_reading_link() {
  7. return ' <a href="'. esc_url( get_permalink() ) . '">' . __( 'Continue reading <span class="meta-nav">&rarr;</span>', 'newtheme' ) . '</a>';
  8. }

Esta función devuelve el link con el texto “Seguir leyendo…” en los extractos de los posts.

  1. <?php
  2.  
  3. /**
  4.  * Replaces "[...]" (appended to automatically generated excerpts) with an ellipsis and newtheme_continue_reading_link().
  5.  *
  6.  * To override this in a child theme, remove the filter and add your own
  7.  * function tied to the excerpt_more filter hook.
  8.  */
  9. function newtheme_auto_excerpt_more( $more ) {
  10. return ' &hellip;' . newtheme_continue_reading_link();
  11. }
  12. add_filter( 'excerpt_more', 'newtheme_auto_excerpt_more' );

Esta función remplaza el texto “[…]” por “…” utilizando “&hellip;” para ello, y el link de newtheme_continue_reading_link()

  1. <?php
  2.  
  3. /**
  4.  * Adds a pretty "Continue Reading" link to custom post excerpts.
  5.  *
  6.  * To override this link in a child theme, remove the filter and add your own
  7.  * function tied to the get_the_excerpt filter hook.
  8.  */
  9. function newtheme_custom_excerpt_more( $output ) {
  10. if ( has_excerpt() && ! is_attachment() ) {
  11. $output .= newtheme_continue_reading_link();
  12. }
  13. return $output;
  14. }
  15. add_filter( 'get_the_excerpt', 'newtheme_custom_excerpt_more' );

Añade la salida de newtheme_continue_reading_link() a los extractos personalizados de los posts.

  1. <?php
  2.  
  3. /**
  4.  * Get our wp_nav_menu() fallback, wp_page_menu(), to show a home link.
  5.  */
  6. function newtheme_page_menu_args( $args ) {
  7. $args['show_home'] = true;
  8. return $args;
  9. }
  10. add_filter( 'wp_page_menu_args', 'newtheme_page_menu_args' );

Esta función hace que en nuestro menú de navegación aparezca un link hacía la página principal.

  1. <?php
  2.  
  3. /**
  4.  * Register our sidebars and widgetized areas. Also register the default Epherma widget.
  5.  */
  6. function newtheme_widgets_init() {
  7.  
  8. register_widget( 'New_Theme_Ephemera_Widget' );
  9.  
  10. register_sidebar( array(
  11. 'name' => __( 'Main Sidebar', 'newtheme' ),
  12. 'id' => 'sidebar-1',
  13. 'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  14. 'after_widget' => "</aside>",
  15. 'before_title' => '<h3 class="widget-title">',
  16. 'after_title' => '</h3>',
  17. ) );
  18.  
  19. register_sidebar( array(
  20. 'name' => __( 'Showcase Sidebar', 'newtheme' ),
  21. 'id' => 'sidebar-2',
  22. 'description' => __( 'The sidebar for the optional Showcase Template', 'newtheme' ),
  23. 'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  24. 'after_widget' => "</aside>",
  25. 'before_title' => '<h3 class="widget-title">',
  26. 'after_title' => '</h3>',
  27. ) );
  28.  
  29. register_sidebar( array(
  30. 'name' => __( 'Footer Area One', 'newtheme' ),
  31. 'id' => 'sidebar-3',
  32. 'description' => __( 'An optional widget area for your site footer', 'newtheme' ),
  33. 'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  34. 'after_widget' => "</aside>",
  35. 'before_title' => '<h3 class="widget-title">',
  36. 'after_title' => '</h3>',
  37. ) );
  38.  
  39. register_sidebar( array(
  40. 'name' => __( 'Footer Area Two', 'newtheme' ),
  41. 'id' => 'sidebar-4',
  42. 'description' => __( 'An optional widget area for your site footer', 'newtheme' ),
  43. 'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  44. 'after_widget' => "</aside>",
  45. 'before_title' => '<h3 class="widget-title">',
  46. 'after_title' => '</h3>',
  47. ) );
  48.  
  49. register_sidebar( array(
  50. 'name' => __( 'Footer Area Three', 'newtheme' ),
  51. 'id' => 'sidebar-5',
  52. 'description' => __( 'An optional widget area for your site footer', 'newtheme' ),
  53. 'before_widget' => '<aside id="%1$s" class="widget %2$s">',
  54. 'after_widget' => "</aside>",
  55. 'before_title' => '<h3 class="widget-title">',
  56. 'after_title' => '</h3>',
  57. ) );
  58. }
  59. add_action( 'widgets_init', 'newtheme_widgets_init' );

Esta función registra nuestro widget que crearemos en el archivo inc/widgets.php, y las cinco sidebars que añade el tema a diferentes partes de la página.

  1. <?php
  2.  
  3. if ( ! function_exists( 'newtheme_content_nav' ) ) :
  4. /**
  5.  * Display navigation to next/previous pages when applicable
  6.  */
  7. function newtheme_content_nav( $nav_id ) {
  8. global $wp_query;
  9.  
  10. if ( $wp_query->max_num_pages > 1 ) : ?>
  11. <nav id="<?php echo $nav_id; ?>">
  12. <h3 class="assistive-text"><?php _e( 'Post navigation', 'newtheme' ); ?></h3>
  13. <div class="nav-previous"><?php next_posts_link( __( '<span class="meta-nav">&larr;</span> Older posts', 'newtheme' ) ); ?></div>
  14. <div class="nav-next"><?php previous_posts_link( __( 'Newer posts <span class="meta-nav">&rarr;</span>', 'newtheme' ) ); ?></div>
  15. </nav><!-- #nav-above -->
  16. <?php endif;
  17. }
  18. endif; // newtheme_content_nav

Muestra los links para mostrar la siguiente o anterior página de posts cuando sea aplicable.

  1. <?php
  2.  
  3. /**
  4.  * Return the URL for the first link found in the post content.
  5.  *
  6.  * @return string|bool URL or false when no link is present.
  7.  */
  8. function newtheme_url_grabber() {
  9. if ( ! preg_match( '/<a\s[^>]*?href=[\'"](.+?)[\'"]/is', get_the_content(), $matches ) )
  10. return false;
  11.  
  12. return esc_url_raw( $matches[1] );
  13. }

Devuelve la url del primer link encontrado en el contenido del post.

  1. <?php
  2.  
  3. /**
  4.  * Count the number of footer sidebars to enable dynamic classes for the footer
  5.  */
  6. function newtheme_footer_sidebar_class() {
  7. $count = 0;
  8.  
  9. if ( is_active_sidebar( 'sidebar-3' ) )
  10. $count++;
  11.  
  12. if ( is_active_sidebar( 'sidebar-4' ) )
  13. $count++;
  14.  
  15. if ( is_active_sidebar( 'sidebar-5' ) )
  16. $count++;
  17.  
  18. $class = '';
  19.  
  20. switch ( $count ) {
  21. case '1':
  22. $class = 'one';
  23. break;
  24. case '2':
  25. $class = 'two';
  26. break;
  27. case '3':
  28. $class = 'three';
  29. break;
  30. }
  31.  
  32. if ( $class )
  33. echo 'class="' . $class . '"';
  34. }

Cuenta el número de sidebars habilitados para el pie de página y devuelve la clase que corresponda.

  1. <?php
  2.  
  3. if ( ! function_exists( 'newtheme_comment' ) ) :
  4. /**
  5.  * Template for comments and pingbacks.
  6.  *
  7.  * To override this walker in a child theme without modifying the comments template
  8.  * simply create your own newtheme_comment(), and that function will be used instead.
  9.  *
  10.  * Used as a callback by wp_list_comments() for displaying the comments.
  11.  *
  12.  */
  13. function newtheme_comment( $comment, $args, $depth ) {
  14. $GLOBALS['comment'] = $comment;
  15. switch ( $comment->comment_type ) :
  16. case 'pingback' :
  17. case 'trackback' :
  18. ?>
  19. <li class="post pingback">
  20. <p><?php _e( 'Pingback:', 'newtheme' ); ?> <?php comment_author_link(); ?><?php edit_comment_link( __( 'Edit', 'newtheme' ), '<span class="edit-link">', '</span>' ); ?></p>
  21. <?php
  22. break;
  23. default :
  24. ?>
  25. <li <?php comment_class(); ?> id="li-comment-<?php comment_ID(); ?>">
  26. <article id="comment-<?php comment_ID(); ?>" class="comment">
  27. <footer class="comment-meta">
  28. <div class="comment-author vcard">
  29. <?php
  30. $avatar_size = 68;
  31. if ( '0' != $comment->comment_parent )
  32. $avatar_size = 39;
  33.  
  34. echo get_avatar( $comment, $avatar_size );
  35.  
  36. /* translators: 1: comment author, 2: date and time */
  37. printf( __( '%1$s on %2$s <span class="says">said:</span>', 'newtheme' ),
  38. sprintf( '<span class="fn">%s</span>', get_comment_author_link() ),
  39. sprintf( '<a href="%1$s"><time pubdate datetime="%2$s">%3$s</time></a>',
  40. esc_url( get_comment_link( $comment->comment_ID ) ),
  41. get_comment_time( 'c' ),
  42. /* translators: 1: date, 2: time */
  43. sprintf( __( '%1$s at %2$s', 'newtheme' ), get_comment_date(), get_comment_time() )
  44. )
  45. );
  46. ?>
  47.  
  48. <?php edit_comment_link( __( 'Edit', 'newtheme' ), '<span class="edit-link">', '</span>' ); ?>
  49. </div><!-- .comment-author .vcard -->
  50.  
  51. <?php if ( $comment->comment_approved == '0' ) : ?>
  52. <em class="comment-awaiting-moderation"><?php _e( 'Your comment is awaiting moderation.', 'newtheme' ); ?></em>
  53. <br />
  54. <?php endif; ?>
  55.  
  56. </footer>
  57.  
  58. <div class="comment-content"><?php comment_text(); ?></div>
  59.  
  60. <div class="reply">
  61. <?php comment_reply_link( array_merge( $args, array( 'reply_text' => __( 'Reply <span>&darr;</span>', 'newtheme' ), 'depth' => $depth, 'max_depth' => $args['max_depth'] ) ) ); ?>
  62. </div><!-- .reply -->
  63. </article><!-- #comment-## -->
  64.  
  65. <?php
  66. break;
  67. endswitch;
  68. }
  69. endif; // ends check for newtheme_comment()

Esta función genera el código html necesario para mostrar cada comentario de un post.

  1. <?php
  2.  
  3. if ( ! function_exists( 'newtheme_posted_on' ) ) :
  4. /**
  5.  * Prints HTML with meta information for the current post-date/time and author.
  6.  * Create your own newtheme_posted_on to override in a child theme
  7.  */
  8. function newtheme_posted_on() {
  9. printf( __( '<span class="sep">Posted on </span><a href="%1$s" title="%2$s" rel="bookmark"><time class="entry-date" datetime="%3$s" pubdate>%4$s</time></a><span class="by-author"> <span class="sep"> by </span> <span class="author vcard"><a class="url fn n" href="%5$s" title="%6$s" rel="author">%7$s</a></span></span>', 'newtheme' ),
  10. esc_url( get_permalink() ),
  11. esc_attr( get_the_time() ),
  12. esc_attr( get_the_date( 'c' ) ),
  13. esc_html( get_the_date() ),
  14. esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ),
  15. esc_attr( sprintf( __( 'View all posts by %s', 'newtheme' ), get_the_author() ) ),
  16. get_the_author()
  17. );
  18. }
  19. endif;

Esta función devuelve los metadatos de un post.

  1. <?php
  2.  
  3. /**
  4.  * Adds two classes to the array of body classes.
  5.  * The first is if the site has only had one author with published posts.
  6.  * The second is if a singular post being displayed
  7.  */
  8. function newtheme_body_classes( $classes ) {
  9.  
  10. if ( function_exists( 'is_multi_author' ) && ! is_multi_author() )
  11. $classes[] = 'single-author';
  12.  
  13. if ( is_singular() && ! is_home() && ! is_page_template( 'showcase.php' ) && ! is_page_template( 'sidebar-page.php' ) )
  14. $classes[] = 'singular';
  15.  
  16. return $classes;
  17. }
  18. add_filter( 'body_class', 'newtheme_body_classes' );

Esta función devuelve las clases de estilos que corresponden para la etiqueta body dependiendo del tipo de página que se muestre al usuario.

Cron Job WordPress

WordPress 3.x para desarrolladores: Temas y plantillas, conceptos básicos.

0

Los temás en WordPress se alojan en la carpeta /wp-content/themes. En cada tema encontraremos los diferentes archivos que lo componen (archivos css, plantillas, archivo functions.php, imágenes y archivos javascript).

 

TEMAS HIJOS

En WordPress puedes crear temas que sean derivados o hijos de otros. Por ejemplo, si en /wp-content/themes un tema llamado twentyeleven, solo habría que crear otro con el mismo nombre pero añadiendo al final -child. Por tanto tendríamos /wp-content/themes/twentyeleven y /wp-content/themes/twentyeleven-child.

Como mínimo un tema hijo debe contener el archivo style.css, el resto de archivos son opcionales (plantillas, archivo functions.php, css, javascript, etc)

 

HOJAS DE ESTILO DE LOS TEMAS

Cada tema deberá tener un archivo css llamado style.css donde se añadirá información sobre el tema que se está utilizando. Ejemplo:

/*
Theme Name: Twenty Ten
Theme URI: http://wordpress.org/
Description: The 2010 default theme for WordPress.
Author: wordpressdotorg
Author URI: http://wordpress.org/
Version: 1.0
Tags: black, blue, white, two-columns, fixed-width, custom-header, custom-background, threaded-comments, sticky-post, translation-ready, microformats, rtl-language-support, editor-style, custom-menu (optional)

License:
License URI:

General comments (optional).
*/

 

DIRECTRICES DE LAS HOJAS DE ESTILO

  • Cumplir con las normas CSS durante la creación de tus CSS.
  • Usar CSS válido siempre que sea posible. Como excepción, el uso de prefijos específicos de los proveedores para tomar ventaja de las características de CSS3.
  • Minimizar hacks CSS. La excepción obvia es navegadores con soporte específico, por lo general las versiones de IE. Si es posible, hacks CSS separados en secciones separadas o archivos separados.
  • Todos los elementos HTML posibles deben ser estilizados por el tema, tanto el contenido de los post/páginas y en el contenido de los comentarios.
  • Tablas, títulos, imágenes, listas, bloques de citas, etcétera.
  • Añadir estilos para impresión es muy recomendable.
  • Puede incluir una hoja de estilos de impresión con media=”print” o añadir en un bloque de medios impresos en su hoja de estilo principal.

 

ARCHIVO DE FUNCIONES

Un tema puede opcionalmente usar un archivo de funciones, el cual residirá en el subdirectorio del tema y se nombrará como functions.php. Este archivo básicamente actua como un plugin, y si está presente en el tema que tu estás usando, será automáticamente cargado durante el inicio de WordPress. Algunos usos sugeridos para este archivo:

  • Habilitar las funciones de temas, tales como barras laterales, menús de navegación, miniaturas post, formatos de post, los encabezados personalizados, fondos personalizados, entre otros.
  • Definir las funciones utilizadas en varios archivos de plantilla del tema.
  • Crear un menú de opciones, dando a los propietarios del sitio opciones de colores, estilos y otros aspectos de su tema.

 

ARCHIVOS DE PLANTILLAS

Las plantillas son archivos de código PHP utilizadas para generar las páginas solicitadas por los visitantes. Echemos un vistazo a las distintas plantillas que se pueden definir como parte de un tema.

 

LISTA DE ARCHIVOS DE PLANTILLAS

Esta lista muestra los principales archivos de plantilla de WordPress para cada tema, aunque no tienen porqué crearse todos si no es necesario.

  • style.css: La hoja de estilos principal. Debe ser incluido en el tema y contener la información del encabezado.
  • rtl.css: La hoja de estilo RTL. Se incluirá de forma automática si la dirección del texto de la página web es de derecha a izquierda. El archivo puede ser generado usando el plugin RTLer.
  • index.php: La plantilla principal. Si el tema proporciona sus propias plantillas, index.php debe estar presente.
  • comments.php: La plantilla de comentarios.
  • front-page.php: La plantilla de la página principal. Usala solo si usas una página estática como página principal.
  • home.php: La plantilla de página de inicio, la cual es la página principal por defecto. Si utiliza una página estática esta es la plantilla para la página con los últimos mensajes.
  • single.php: La plantilla de post único. Se utiliza cuando se consulta un solo post.
  • single-<post-type>.php: Esta plantilla es utilizada para mostrar una plantilla concreta para cada tipo de entrada o post.
  • page.php: Usada cuando se consulta una página individual.
  • category.php: Usada cuando una categoría es consultada.
  • tag.php: Usada cuando se pide una lista de entradas relacionadas con una etiqueta o tag.
  • taxonomy.php: Usada cuando se pide una lista de entradas relacionadas con un término o term de una taxonomía
  • author.php: Usada cuando se pide una lista de entradas escritas por un autor.
  • date.php: Usada cuando se pide un listado de entradas por fecha.
  • archive.php: La plantilla de archivo. Se utiliza cuando una categoría, autor o fecha es consultada. Tenga en cuenta que esta plantilla va a ser reemplazada por category.php, author.php y date.php por sus respectivos tipos de consulta.
  • search.php: Usada cuando se realiza un búsqueda.
  • attachment.php: Se visualiza cuando se muestra un archivo adjunto.
  • image.php: Se utiliza cuando se visualiza un archivo adjunto de imagen único. Si no está presente, attachment.php se utilizará.
  • 404.php: Se utiliza cuando WordPress no puede encontrar una entrada o página para la consulta realizada.

 

PLANTILLAS BÁSICAS

Lo archivos mínimos que debe contener un tema de WordPress son:

  • style.css
  • index.php
Lo habitual es que un tema contenga, además, los siguientes archivos:
  • comments.php
  • comments-popup.php
  • footer.php
  • header.php
  • sidebar.php

Symfony: La vista (II), ayudantes

0

Los ayudantes o helpers son funciones PHP que permiten agilizar ciertas tareas repetitivas, devuelven código HTML y se utilizan en las plantillas Por ejemplo:

<?php echo input_tag(‘nick’) ?> => <input type=”text” name=”nick” id=”nick” value=”” />

La función input_tag(nombre, valor) genera el código para crear un campo de texto de un formulario con sus atributos básicos (aunque se pueden añadir otros atributos como tercer parámetro en la función). Algunos helpers disponen de cierta inteligencia:

<?php echo auto_link_text(‘Por favor, visita nuestro sitio web www.ejemplo.com’) ?> => Por favor, visita nuestro sitio web <a href=”http://www.ejemplo.com”>www.ejemplo.com</a>

Los helpers deben ser declarados, ya que al ser funciones y no clases no se cargan directamente. Para declarar un helper se hace uso de la función use_helper(‘nombre_del_helper1’, ‘nombre_del_helper2’):

Esta plantilla utiliza un grupo de helpers específicos <?php use_helper(‘Text’) ?> … <h1>Descripción</h1> <p><?php echo auto_link_text($descripcion) ?></p>

Si se quieren añadir más helpers hay que seperarlos con comas. Los helpers pueden ser cargados automáticamente utilizando el archivo de configuración settings.yml. De los siete helpers existentes en Symfony, cuatro (Helper, Tag, Url y Asset) no se pueden eliminar del archivo de configuración, pero los otros tres (Partial, Cache, Form) sí.

Los siete helpers:

  • Helper: se necesita para incluir otros helpers (de hecho, la función use_helper() también es un helper
  • Tag: helper básico para etiquetas y que utilizan casi todos los helpers
  • Url: helpers para la gestión de enlaces y URL
  • Asset: helpers que añaden elementos a la sección <head> del código HTML y que proporcionan enlaces sencillos a elementos externos (imágenes, archivos JavaScript, hojas de estilo, etc.)
  • Partial: helpers que permiten incluir trozos de plantillas
  • Cache: manipulación de los trozos de código que se han añadido a la cache
  • Form: helpers para los formularios

Los helpers más habituales:

/ Grupo Helper
<?php use_helper(‘NombreHelper’) ?>
<?php use_helper(‘NombreHelper1’, ‘NombreHelper2’, ‘NombreHelper3’) ?>

// Grupo Tag
<?php echo tag(‘input’, array(‘name’ => ‘parametro’, ‘type’ => ‘text’)) ?>
<?php echo tag(‘input’, ‘name=parametro type=text’) ?> // Sintaxis alternativa para las opciones
=> <input name=”parametro” type=”text” />
<?php echo content_tag(‘textarea’, ‘contenido de prueba’, ‘name=parametro’) ?>
=> <textarea name=”parametro”>contenido de prueba</textarea>

// Grupo Url
<?php echo link_to(‘Pínchame’, ‘mimodulo/miaccion’) ?>
=> <a href=”/ruta/a/miaccion”>Pínchame</a> // Depende del sistema de enrutamiento

// Grupo Asset
<?php echo image_tag(‘miimagen’, ‘alt=imagen size=200×100’) ?>
=> <img src=”/images/miimagen.png” alt=”imagen” width=”200″ height=”100″/>
<?php echo javascript_include_tag(‘miscript’) ?>
=> <script language=”JavaScript” type=”text/javascript” src=”/js/miscript.js”></script>
<?php echo stylesheet_tag(‘estilo’) ?>
=> <link href=”/stylesheets/estilo.css” media=”screen” rel=”stylesheet” type=”text/css” />

Por último, existe una manera de acceder a los helpers desde otro punto de la aplicación que no sea una plantilla, mediante la función sfLoader::loadHelpers($helpers).

Ir arriba