Mostrando resultados del 1 al 10 de 10
Like Tree2Me agrada
  • 2 Post por Mario

Tema: Cómo tomar ventaja de la sidebar en Wordpress

  1. #1
    Avatar de Mario
    Mario está desconectado Usuario Delta
    Registro
    18-marzo-2010
    Ubicación
    Salt Lake City
    Edad
    23
    Mensajes
    529
    CMS
    CMS Utilizado
    Ir a Mario página de inicio Mi Twitter Mi Facebook
    Este es un artículo que escribí hace tiempo para Nettuts pero por errores gramaticales en la versión en inglés no fue publicado, así que mejor lo publiqué en mi propio sitio, lo acabo de traducir al español y aunque no voy a copiarlo y pegarlo aqui por obvias razones (además de que es muy largo) les puedo dejar algunas muestras rápidas.

    Sólo para que sepan los "--------------------" significan que había más texto de por medio, por eso no tiene mucho sentido.

    Las barras laterales, sidebars en los blogs muchas veces son poco estimadas, y usualmente ves la misma sidebar en cada una de las páginas de un blog, creo que eso es sólo un desperdicio de espacio. Pero cuando se usa apropiadamente, puedes convertir tu aburrida sidebar en una ¡sidebar assesina!
    -------------------------

    Agregar botones sociales

    ¡Se ve bien! Ahora hay que agregar algunos botones sociales como Twitter y Facebook, Yo estoy utilizando este set de iconos.

    Aquí en el theme por defecto no tengo mucho espacio, así que sólo agregaré botones de Twitter y Facebook, pero si quieren agregar más, es más o menos lo mismo.

    Agregar un botón de Facebook es fácil porque sólo necesitas compartir la URL, sólo hay que pegar este código en la sidebar.

    Código HTML:
    <a href="http://www.facebook.com/share.php?u=<?php the_permalink(); ?>" rel="nofollow" target="_blank">
        <img src="<?php bloginfo('template_url'); ?>/images/facebook.png" alt="Share on Facebook" width="64px"/></a>
    Twitter, por otro lado, es un poco complicado porque quieres hacer saber a tus seguidores lo que estás compartiendo, así que tienes que agregar el título, entonces, cuando sólo tienes 140 caracteres a tu disposición, no puedes enviar la URL completa junto con el título, por lo tanto, necesitas una URL corta.

    Hay muchos servicios que acortan direcciones, e incluso puedes crear el tuyo propio, pero por ahora puedes usar servicios como tinyurl o bit.ly si prefieres.

    --------------------

    Usando bit.ly

    Yo prefiero utilizar bit.ly porque te permite mantener un registro de tus direcciones acortadas, y es todavía más corto que tinyurl.

    Lo primero que necesitas es registrarte en bit.ly, y entonces tendrás acceso a una API key", de nuevo, pega este código en tu archivo functions.php.

    Código PHP:
    //crear bit.ly url
    function bitly()
    {
        
    //Información de Login
        
    $url get_permalink();  //genera el permalink de wordpress
        
    $login '';    //coloca tu nombre de usuario de bit.ly
        
    $apikey ''//tu apikey
        
    $format 'json';    //elige entre json o xml
        
    $version '2.0.1';
        
    //crear la URL
        
    $bitly 'http://api.bit.ly/shorten?version='.$version.'&longUrl='.urlencode($url).'&login='.$login.'&apiKey='.$apikey.'&format='.$format;
        
    //recibe la url
        //también se puede usar cURL acá
        
    $response file_get_contents($bitly);
        
    //parse depending on desired format
        
    if(strtolower($format) == 'json')
        {
            
    $json = @json_decode($response,true);
            echo 
    $json['results'][$url]['shortUrl'];
        }
        else 
    //xml
        
    {
            
    $xml simplexml_load_string($response);
            echo 
    'http://bit.ly/'.$xml->results->nodeKeyVal->hash;
        }

    --------------------

    Usando tu propio dominio v2.0

    Utilizando el código anterior, y agregando un poco de redirección 301 a nuestro archivo .htaccess podemos deshacernos del “?p=“ ahorrando tres preciosos caracteres.

    En el código anterior, borra “?p=“ para que quede así:

    Código HTML:
    <a href="http://www.twitter.com/home?status=<?php twitle(the_title('','',false)); ?>+<?php bloginfo('url') ?>/<?php echo $post->ID; ?>" rel="nofollow" target="_blank">
        <img src="<?php bloginfo('template_url'); ?>/images/twitter.png" alt="Tweet me!"/>
    </a>


    --------------------

    Añadiendo más artículos de la misma categoría

    Ahora agreguemos más artículos de la misma categoría que estamos leyendo (queremos que el lector se quede el mayor tiempo posible en el blog ¿cierto?)

    Tomé esta función (bueno, no era una función cuando la tomé) del Agregado Theme (que por cierto, de verdad sabe como tomar ventaja de su sidebar), agrega el primer código en el archivo functions.php, y el segundo en el archivo sidebar-single.php.

    Código PHP:
    <?php
    function get_more_category() {      
        global 
    $post;
        
    $categories get_the_category(); // Tomamos las categorías
        
    foreach ($categories as $category) : //comenzamos un loop
            
    $posts get_posts('numberposts=3&exclude='.$post->ID.'&category='$category->term_id);
    // regresa 3 artículos de la misma categoría pero excluye el que estamos viendo.
            
    if(count($posts) > 1) {
    ?>
            <h2>M&acute;s <em>en</em> '<?php echo $category->name?>':</h2>
                <p><ul>
                    <?php foreach($posts as $post) : ?>
                <li><a href="<?php the_permalink(); ?>"<?php the_title(); ?></a></li>
                    <?php endforeach; ?>
                </ul></p>
            <?php 
        endforeach;
    }
    Código PHP:
    <?php get_more_category(); // Llamamos a la función ?>
    --------------------

    Mostrar comentarios recientes

    Los Blogs son todo sobre la comunidad, así que queremos que nuestros lectores hagan muchos comentarios, pero son tímidos, necesitan saber que algún otro chico genial lo hizo antes que ellos. Para hacer que esto suceda, necesitamos mostrar una lista con los comentarios más recientes de nuestro blog.

    Pega el siguiente código en el archivo functions.php (perdón pero en serio no recuerdo de donde lo tomé, estaba en mi archivo de funciones):

    Código PHP:
    <?php
    function recent_comments($comm 5) {
          global 
    $wpdb;
      
    $sql "SELECT DISTINCT ID, post_title, post_password, comment_ID, comment_post_ID, comment_author, comment_date_gmt, comment_approved, comment_type,comment_author_url, SUBSTRING(comment_content,1,30) AS com_excerpt FROM $wpdb->comments LEFT OUTER JOIN $wpdb->posts ON ($wpdb->comments.comment_post_ID = $wpdb->posts.ID) WHERE comment_approved = '1' AND comment_type = '' AND post_password = '' ORDER BY comment_date_gmt DESC LIMIT $comm"
      
    $comments $wpdb->get_results($sql);
      
    $output $pre_HTML;
      
    $output .= "\n<ul class=\"recentcomments\">";
      foreach (
    $comments as $comment) {
        
    $output .= "\n<li><strong>".strip_tags($comment->comment_author) ."</strong> <em>on</em> " "<a href=\"" get_permalink($comment->ID)."#comment-" $comment->comment_ID "\" title=\""strip_tags($comment->com_excerpt). "\">".$comment->post_title ."</a></li>";
      }
      
    $output .= "\n</ul>";
      
    $output .= $post_HTML;
      echo 
    $output;
    }
    Ahora colocamos esto en la sidebar:

    Código PHP:
    <?php recent_comments(); ?>
    --------------------

    Resultado





    Si quieren ver el tutorial completo con todos los códigos que utilicé (y el que tiene sentido) pasen por acá.
    garlock y EstebanS les agrada esto.
    ¡No uso msn! Cualquier cosa pídeme mi correo
    Mi blog personal (made in my cantón)
    Mi portafolio online

  2. #2
    Avatar de Nachitox
    Nachitox esta en línea ahora Usuario Dseta
    Registro
    15-noviembre-2009
    Ubicación
    Los Ángeles - Chile
    Mensajes
    1.132
    CMS
    CMS Utilizado
    gracias amigo, me llevo el de agregar mas posts de la misma categoria.

  3. #3
    Avatar de José Jiménez
    José Jiménez esta en línea ahora Usuario Dseta
    Registro
    07-junio-2010
    Ubicación
    Colima, México
    Edad
    19
    Mensajes
    1.212
    CMS
    CMS Utilizado
    Ir a José Jiménez página de inicio Mi Twitter
    Demasiado bueno el post, dedito verde
    Sigueme en Twitter @custoc - Social Media, Marketing, tips y otros asuntos.

  4. #4
    Avatar de Bloguitar
    Bloguitar está desconectado Usuario Beta
    Registro
    31-enero-2011
    Edad
    24
    Mensajes
    31
    Mi Twitter
    ¡Hola! Es mi primer mensaje en el foro, solo quería decir que es el primer post que leo y llevaba buscando algo así mucho tiempo. ¡Muchas gracias!

  5. #5
    Avatar de Yanela
    Yanela está desconectado Usuario Alfa
    Registro
    17-enero-2011
    Mensajes
    18
    muy bueno tu aporte, gracias

  6. #6
    Avatar de Geilin Vargas
    Geilin Vargas esta en línea ahora Usuario Epsilon
    Registro
    12-julio-2011
    Edad
    29
    Mensajes
    1.372
    Eso era antes de panda ahora las redirecciones y el uso de acortadores como bit.ly son penalizados.

  7. #7
    Avatar de Zetta
    Zetta esta en línea ahora Usuario Gamma
    Registro
    27-agosto-2011
    Ubicación
    En la nube
    Mensajes
    331
    CMS
    CMS Utilizado
    Quede colgado en la parte de ahorrar los 3 caracteres
    Código HTML:
    ?p=
    Faltó la redireccion del .htaccess. Podrías ponerlo?
    Se agradece el buen aporte
    Buscando hacer nuevos amigos en el foro!

  8. #8
    Avatar de frN13
    frN13 está desconectado Usuario Epsilon
    Registro
    10-octubre-2010
    Mensajes
    772
    CMS
    CMS Utilizado
    Ir a frN13 página de inicio Mi Twitter Mi Facebook Mi Google+
    la pagina que dejaste no funca.

  9. #9
    Avatar de Niell
    Niell está desconectado Usuario Gamma
    Registro
    21-marzo-2011
    Ubicación
    Lima
    Mensajes
    176
    CMS
    CMS Utilizado
    gracias por el aporte.

  10. #10
    Avatar de etnos
    etnos esta en línea ahora Usuario Epsilon
    Registro
    26-abril-2009
    Edad
    24
    Mensajes
    797
    Ir a etnos página de inicio
    Cita Iniciado por frN13 Ver Mensaje
    la pagina que dejaste no funca.
    La url correcta es: Cómo tomar ventaja de la Sidebar en WordPress - Studio Aguiar
    Busco intercambios de enlaces (cruzados) para blog de chistes.
    Interesados mandadme un MP.

Información del tema

Users Browsing this Thread

Actualmente hay 1 usuarios leyendo este tema. (0 miembros y 1 invitados)

Temas Similares

  1. como tomar la medida de la pagina para crear un background
    Por Miguel De Leon en el foro Themes
    Respuestas: 3
    Último mensaje: 17-ene-2011, 07:59
  2. ¿Como modificar sidebar?
    Por FabricioV en el foro Themes
    Respuestas: 5
    Último mensaje: 24-jul-2010, 17:12
  3. Ayuda con la sidebar de mi tema wordpress
    Por José Jiménez en el foro Themes
    Respuestas: 0
    Último mensaje: 17-jul-2010, 11:07
  4. Que ventaja implica tener un dominio .me
    Por contorbery en el foro Registro de Dominios
    Respuestas: 14
    Último mensaje: 22-feb-2010, 15:59

Normas de Publicación

  • No puedes crear nuevos temas
  • No puedes responder mensajes
  • No puedes subir archivos adjuntos
  • No puedes editar tus mensajes
  •