‘php’

Ajustando el CSS de los nuevos comentarios de WordPress 2.7

4

En el post anterior ya vimos como crear y entender la estructura básica del comments.php; y si bien ya tenemos la armazón de nuestros comentarios, por sí sola no es nada amigable, por lo que en este artículo procederemos a darle estilo con CSS.

Para ello primero, basado en los estilos CSS de Chris Harrison, procederé a explicar cada una de las clases CSS de los nuevos comentarios de WordPress, para que tengan una noción básica de que hace cada uno.

ol.commentlist {} /* Estilos para la lista de comentarios */
ol.commentlist li {} /* CSS para cada elemento individual de la lista de comentarios */
ol.commentlist li.alt {} /* Alterna estilo de los elementos de lista */
ol.commentlist li.bypostauthor {} /* CSS para el comentario hecho por el autor de un post */
ol.commentlist li.byuser {} /* Estilos para cuando comenta un usuario registrado */
ol.commentlist li.comment {} /* Elementos individuales, el comentario en sí */
ol.commentlist li.comment div.vcard {} /* DIV que agrupa el avatar, nick y URL de cada comentario */
ol.commentlist li.comment div.vcard cite.fn {} /* Nombre del comentarista cuando este no deja URL */
ol.commentlist li.comment div.vcard cite.fn a.url {} /* Aplica cuando el comentarista deja la dirección de un sitio web */
ol.commentlist li.comment div.vcard img.avatar {} /* Para el avatar que se muestra en cada comentario */
ol.commentlist li.comment div.vcard span.says {} /* Da estilo a la frase "says" ó "dijo" en los comentarios */
ol.commentlist li.comment div.commentmetadata {} /* DIV donde se muestra la hora y fecha en la que se realizó la opinión */
ol.commentlist li.comment div.comment-meta {} /* Fecha del comentario */
ol.commentlist li.comment div.comment-meta a {} /* Lo mismo que arriba pero aplica si se muestra como enlace */
ol.commentlist li.comment * {} - (p, em, strong, blockquote, ul, ol, etc.) /* Listas, blockquotes y más en los comentarios */
ol.commentlist li.comment div.reply {} /* DIV del botón de respuesta a un comentarios especifico */
ol.commentlist li.comment div.reply a {} /* Estiliza los enlaces dentro del DIV Reply */
ol.commentlist li.comment ul.children {} /* Define la posición y otras cosas de la lista de comentarios anidados */
ol.commentlist li.comment ul.children li {} /* Para cada elemento de la lista de Child Comments */
ol.commentlist li.comment ul.children li.depth-2 {} /* Para cada nivel de anidación de comentarios */
ol.commentlist li.comment ul.children li.depth-3 {} /* Idem a arriba, tan sólo cambia el número */
ol.commentlist li.even {} /* Establece valores de las propiedades CSS de los comentarios pares */
ol.commentlist li.odd {} /* Establece valores de las propiedades CSS de los comentarios inpares  */
ol.commentlist li.parent {} /* Comentario padre de los Child Comments */
ol.commentlist li.pingback {} /* Estilo para elementos con trackbacks ó pingbacks */

Ok ya tenemos orientación, de igual forma faltan estilos para Pingbacks, no lo explico todo porque sería muy largo el post, pero siempre podrán consultar el enlace de arriba y tomar referencia de lo que ya tenemos.

No obstante la teoría no es nada si no hay un ejemplo práctico. Leer resto de la nota

Diseccionando el comments.php de WordPress 2.7

7

Adaptar los comentarios de un theme a la nueva versión de WordPress puede parecer complicado,  sobretodo porque a partir de la versión 2.7 la estructura es un poco más compleja y diferente.

Sin embargo luego te das cuenta que comments.php es bastante versátil y fácil de entender.threated-comments-wordpress

Pero  si no quieres gastar ese tiempo en estudiar dicho archivo, en Kernel Web te ahorramos el trabajo.

Ya que  a partir de este y otros artículos intentaré hacer una serie de tutoriales para entender, adaptar y ¿por qué no? modificar el comments.php de WordPress.

En este post, las partes comunes del nuevo archivo de comentarios de WP,  puede variar dependiendo el theme.

Previeniendo el acceso directo a comments.php

<?php /* Comentarios anidados, paginados y comentados por Kernel Web! */ ?>
			<div id="comments_wrapper">
<?php // No borres esto, previene el acceso directo al archivo comments.php y checa si un post tiene contraseña
    if (!empty($_SERVER['SCRIPT_FILENAME']) && 'comments.php' == basename($_SERVER['SCRIPT_FILENAME']))
        die ('Por favor no cargues esta pagina directamente. Gracias!')

Estas líneas  son las que se encargan de la seguridad de nuestro archivo, previenen el acceso directo a comments.php para que si por error alguien intentase acceder directamente se le muestre un mensaje de error. Leer resto de la nota

3 formas de aumentar los suscritos al RSS usando WordPress

2

Lo sé, hay muchas listas de este tipo, pero no pretendo ser una más y esta tiene algo en particular, usa el poder de WordPress.

Siempre he sido de la idea de que la base de un buen blog es su contenido y es este el que te brinda credibilidad y audiencia, así que luego sólo queda usar este para incrementar tus suscritos al RSS fidelizando al lector ocasional o esporádico.rss-increase

¿Cómo? 2 cosas, mensaje claro y exposición.

Escenarios y objetivo :  el segundo es obvio (convertir visitantes a lectores) el primero lo dividiremos en 3 casos:

Caso 1: el usuario llega, lee un artículo, le gusta, revisa el sitio y da un click a la paginación del blog.

Caso 2: contempla al usuario que sólo le interesa un topic de tu sitio.

Caso 3: se centra en aquel usuario que llega de los buscadores o de algun blog amigo y sólo va a leer un post.

Los métodos: Como dijé vamos a usar WordPress, así que plugins y tags condicionales son las herramientas indicadas para solventar cada caso: Leer resto de la nota

3 tecnicas para hacer tu sidebar WordPress unica

6

La sidebar sin duda es la zona mas versatil y llamativa de cualquier theme WordPress y donde podemos expresar toda nuestra creatividad, sin olvidarnos de la usabilidad claro esta.

Es por ello que hoy les presento 3 tecnicas para que puedan crear en su actual o futuro theme WordPress una sidebar única y darle a su proyecto un aire fresco en su diseño:

Crear un Dropdown Blogroll sin Javascript

blogrolldrop

Idea de Michael Martin, gran diseñador y blogger de Pro Blog Design, es un tecnica que usa CSS para crear un bello dropdown blogroll sin necesidad de JavaScript.

Posts Recientes con efecto Newsticker

newsticker

Hace un tiempo escribí al menos 3 formas para mostrar posts recientes en WordPress con PHP, sin embargo si lo suyo es ser más dinámicos y lo estático les aburre desde PVM Garage, gran blog que vengo siguiendo hace un tiempo y que recomiendo, nos acercan un método que usa Jquery para crear un efecto newsticker e implementarlo a nuestros posts recientes, de modo que estos roten de abajo para arriba cada corto tiempo.

Mostrar y esconder Widgets con Jquery

hidden-widget

Tiene un tiempo pero no por eso deja de ser asombroso; Austin de WPCult nos muestra como usar Jquery para esconder o mostrar los widgets de la sidebar a pedido de los visitante y un click de distancia, inperdible, yo ya estoy pensando en implementar algunas en Kernel Web.

 Página 1 de 2  1  2 Siguiente »