K2 y su relacion con los Asides

Bueno este tema surgio por un correo que recibi de Drita y una duda sobre los Asides en K2. Asi que para responder a su duda y de paso dejar esta informacion que podria ser de utilidad para alguien mas, prosigo a comentar lo siguiente.

Ya habia expresado antes mi opinion acerca de K2 y como es uno de los temas mas completos, pues soporta una serie de hacks y plugins que facilitan la vida de los muchos bloggers que habitan por ahi.

Entre esos hacks se encuentran los Asides de Matt, estos pueden ser habilitados desde el mismo admin de WordPress a traves de la pagina de opciones de K2 [Presentation > K2 Options]

K2 Options > Asides

K2 nos permite elegir donde mostrar nuestros Asides, Inline Asides los muestra dentro del flujo normal de nuestro contenido, como una entrada mas del blog, mientras que Sidebar Asides, como su nombre lo dice, los mostrara en el sidebar de nuestro sitio.

Ademas de esto tenemos que elegir que categoria utilizaremos para nuestros asides. Yo por mi parte recomiendo crear una categoria especial para almacenar este tipo de entradas, en este caso uso una categoria llamada notas. Una vez que eligamos una categoria los Asides seran activados.

Otro tercer parametro es el numero de Asides que se mostraran, esto solo aplica cuando hemos elegido que los Asides se muestren en nuestro Sidebar.

Hasta aqui es todo lo necesario para activar esta caracteristica.

Me interesa la version original

Sin embargo K2 tiene su manera particular de mostrar los Asides, haciendo uso de divs, en lugar del el enfoque original que hace uso de listas no ordenadas.

Cual es la diferencia? Por la manera en que K2 esta esta estructurado, los asides se presentan de una manera muy similar a los posts normales, mientras que el enfoque original hace un manejo mas sencillo de estos, simplemente como notas al margen, con un permalink y un link discreto para los comentarios. Si esto ultimo es lo que estas buscando, he aqui la manera de conseguirlo.

El siguiente paso requerira jugar un poco con el codigo de K2, mas especificamente el codigo que se encuentra en ‘theloop.php’, por lo que tener un respaldo de este archivo es mas que recomendable. Este archivo lo podemos encontrar en la ruta wp-content/themes/tufolderk2/theloop.php

Para aquellos que no se sientan seguros editando su codigo, pondre el archivo para descarga con las modificaciones basado en el theme K2 beta two al final de esta entrada.

En el editor de nuestra preferencia, abrimos el archivo y buscamos las siguientes lineas de codigo. Lo dividire en 3 bloques para hacerlo lo mas entendible posible.

<?php /* Asides -- Pick a category to be an 'aside' in the K2 options panel */
		/* On archive pages, show asides inline no matter what */ if (is_archive() or is_search()) { $k2asidescheck = '0'; } else { $k2asidescheck = get_option('k2asidesposition'); }
		$k2asides = get_option('k2asidescategory'); if (($k2asides != '0') && (in_category($k2asides) && ($k2asidescheck != '1'))) { ?>

En este primer bloque encontramos las condiciones que se deben de cumplir para que K2 muestre los asides en nuestro blog. Las condiciones son:

  • Si nos encontramos en la pagina de archivo o busqueda, los asides se muestran tipo inline, no importando que hayamos elegido en las opciones.
  • De lo contrario, si nos encotramos en cualquier otra pagina, digamos el index, K2 verifica que posicion elegimos para los asides.
  • K2 verifica si los asides estan activos, ademas de que categoria elegimos y asi empieza su tarea de desplegarlos.
<div id="post-<?php the_ID(); ?>" class="item aside">
				<div class="itemhead">
					<h3><a href="<?php the_permalink() ?>" rel="bookmark" title='Permanent Link to "<?php the_title(); ?>"'><?php the_title(); ?></a></h3>

					<!-- The following two sections are for a noteworthy plugin currently in alpha. They'll get cleaned up and integrated better -->
					<?php foreach((get_the_category()) as $cat) {  if ($cat->cat_name == 'Noteworthy') { ?>
						<span class="metalink favorite"><img src="<?php bloginfo('template_url'); ?>/images/favorite.gif" alt="Favorite Entry"></a></span>
					<?php } } ?>

					<?php /* Support for noteworthy plugin */ if (function_exists(nw_noteworthyLink)) { ?><span class="metalink"><?php nw_noteworthyLink($post->ID); ?></span><?php } ?>

					<?php edit_post_link('<img src="'.get_bloginfo(template_directory).'/images/pencil.png" alt="Edit Link" />','<span class="editlink">','</span>'); ?>

					<small class="metadata">
						<?php comments_popup_link('0 <span>Comments</span>', '1 <span>Comment</span>', '% <span>Comments</span>', 'commentslink', '<span class="commentslink">Closed</span>'); ?>

						<span class="chronodata">Published <?php /* If there is more than one author, show author's name */ $count_users = $wpdb->get_var("SELECT COUNT(*) FROM $wpdb->usermeta WHERE '".$table_prefix."user_level' > 1"); if ($count_users > 1) { ?> by <?php the_author_posts_link(); } ?>
						<?php /* If 'Dunstan's Time Since' plugin is installed use it; else use default. */ if (function_exists('time_since')) { echo time_since(abs(strtotime($post->post_date_gmt." GMT")), time()); gt; ?> ago<?php } else { the_time('F jS, Y') ?><?php } ?></span>

						<?php if (is_single() && function_exists(UTW_ShowTagsForCurrentPost)) { ?>
							<span class="tagdata">Tags: <?php UTW_ShowTagsForCurrentPost("commalist") ?>.</span>
						<?php } ?>
					</small>
				</div>

				<div class="itemtext">
					<?php the_content("Continue reading '" . the_title('', '', false) . "'"); ?>
				</div>

			</div>

Este es el codigo encargado de desplegar nuestros asides.
Por cuestiones de tiempo y espacio no explicare la funcion de todo este bloque de codigo, sin embargo es este el codigo que reemplazaremos en su totalidad.

<?php  /* Normal Entries */ } elseif (!(in_category($k2asides))) { ?>

Esta linea indica el final de los asides y el inicio de los posts normales. Esta linea debe permanecer.

11 Comments

  1. Posted March 2, 2006 at 4:07 pm | Permalink

    Oh, genial

    Reply to [ABX]

  2. Posted March 2, 2006 at 4:10 pm | Permalink

    dios mio, llevo meses buscando que alguien explique las cosas como dios manda, o sea, así ^_^

    Ya estoy metiendo mano a mi blog
    En breve tendrás noticias mias

    De verdad un post excelente , magnífico. Perfectamente entendible incluso para los más primerizos. Gracias por compartirlo :D

    Un saludo!

    Reply to DriTa

  3. Posted March 2, 2006 at 4:20 pm | Permalink

    Lo siento, pequeño error que tiene mi spellbound para Firefox 1.5 al parecer me hace invisibles las letras, espero lo puedas editar.

    Solo daba las gracias por el excelente tutorial, creo que el método clásico es mucho mejor que el que trae el K2. En cuanto pueda lo implemento y hago la entrada correspondiente al tutorial.

    Reply to [ABX]

  4. Posted March 2, 2006 at 5:01 pm | Permalink

    implementados los asides ;) Lo unico q estoy ahora es peleándome con el CSS!! no consigo darles formato! xDD Tube un dia ajetreado de viaje. Mañana me pondré con ello y seguiré informando por aquí.

    Gracias de nuevo!

    Reply to DriTa

  5. Posted March 3, 2006 at 8:37 am | Permalink

    Muchas gracias por sus comentarios, me alegra que esta informacion les sea de utilidad.

    Drita, parece que encontre el problema, este es el codigo actual de tu sitio.
    <ul class=�asides�>
            <li id=�p299�>
            prueba 5         <a href=�http://mocasin.ionosfera.com/?p=299� rel=�bookmark� title=�Permanent Link to � rel=”nofollow”>#</a>

    Parece que las comillas y apostrofes en el codigo de tus asides han sido reconocidos como un caracter desconocido. Si copiaste el codigo directamente de la pagina te recomiendo que reemplaces tus comillas y apostrofes del codigo, ya que el font del codigo lo representa de manera diferente. O bien puedes bajar el zip y copiarlo directamente de ahi. Eso debera resolver tus problemas con el CSS.

    No estaba al tanto de esa cuestion, pronto hare las debidas correcciones.

    Reply to Daniel

  6. Posted March 6, 2006 at 4:21 pm | Permalink

    hola Daniel. Lo que me comentabas de las comillas me paso al ppio, cdo pasé la plantilla pero parece ser q alguien me iluminó y yo solita deduje que ahí estaba el problema! (ni me lo creía!! xDD)

    Sin embargo sigo teniendo dificultades con el CSS. Mis asides parece q tienen vida propia!! jaja Tienen su propio style y no sé dónde se esconden!

    Ains…que de quebradero de cabeza para un minipost!! xDD

    Reply to DriTa

  7. Posted March 6, 2006 at 4:57 pm | Permalink

    Jeje, no te preocupes, me ha pasado.. bueno lo que puedes hacer es agregar este codigo de CSS.

    ul.asides li{
    color: #FFFFFF;
    font-size: 1.1em;
    word-spacing: 0.05em;
    line-height: 1.5em;
    }

    con el elemento li podras especificar un formato especifico para cada elemento de tu lista, en este caso de tu clase asides.

    Espero que eso sea lo que estes buscando. ;)

    Reply to Daniel

  8. Posted March 6, 2006 at 6:26 pm | Permalink

    nada xD esto es impresionante, por más q escribo lo que me dices no hay dios que cambie los asides…lo que yo te diga…tienen autonomía propia!! xDD

    ¿No hay que colocarlo en un lugar especifico del style.css verdad? No vaya a ser que no lo esté poniendo dnd debiera XD

    Reply to DriTa

  9. Posted March 7, 2006 at 8:34 am | Permalink

    @Drita: Parece que aun tienes algunos caracteres desconocidos donde deberian ir las comillas que encierran tus clases, debe ser por eso que el CSS no esta afectando tus elementos.

    <ul class=�asides�>
            <li id=�p323�>
    </code>

    Solo hay que reemplazar esos carecteres extraños por comillas.

    Reply to Daniel

  10. Posted March 7, 2006 at 9:04 am | Permalink

    por fin!! he conseguido manejarlos! bueno mas o menos! xDD Efectivamente seguia teniendo problemas con las comillas y x eso no iba..estás en todo! :P:P:P

    Gracias!

    Reply to DriTa

  11. Posted March 7, 2006 at 9:36 am | Permalink

    No hay de que Drita, me alegra que haber sido de ayuda en tu lucha por dominar esos asides. ;)

    Reply to Daniel

2 Trackbacks

  1. By Asides -Minipost en tu blog- at CoTTonMouTh on March 4, 2006 at 1:11 pm

    [...] Tras investigar desinteresadamente sobre el tema, escribió este magnífico tutorial sobre cómo implementar los asides en el theme k2, perfectamente comprensible, con screenshoots, y paso a paso, teniendo en cuenta que no todos entendemos del mundo html ^^O. [...]

    Reply to Asides -Minipost en tu blog- at CoTTonMouTh

  2. [...] El K2 es uno de los temas más completos y completos, con un buen número de plugins integrados para nuestra comodidad y un menú muy sencillo para su configuración. Sin embargo, el método clásico de Asides propuesto del K2 es un poco distinto a lo propuesto originalmente por Matt. El tema los presenta como posts normales, pero con un título de menor tamaño. Por suerte, Daniel se ha encargado de hacer un excelente tutorial para cambiar este pequeño detalle si así lo deseamos. Es excelente para hacer pequeñas entradas con noticias y es muy sencillo darle formato. Espero les sea tan útil como a mí. [...]

    Reply to Cambiando el formato de los Asides en el K2 at Netsphere Blogger

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*