Desarrollo

A todos nos gusta personalizar nuestras cosas. ¿Qué hay de la pantalla de Login de Wordpress en la que por defecto aparece el logotipo de wordpress? ¡Aquí tienes cómo cambiarlo sin tocar el core de wordpress (lo cual se sobre-escribiría con actualizaciones de wordpress)

En el archivo functions.php de tu tema añade:

function my_custom_login_logo() {

echo ‘<style type=”text/css”>

h1 a { background-image:url(‘.get_bloginfo(‘template_directory’).’/images/login-logo.gif) !important; }

</style>’;

}

add_action(‘login_head’, ‘my_custom_login_logo’);

function my_custom_login_logo() { echo ‘<style type=”text/css”> h1 a { background-image:url(‘.get_bloginfo(‘template_directory’).’/images/custom-login-logo.gif) !important; } </style>’;}
add_action(‘login_head’, ‘my_custom_login_logo’);

Donde login-logo.gif tiene que ser la imagen (también puede ser PNG) que quieras añadir.
Tamaño recomendado: 310×68px

Escrito por Janmi el 26/02/2010 | Comentar |

Versión Imprimible
Etiquetas: login, logo, personalizacion, wordpress
Noticias Posiblemente Relacionadas [Lista automática]:

Feb 22

+

Cómo personalizar el logo del panel de administración de Wordpress

Desarrollo | Comentar »

logo personalizado en panel administración de Wordpress

De esta forma podrás tener el logotipo de tu panel de administración personalizado. Te recomiendo que crees un GIF o PNG transparentede 32×32px.

Añade este código al archivo functions.php de tu tema activo:

/*** LOGO DE WP-ADMIN – Janmi.com **/

add_action(‘admin_head’, ‘my_custom_logo’);

function my_custom_logo() {

echo ‘<style type=”text/css”>

#header-logo { background-image: url(‘.get_bloginfo(‘template_directory’).’/images/logo_mini.gif) !important; }</style>’;

}

Donde logo_mini.gif es tu logo gif o png

Escrito por Janmi el 22/02/2010 | Comentar |

Versión Imprimible
Etiquetas: adminstracion, hacks, logo, wordpress
Noticias Posiblemente Relacionadas [Lista automática]:

Ene 28

+

Menú horizontal y submenú con CSS

Desarrollo | Comentar »

¿Quieres un menú CSS, sin javascript, fácil de usar para tu web que además pueda tener todos los submenús que quieras?

Aquí tienes el código:

Código CSS:

/*****MENU DE NAVEGACION *****/
 
#nav{ width:900px;overflow:hidden;
 background-image:url(nav-bg.gif); /** fondo de barra de menus **/
 background-repeat:repeat-x;
 height:36px;
 float:left;}    
.catnav{float:left;
 width:750px;
 
 }
 
.catnav ul {
 list-style: none;  
 margin-left:0px;
 margin-top:0em;
 padding:0em;
 }
 
.catnav li {
float: left;
margin: 0;
margin-left:0;
padding: 0;
list-style-type: none;
}
 
.catnav a {
 display: block;
 line-height: 36px;
 margin: 0;
 padding: 0 10px;
 
 font-size: 12pt;
 color: #1DA4EA;
 font-family: Arial, Helvetica, sans-serif;
 background:url(navbg-2.gif) ;  /** fondo de opciones de menu **/
 list-style-type: none;
 text-decoration:none;
 letter-spacing: -1px;
 }
 
.catnav li ul {
float:left;
margin:0;
padding:0;
}
 
.catnav li a:hover {
 color: #fffffb;
 text-decoration: none;
 background:#F06C6C;
 }
 
.catnav li ul {
 list-style: none;
 position: absolute;
 width: 100px;
 left: -999em;
 }
 
.catnav li:hover ul, #nav li.sfhover ul {
 left: auto;
 }
 
.catnav li li {
 float: left;
 margin: 0;
 padding: 0;
 }
 
.catnav li li a {
 height: 36px;
 line-height: 36px;
 color: #fff;
 background:#F06C6C;
 margin: 0;
 padding: 0 10px;
 }
 
.catnav li li a:hover {
 background:#F06C6C;
 padding: 0 10px;
 }
 
.catnav li:hover, .catnav li.sfhover { /* prevents IE7 drop-down menu bug (focus on a page 
 
element prevents nested menus from disappearing) */
 position: static;overflow:hidden;
 }

Código HTML de ejemplo para el Menú y submenú:

<div id="nav">
<div class="catnav">	       
<ul class="nav">
 <li><a href="http://www.janmi.com/">Home</a></li>
 <li class="page_item page-item-7"><a href="http://www.janmi.com/portafolio" title="Portafolio">Portafolio</a></li>
 <li class="page_item page-item-14"><a href="http://www.janmi.com/" title="Eventos">Eventos</a>
 <ul>
	<li class="page_item page-item-22"><a href="http://www.janmi.com/" title="">Sub p&aacute;gina 1</a></li>
	<li class="page_item page-item-19"><a href="http://www.janmi.com/" title="">Sub p&aacute;gina 2</a></li>
 </ul>
 </li>
 <li class="page_item page-item-18"><a href="http://www.janmi.com/" title="Segunda Mano">Segunda Mano</a></li>   
</ul>
</div>
</div>

Respecto a las 2 imágenes que se usan como fondo en este menú de ejemplo, las puedes descargar de aquí (botón derecho, guardar imagen como…):

Fondo del Menú:

Fondo de las Opciones del Menú:

» Descargar menu css sin javascript

Escrito por Janmi el 28/01/2010 | Comentar |

Versión Imprimible
Etiquetas: css, css menu, html, javascript, menu, submenu, wordpress
Noticias Posiblemente Relacionadas [Lista automática]:

Ene 22

+

Menús CSS

Desarrollo, Diseño | Comentar »

A continuación tenéis un listado de menús CSS gratuitos así como galerías con diversos diseños:

»»» Free CSS Menu (recomendado y enlaces para descargas)

» 30 Free CSS Based Navigation Menus

» 120 Excellent Examples of CSS Horizontal Menu (diseños)

»» CSS-Based Navigation Menus: Modern Solutions (diseños, muy bueno)

» Free CSS Drop Down Menu Generator (generador online de menus css)

» CSS Menu Generator (generador de menus css)

» Advanced CSS Menu (precioso menu CSS gratuito)

» CSS navigation menu (sencillo)

Escrito por Janmi el 22/01/2010 | Comentar |

Versión Imprimible
Etiquetas: css, css menu, desarrollo web, free, gratis, javascript, menu, web
Noticias Posiblemente Relacionadas [Lista automática]:

Ene 21

+

Cómo hacer newsletters efectivas

Desarrollo | Comentar »

Newsletter de Apple

Respecta a tu lector. No les hagas perder el tiempo o su atención.
Pregunta educadamente primero.
Céntrate en la relevancia.
Diseña con una meta en mente, así sabrás si ha funcionado.
Haz que sea fácil darse de baja.
Codifica como en 1999 (literalmente) y usa CSS incrustado.
Siempre incluye una versión de texto plano.
No asumas que las imágenes podrán ser vistas.
Sigue la ley.
Prueba todo antes de enviarlo, porque no hay vuelta atrás.

Artículo original completo y explicación de cada punto:

» Design and Build Email Newsletters Without Losing Your Mind (and Soul)

Escrito por Janmi el 21/01/2010 | Comentar |

Versión Imprimible
Etiquetas: apple, boletin, newsletter
Noticias Posiblemente Relacionadas [Lista automática]:

Ene 14

1

Rewriting en Wordpress en AppServer para Windows

Desarrollo, Internet | 1 Comentario »

1. Abrir con un editor (mejor si es de programación) el archivo httpd.conf

Este archivo de Apache se encuentra en una ruta similar a la siguiente en AppServer:

C:\AppServ\Apache2.2\conf

\Apache2.2\ puede variar dependiendo de la versión que instaleos.

2. Activar rewritting

#LoadModule rewrite_module modules/mod_rewrite.so

El caracter # es un comentario, por lo que hay que eliminarlo:

LoadModule rewrite_module modules/mod_rewrite.so

3. Modificar Permalinks en Wordpress

Acceder al panel de control de Wordpress (http://localhost/tublog/wp-admin/)

Apartado de Permalinks (enlaces permanentes)

Configurarlo al gusto. Por ejemplo (recomendado para SEO):

Wordpress rewriting SEO compatible - sección Permalinks de Wordpress

4. Reiniciar Apache.

Si no os funciona, reiniciar el ordenador y aseguraros que el IIS está parado.

Escrito por Janmi el 14/01/2010 | Comentar (1) |

Versión Imprimible
Etiquetas: appserver, rewriting, seo, windows, wordpress
Noticias Posiblemente Relacionadas [Lista automática]:

Ene 13

1

Los mejores plugins de Wordpress

Desarrollo | 1 Comentario »

Plugin para version personalizada de tu blog para iPhone e iPod Touch

A continuación tienes una selección de algunos de los mejores y más prácticos plugins de Wordpress para tu Web. Si conoces otro útil, ponlo en los comentarios por favor.

All in One SEO Pack

Completísima gestión de la configuración SEO (Search Engine Optimization) de tu Web. Imprescindible para una correcta indexación en los principales motores de búsqueda (como Google).

» Descargar plugin All in SEO Pack

Autocompleter

Sugeridor de términos en la caja de búsqueda de tu Web.

» Descargar plugin Autocompleter

flickrRSS

¿Tienes cuenta en Flickr.com ? con este plugin podrás mostrar tus últimas de Flickr en tu Web.

» Descargar FlickrRSS

Future Dashboard Widget

Lista en el Escritorio / Dashboard de tu panel de administración de Wordpress los posts que tienes programados en el tiempo. ¡Muy útil!

» Descargar Future Dashboard Widget

Google XML Sitemaps

Actualiza de forma automática el XML del Mapa del Sitio tu Web para que Google sepa cuándo tiene que volver a indexarte.

» Descargar Google XML Sitemaps

Inline PHP

Incluye código PHP en tus páginas o posts. Ejemplo:

[exec ]echo "holaaa!";[/exec ]

» Descargar Inline PHP

Most Comments – Most Comments Widget

Visualiza los últimos comentarios con avatares de gravatar en el sidebar de tu Web.

»Descargar Most Comments & Widget

Post-Plugin Library – Post Layout

Muestra los anuncios de Google Adsense que quieras en tu blog.

Descargar: Post-plugin Library & Post Layout

Rich Text Widget

Añade el código HTML que quieras a tu sidebar y gestiónalo a través de un editor WYSIWYG (estilo Word).

» Descargar Rich Text Widget

SI CAPTCHA

Sencillo y práctico Captcha para evitar el SPAM en los comentarios de tu blog.

»Descargar SI CAPTCHA ANTI-SPAM

Sociable

Añade los botones de redes sociales que quieras (facebook, twitter, meneame.net, etc…) para que los usuarios de tu blog puedan enviar tus noticias a la red social que quieran.

» Descargar Sociable

Wordpress Google Analytics Reports

Muestra tus estadísticas de Google Analytics en el panel de control de Wordpress.

» Descargar Wodpress Google Analytics Reporsts

WP-PageNavi

Paginación con números y enlaces “anterior” y “siguiente” para tu blog.

» Descargar WP-PageNavi

WP-PostViews

Widget para guardar y enseñar los posts más vistos.

» Descargar WP-PostViews

WP-Print

Versión imprimible para tus posts.

» Descargar WP-Print

WP-RecentComments

Widget para mostrar los últimos comentarios de tu blog.

» Descargar WP-RecentComments

WP-Syntax

Añade un resaltado atractivo para mostrar código en tu blog. Muy útil para blogs tecnológicos o de programación.

» Descargar WP-Syntax

WPtouch iPhone Theme

Tema automático para que si se accede a tu blog desde un iPhone o iPod Touch, éste se vea con un diseño compatible y atractivo. Muy configurable.

» Descargar WPtouch iPhone Theme

Escrito por Janmi el 13/01/2010 | Comentar (1) |

Versión Imprimible
Etiquetas: listado, mejor, plugin, widget, wordpress, wordpress plugins
Noticias Posiblemente Relacionadas [Lista automática]:

Oct 09

+

Carrusel Web de destacados

Desarrollo | Comentar »

Especialmente en 2009 se ha llevado a la práctica la tendencia de añadir carruseles de noticias u ofertas destacadas en las páginas principales de los Webs:

Carrusel Ajax de Sol Melia

Hay dos tendencias: hacerlo en Flash o en Ajax (recomendado)

Ejemplos de carruseles Web:

» Carrusel de Sol Meliá

» Carrusel de Carrefour España

» Carrusel de MyPix

» Carrusel de World of Warcraft

» Carrusel de Elcorteinglés

» Carrusel de Iberostar Hotels & Resorts

Cómo hacer un carrusel con jQuery (Ajax):

» jQuery Carousel

Escrito por Janmi el 09/10/2009 | Comentar |

Versión Imprimible
Etiquetas: ajax, carrusel, flash, iberostar, jquery, melia, warcraft
Noticias Posiblemente Relacionadas [Lista automática]:

Oct 01

+

Doblez de página en jQuery

Desarrollo | Comentar »

El efecto de página doblada se puede conseguir sin flash con jQuery de forma gratuita.

» Fuente Simple Page Peel Effect with jQuery & CSS
» Demo Simple Page Peel Effect with jQuery & CSS

Escrito por Janmi el 01/10/2009 | Comentar |

Versión Imprimible
Etiquetas: ajax, flip, jquery
Noticias Posiblemente Relacionadas [Lista automática]:

Sep 29

+

Las noticias de tu blog en Twitter

Desarrollo | Comentar »

Wordpress en Twitter

¿Cómo publicar las noticias de tu blog en Twitter?

Recomiendo The Twitter Updater, aunque en el siguiente enlace encontrarás más alternativas e información:

» Las 10 mejores utilidades de Twitter para Wordpress

Escrito por Janmi el 29/09/2009 | Comentar |

Versión Imprimible
Etiquetas: plugin, twitter, wordpress
Noticias Posiblemente Relacionadas [Lista automática]:

Sep 29

+

10 consejos de usabilidad Web

Desarrollo | Comentar »

Formulario de Registro de Tumblr.com

Las etiquetas de los campos de los formularios mejor encima de los campos
El usuario se centra en las caras
La calidad del diseño es un indicador de la credibilidad
La mayoría de los usuarios hace Scroll
El azul es el mejor color para los enlaces
La caja de búsqueda ideal tiene un ancho de 27 caracteres
El espacio en blanco mejora la comprensión
El usuario de pruebas efectivo no tiene porque ser extensivo
Las páginas informativas de producto ayudan a entender mejor
La mayoría de los usuarios están ciegos a la publicidad

Más información y fuente en (EN)

» 10 Useful Usability Findings and Guidelines

Escrito por Janmi el 29/09/2009 | Comentar |

Versión Imprimible
Etiquetas: Desarrollo, formulario, interface, usabilidad, web
Noticias Posiblemente Relacionadas [Lista automática]:

Ago 23

+

Repositorios gratuitos de imágenes

Desarrollo, Diseño | Comentar »

repositorio imagenes

Smashing Magazine publicó un estupendo artículo recopilatorio de portales en los que hay imágenes gratuitos para nuestros desarrollos y Webs y también de pago:

» Free and Commercial Stock Photography Sites

Escrito por Janmi el 23/08/2009 | Comentar |

Versión Imprimible
Etiquetas: gratis, Imágenes, repositorio, stock
Noticias Posiblemente Relacionadas [Lista automática]:

Publicaciones sobre: Desarrollo

1. Abrir con un editor (mejor si es de programación) el archivo httpd.conf

2. Activar rewritting

3. Modificar Permalinks en Wordpress

4. Reiniciar Apache.

All in One SEO Pack

Autocompleter

flickrRSS

Future Dashboard Widget

Google XML Sitemaps

Inline PHP

Most Comments – Most Comments Widget

Post-Plugin Library – Post Layout

Rich Text Widget

SI CAPTCHA

Similar Posts

Sociable

Wordpress Google Analytics Reports

WP-PageNavi

WP-PostViews

WP-Print

WP-RecentComments

WP-Syntax

WPtouch iPhone Theme

Ejemplos de carruseles Web:

Cómo hacer un carrusel con jQuery (Ajax):

Mis Categorías.

¡Mira!

Sobre Janmi.com …

My photos. Now you know me.

Janmi está Leyendo:

Me gustaría tener…

Citas

Enlaces

Fans en Facebook