[ un desarrollo de PATAGONIA CREATIVE ]

Archivos en Categoria: php

  • php | WordPress

    04 /11 / 2009 - 12:47 am

    Publicado por Nikko.

    • 15
    • 2.560

    Social Link

    Mostrar actividad de Usuarios Registrados en wordpress

    usuariosregistrados.jpg

    Si permiten el registro de usuarios en sus blogs, no sería mala idea al igual que los portales web, mostrar una lista detallada de los últimos usuarios registrados. Claro que wordpress no tiene una función específica para esto, pero wprecipes nos brinda una simple solución. Leer MAS →

  • Open Source | php

    12 /09 / 2009 - 12:22 am

    Publicado por Nikko.

    • 15
    • 2.353

    Social Link

    Pubwich – Instant Website

    pubswith.jpg

    Pubwich una práctica aplicación PHP open-source desarrollada para los fanáticos de las redes sociales, ya que esta permite agregar todos los datos publicados en varios sitios web y servicios sociales, en una sola página HTML que contendrá todas aquellas actualizaciones que generes en los diversos sitios. Pubwich es un proyecto de código abierto, lo que significa que cada uno puede navegar por su código fuente, modificarlo para que se adapte a las necesidades que creas conveniente, además de ayudar a la aplicación compartiendo todas tus modificaciones con otras personas. Además de la capacidad para mostrar el contenido de cualquier sitio web a través de feeds RSS / Atom, soporta servicios web populares como: Delicious , Facebook, Flickr ,last.fm, ReaderNaut, Twitter, Vimeo, Youtube, entre otros. Pubwich sólo necesita ejecutarse en un servidor Apache con PHP 5 y PEAR instaladas.

    Enlace  PubwichDemo 1Demo 2

    Via  webresourcesdepot

    what kind of could a type individual help a year if you are establishing
    lous vuitton speedy Who Is The Greatest Fashion Designer

    BLACK AND GREEN OLIVE TAPENADE
    Isabel Marant SneakerWhat I Want To Say About Celebrity Evening Dresses

  • Contenido deslizante con Auto-Reproducción

    contslider.jpg

    Auto playing featured Content Slider, una divertida forma para mostrar gran cantidad de contenido en una pequeña área. Estaremos usando XHTML / CSS para la construcción y el estilo de widgets. Junto con las librerías jQuery y Coda Slider plugin para los efectos de animación. Este featured Content Slider, posee un contenido principal (grupos), que se desliza de izquierda a derecha mostrando cada uno de ellos un contenido único. Hay enlaces que actúan como menú de navegación que nos permitirá saltar rápidamente a cualquier grupo en particular. Estos vínculos pueden estar formados por hipervínculo de texto, miniatura, etc.

    • Diferentes tipos de contenido personalizado en los paneles. Se puede poner lo que queramos en los paneles, pero para que sea más fácil para nosotros mismos, habrá un par de diferentes formatos a respetar. Una imagen de fondo cubriéndolo por completo, pero con una superposición de textos.
    • Auto-play. Podemos hacer click en los paneles para saltar a cada grupo especifico, o dejar que las transiciones se produzcan de forma automática.
    • Flecha indicador. Sirve como indicador visual para resaltar el panel que estamos viendo actualmente, algo así como una pequeña flecha sobre las miniaturas que apunta en el panel.

    Ver demo - Mas informacion y descarga Auto playing featured Content Slider – By css-tricks
    Instalacion:

    1. <script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
    2.     <script type="text/javascript" src="js/jquery-easing-1.3.pack.js"></script>
    3.     <script type="text/javascript" src="js/jquery-easing-compatibility.1.2.pack.js"></script>
    4.     <script type="text/javascript" src="js/coda-slider.1.1.1.pack.js"></script>
    5.     <script type="text/javascript">
    6.         var theInt = null;
    7.         var $crosslink, $navthumb;
    8.         var curclicked = 0;
    9.         theInterval = function(cur){
    10.             clearInterval(theInt);
    11.             if( typeof cur != 'undefined' )
    12.                 curclicked = cur;
    13.             $crosslink.removeClass("active-thumb");
    14.             $navthumb.eq(curclicked).parent().addClass("active-thumb");
    15.                 $(".stripNav ul li a").eq(curclicked).trigger('click');
    16.             theInt = setInterval(function(){
    17.                 $crosslink.removeClass("active-thumb");
    18.                 $navthumb.eq(curclicked).parent().addClass("active-thumb");
    19.                 $(".stripNav ul li a").eq(curclicked).trigger('click');
    20.                 curclicked++;
    21.                 if( 6 == curclicked )
    22.                     curclicked = 0;
    23.             }, 3000);
    24.         };
    25.         $(function(){
    26.             $("#main-photo-slider").codaSlider();
    27.             $navthumb = $(".nav-thumb");
    28.             $crosslink = $(".cross-link");
    29.             $navthumb
    30.             .click(function() {
    31.                 var $this = $(this);
    32.                 theInterval($this.parent().attr('href').slice(1) - 1);
    33.                 return false;
    34.             });
    35.             theInterval();
    36.         });
    37.     </script>

    Agregando estilo

    1. /*
    2.     SLIDER
    3. */
    4. .slider-wrap                                { width: 419px; position: absolute; top: 87px; left: 40px; }
    5. .stripViewer .panelContainer
    6. .panel ul                          { text-align: left; margin: 0 15px 0 30px; }
    7. .stripViewer                                { position: relative; overflow: hidden; width: 419px; height: 285px; }
    8. .stripViewer .panelContainer                { position: relative; left: 0; top: 0; }
    9. .stripViewer .panelContainer .panel   { float: left; height: 100%; position: relative; width: 419px; }
    10. .stripNavL, .stripNavR, .stripNav        { display: none; }
    11. .nav-thumb        { border: 1px solid black; margin-right: 5px; }
    12. #movers-row      { margin: -43px 0 0 62px; }
    13. #movers-row div     { width: 20%; float: left; }
    14. #movers-row div a.cross-link             { float: right; }
    15. .photo-meta-data                            { background: url(images/transpBlack.png); padding: 10px; height: 30px;
    16.                                               margin-top: -50px; position: relative; z-index: 9999; color: white; }
    17. .photo-meta-data span            { font-size: 13px; }
    18. .cross-link      { display: block; width: 62px; margin-top: -14px;
    19.                                               position: relative; padding-top: 15px; z-index: 9999; }
    20. .active-thumb                { background: transparent url(images/icon-uparrowsmallwhite.png) top center no-repeat; }

    Contenido

    1. <div class="slider-wrap">
    2.     <div id="main-photo-slider" class="csw">
    3.         <div class="panelContainer">
    4.             <div class="panel" title="Panel 1">
    5.                 <div class="wrapper">
    6.                     <!-- REGULAR IMAGE PANEL -->
    7.                     <img src="images/tempphoto-1.jpg" alt="temp" />
    8.                     <div class="photo-meta-data">
    9.                         Photo Credit: <a href="http://flickr.com/photos/astrolondon/2396265240/">Kaustav Bhattacharya</a><br />
    10.                         <span>"Free Tibet" Protest at the Olympic Torch Rally</span>
    11.                     </div>
    12.                 </div>
    13.             </div>
    14.             <div class="panel" title="Panel 2">
    15.                 <div class="wrapper">
    16.                     <!-- PANEL CONTENT -->
    17.                 </div>
    18.             </div>
    19.             <div class="panel" title="Panel 3">
    20.                 <div class="wrapper">
    21.                     <!-- EXAMPLE OF OTHER PANEL POSSIBILITIES -->
    22.                     <img src="images/scotch-egg.jpg" alt="scotch egg" class="floatLeft"/>
    23.                     <h1>How to Cook a Scotch Egg</h1>
    24.                     <ul>
    25.                         <li>6 hard-boiled eggs, well chilled (i try to cook them to just past soft boiled stage, then stick them in the coldest part of the fridge to firm up)</li>
    26.                         <li>1 pound good quality sausage meat (i used ground turkey meat, seasoned with sage, white pepper, salt and a tiny bit of maple syrup)</li>
    27.                         <li>1/2 cup AP flour</li>
    28.                         <li>1-2 eggs, beaten</li>
    29.                         <li>3/4 cup panko-style bread crumbs</li>
    30.                         <li>Vegetable oil for frying</li>
    31.                     </ul>
    32.                 </div>
    33.             </div>
    34.             <div class="panel" title="Panel 4">
    35.                 <div class="wrapper">
    36.                     <!-- PANEL CONTENT -->
    37.                 </div>
    38.             </div>
    39.             <div class="panel" title="Panel 5">
    40.                 <div class="wrapper">
    41.                     <!-- PANEL CONTENT -->
    42.                 </div>
    43.             </div>
    44.             <div class="panel" title="Panel 6">
    45.                 <div class="wrapper">
    46.                     <!-- PANEL CONTENT -->
    47.                 </div>
    48.             </div>
    49.         </div>
    50.     </div>
    51.     <!-- TO MAKE THESE THUMBNAILS ACTUALLY WORK, BOTH THE HASH VALUE (#1, ETC.)
    52.           AND THE CLASS="CROSS-LINK" ARE REQUIRED -->
    53.     <a href="#1" class="cross-link active-thumb"><img src="images/tempphoto-1thumb.jpg" class="nav-thumb" alt="temp-thumb" /></a>
    54.     <div id="movers-row">
    55.         <div><a href="#2" class="cross-link"><img src="images/tempphoto-2thumb.jpg" class="nav-thumb" alt="temp-thumb" /></a></div>
    56.         <div><a href="#3" class="cross-link"><img src="images/tempphoto-3thumb.jpg" class="nav-thumb" alt="temp-thumb" /></a></div>
    57.         <div><a href="#4" class="cross-link"><img src="images/tempphoto-4thumb.jpg" class="nav-thumb" alt="temp-thumb" /></a></div>
    58.         <div><a href="#5" class="cross-link"><img src="images/tempphoto-5thumb.jpg" class="nav-thumb" alt="temp-thumb" /></a></div>
    59.         <div><a href="#6" class="cross-link"><img src="images/tempphoto-6thumb.jpg" class="nav-thumb" alt="temp-thumb" /></a></div>
    60.     </div>
    61. </div>

    Ver demo – Mas informacion y descarga Auto playing featured Content Slider – By css-tricks

    and got in on curvy conversations with The Curvy Fashionista
    woolrich jassen No Abrams for Trek 3

    our third consecutive year of adding over
    Chanel ShoesDirections to Recognize if Your Louis Vuitton is Authentic or Not

  • Dar estilo a tus Comentarios WordPress

    commentsestilo.jpg

    Si piensas rediseñar por completo tu blog, no estaría nada mal, dedicar tiempo a elaborar cosas creativas para los comentarios de tu blog. Partiendo de esa idea, encuentro en darrenhoyt, algunos prácticos ejemplos que podrás utilizar como base, donde se incluyen inclusive ejemplos de códigos y la posibilidad de los PSD originales.
    Ampliar info y mas ejemplos Styling Your WordPress Comments
    Lo primero será, editar tu archivo “comments.php” de tu theme wp:

    1. <ol class="commentlist">
    2. <?php foreach ($comments as $comment) : ?>
    3. <li <?php echo $oddcomment; ?>id="comment-<?php comment_ID() ?>">
    4. <div class="commenttext">
    5. <cite><?php comment_author_link() ?></cite>
    6. <?php comment_text() ?>
    7. <span class="date"><img src="/images/commentlink.gif" alt="" /> <a href="#comment-<?php comment_ID() ?>" title=""><?php comment_time() ?> on <?php comment_date('n/j/y') ?></a></span> <?php edit_comment_link('edit','&nbsp;&nbsp;',''); ?>
    8. </div>
    9. <?php if ($comment->comment_approved == '0') : ?>
    10. <em>Your comment is awaiting moderation.</em>
    11. <?php endif; ?>
    12. </li>
    13. <?php
    14. /* Changes every other comment to a different class */
    15. $oddcomment = ( empty( $oddcomment ) ) ? 'class="alt" ' : '';?>
    16. <?php endforeach; /* end for each comment */ ?>
    17. </ol>

    Un poco de estilo

    1. ol.commentlist {
    2.     margin:0;
    3.     padding:0;
    4.     }
    5.  
    6. .commentlist li {
    7.     margin-bottom:8px;
    8.     background: #60360b url(http://www.yoursite.com/images/comment_arrows.gif) bottom no-repeat;
    9.     color:#FFF;
    10.     list-style:none;
    11.     width:413px;
    12.     }
    13.  
    14. .commentlist .commenttext {
    15.     background:url(http://www.yoursite.com/images/bg_paint.gif) no-repeat;
    16.     padding:22px 22px 50px 22px;
    17.     }
    18.  
    19. .commentlist cite {
    20.     display:block;
    21.     color:#FFF;
    22.     font-weight:bold;
    23.     text-transform:uppercase;
    24.     font-style:normal;
    25.     background:url(http://www.yoursite.com/images/bg_cite_arrows.gif) bottom repeat-x;
    26.     padding-bottom:12px;
    27.     font-size:1.1em;
    28.     }
    29.  
    30. .commentlist a:link, .commentlist a:visited {
    31.     color:#fff9b9;
    32.     }
    33.  
    34. .commentlist a:hover, .commentlist a:active {
    35.     color:#FFF;
    36.     }
    37.  
    38. .commentlist .date {
    39.     background:#930e27;
    40.     padding:3px;
    41.     }
    42.  
    43. li.alt {
    44.     background:#836241 url(http://www.yoursite.com/images/comment_arrows_alt.gif) bottom no-repeat;
    45.     }
    46.  
    47. li.alt .commenttext {
    48.     background:url(http://www.yoursite.com/images/bg_paint_alt.gif) no-repeat;
    49.     }  
    50.  
    51. li.alt .date {
    52.     background:#67421c;
    53.     padding:3px;
    54.     }

    Descarga PSD original para este ejemplo – Ampliar info y mas ejemplos Styling Your WordPress Comments

    just as if you ordered a regular cap from their site
    woolrich parka European Casual Armani Clothes Still Popular This Autumn 2008

    the likelihood of a relationship lasting is not great
    chanel espadrillesNike Air Jordan 1 High With Aluminum Briefcase

  • CSS | Diseño Web | php

    01 /07 / 2008 - 2:03 am

    Publicado por Nikko.

    • 15
    • 1.823

    Social Link

    Variar el estilo de nuestro blog según la hora de nuestros usuarios

    Stylesheet switcher with time!, una agradable truco que muestra como con unas simples líneas de código podremos añadir a nuestro blog cosas realmente originales, en este caso la idea es cambiar nuestra hoja de estilo dependiendo de la hora del reloj. El truco es realmente simple, se basa en crear tres hojas con estilos diferentes, uno para la mañana, otro para la tarde y otro para la noche. Luego simplemente añadimos este código en nuestro encabezado:
    Cambiamos esto:

    1. <link rel=”stylesheet” type=text/css” href=”miestilo.css” />

    por esto

    1. <link rel=”stylesheet” type=text/css” href=
    2. <?php
    3. $hour = date(”H”);
    4. if ($hour < 12) echo “morning.css”;
    5. elseif ($hour < 20) echo “day.css”;
    6. else if ($hour < 4) echo “night.css”;
    7. ?>
    8. />

    En primer lugar, definimos la hora en la que deseamos que los estilos cambien. La hora del día está determinada por el ordenador del usuario. El resto es simple de entender.

    globally sites releases ‘garments textiles’ as ‘fashion accessories’ newspapers
    chanel shoes A Look At Modern Teen Fashion

    roughly in line with analysts expectations of
    woolrich parkaCheap Sunglasses To Usher In Cheaper Times

  • Trucos útiles para wordpress

    usertipswp.jpg

    No hay dudas de lo que significa hoy para todo desarrollador wordpress, esta plataforma que se ha convertido en una de las más populares en Internet, y la que solemos utilizar frecuentemente sin importar cual sea el proyecto en el cual trabajaremos. Siempre mediante unas líneas de código adicionales, WordPress se adaptara a lo que necesitemos. Evidentemente trabajar con frecuencia con wordpres nos lleva cada día a aprender nuevos trucos, tips, o formas de solucionar ciertos problemas de la forma mas rápida y practica, pero es obvio que es tanta la información que es imposible recordar cada uno de ellos en el momento que lo estamos necesitando. Seguramente es lo que te pasara a ti en algún momento al trabajar en el diseño de tu próximo theme wordpress. La gente de Stylizedweb estos días ha despertado pensando en ello, y ha publicado un post que nos será muy útil en ocasiones. En el encontraremos fragmentos reutilizables de códigos que todos necesitamos de vez en cuando.El artículo incluye tips para:

    • Realización de una plantilla
    • Invertir orden de comentarios
    • Crear post Destacados
    • Incluir un archivo específico
    • Etiquetas condicional
    • Invertir el orden de post
    • Caracteres especiales
    • Y mas…

    Mas informacion Useful wordpress tricks
    Ejemplo: Reverse comment order

    1. <?php $comments = array_reverse($comments, true); ?>
    2.    <?php foreach ($comments as $comment) : ?>
    3.         content here
    4.    <?php endforeach; ?>

  • How to Setup Gravatars – Cómo Integrar Gravatar a tu blog

    integravatr.jpg

    Si han dejado algún comentario en el pasado, habrán notado que la opción para mostrar sus Gravatar estaba aun desactivada. Cada día al despertar me repetía, bueno hoy haré esto, corregiré esto otro, etc. La verdad es que siempre termino haciendo el 70% de lo que planeo cada día. Obviamente siempre por ser productivo en mi trabajo diario y dedicar tiempo a cosas que considero mas importante. Pero bueno, hoy si he decidido corregir la opción que permita ver los gavatar en los comentarios (quizás por curiosidad de sus rostros), y creo que fue mi día de suerte, gracias a este post, lo hice en tan solo 5 segundos.
    How to Setup Gravatars for your Blog , es un pequeño tips que nos servirá para agregar un avatar, una pequeña imagen asociada a un usuario, para ser precisos, a un correo electrónico. Lo genial, es que no necesitaremos ningún plugin, y podremos adaptarlo sin problemas a WordPress, pero funcionan con cualquier sistema basado en PHP. Tan simple como abrir nuestro comments.php y agregar el siguiente código donde deseamos implementar nuestro gravatar:

    1. <?
    2. $email = $comment->comment_author_email;
    3. $default = ""; // link to your default avatar
    4. $size = 62; // size in pixels squared
    5. $grav_url = "http://www.gravatar.com/avatar.php?gravatar_id=
    6. " . md5($email) . "&default=" . urlencode($default) . "&size=" . $size;
    7. ?>
    8. <img src="<?=$grav_url ?>" height="<?=$size ?>" width="<?=$size ?>" alt="User Gravatar" />

    Mas info How to Setup Gravatars for your Blog
    Fuente Unblogged