La plataforma Futudownloads está en desarrollo.

23 jul. 2012

Truco:Tu Blog preparado para Moviles

En Blogger se encuentra la opcion de que tu blog tenga un diseño especifico para moviles, y tu puedes activarlo y escoger el diseño, pero cuando vas a entrar desde tu movil a tu blog te das cuenta de que no sale el estilo para moviles y tu dispositivo no lo soporta.

Tu blog debe estar preparado para los dispositivos moviles dado que gran parte de las visitas que podrían llegar al blog seria a traves de esos dispositivos.

De esto, podemos decir que muchos de sus lectores están llegando a su blog a través de los teléfonos móviles .. Pero, si usted no hace su blog móvil amigable. Puede perder todos sus lectores móviles debido a que en un teléfono móvil, un blog normal toma mucho tiempo para cargar y hay otros temas que no encajan adecuadamente su sitio en la pantalla del móvil.

Así se activa tu blog para que sea amigable a traves de los dispositivos moviles.
  • Ve a Plantilla, Luego donde dice Móvil das click en el icono de "Personalizar la plantilla para mobiles".
  • Luego das click en donde dice Sí, mostrar la plantilla para móviles en los dispositivos móvile.
  • Y Guardas los cambios.
  • Ahora ve a Edicion de HTML, das clik en expandir plantilla de artilugios y busca la siguiente etiqueta.
<b:include data='blog' name='all-head-content'/>
  • Y justo debajo de ella pega lo siguiente.
<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
<b:if cond='data:blog.isMobile'>
<meta content='width=device-width, initial-scale=1.0, user-scalable=0' name='viewport'/>
<b:else/>
<meta content='width=1100' name='viewport'/>
</b:if>
  • Guarda los cambios.
¡Eso es! Ahora, los visitantes pueden acceder a su blog de Blogger a través de teléfonos móviles con una velocidad muy rapida sin complicaciones...
Ver mas...

15 jul. 2012

Editor de Colores Hexadecimales y RGBA

Color Hezadecimal más completo en Codigos de colores HTML
Color RGBA












Ver mas...

13 jul. 2012

Enviar Musica para tus juegos de musica

Hay un total de 2 archivos de Musica enviados
Debes tener en cuenta
- Debes enviar el archivo sin audio y agregar en la descripcion un enlace de compra del audio, si lo conoces.
- Tu participacion continua, te agregará automaticamente como usuario cuando FUTUdownloads sea un dominio.

Ver mas...

Gadget:Menu desplegable animado con CSS3 y Jquery

La tecnología a llevado al punto en el que las personas ya pueden ver sitios web por medio de smarth phones y tablets, tambien iPods, iPhones y iPads.
asi que las personas quieren que sus sitios sean perfectamente visibles en dispositivos moviles.
Aqui les traigo un menu desplegable que es completamente visible en dispositivos moviles y es animado.
Para los que usan plantillas del diseñador de plantilla primero deben hacer lo que dice en la siguiente entrada, Poner cualquier menu en las plantillas del diseñador de Blogger

El menu realmente se verá así: VER EJEMPLO

  • Ve a Plantilla, luego a Edicion de HTML.
  • Busca la etiqueta ]]></b:skin>, y encima de ella agrega lo siguiente.   
/* Menu desplegable por Red-Team-Design */
    #menu, #menu ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }
  
    #menu {
        width: 100%;
        margin: 60px auto;
        border: 1px solid #222;
        background-color: #111;
        background-image: -moz-linear-gradient(#444, #111);
        background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111));  
        background-image: -webkit-linear-gradient(#444, #111);  
        background-image: -o-linear-gradient(#444, #111);
        background-image: -ms-linear-gradient(#444, #111);
        background-image: linear-gradient(#444, #111);
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        border-radius: 6px;
        -moz-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
        -webkit-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
        box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
    }
  
    #menu:before,
    #menu:after {
        content: "";
        display: table;
    }
  
    #menu:after {
        clear: both;
    }
  
    #menu {
        zoom:1;
    }
  
    #menu li {
        float: left;
        border-right: 1px solid #222;
        -moz-box-shadow: 1px 0 0 #444;
        -webkit-box-shadow: 1px 0 0 #444;
        box-shadow: 1px 0 0 #444;
        position: relative;
    }
  
    #menu a {
        float: left;
        padding: 12px 30px;
        color: #999;
        text-transform: uppercase;
        font: bold 12px Arial, Helvetica;
        text-decoration: none;
        text-shadow: 0 1px 0 #000;
    }
  
    #menu li:hover > a {
        color: #fafafa;
    }
  
    *html #menu li a:hover { /* IE6 only */
        color: #fafafa;
    }
  
    #menu ul {
        margin: 20px 0 0 0;
        _margin: 0; /*IE6 only*/
        opacity: 0;
        visibility: hidden;
        position: absolute;
        top: 38px;
        left: 0;
        z-index: 1;  
        background: #444;
        background: -moz-linear-gradient(#444, #111);
        background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111));
        background: -webkit-linear-gradient(#444, #111);  
        background: -o-linear-gradient(#444, #111);  
        background: -ms-linear-gradient(#444, #111);  
        background: linear-gradient(#444, #111);
        -moz-box-shadow: 0 -1px rgba(255,255,255,.3);
        -webkit-box-shadow: 0 -1px 0 rgba(255,255,255,.3);
        box-shadow: 0 -1px 0 rgba(255,255,255,.3);  
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        -webkit-transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -ms-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
        transition: all .2s ease-in-out;
    }

    #menu li:hover > ul {
        opacity: 1;
        visibility: visible;
        margin: 0;
    }
  
    #menu ul ul {
        top: 0;
        left: 150px;
        margin: 0 0 0 20px;
        _margin: 0; /*IE6 only*/
        -moz-box-shadow: -1px 0 0 rgba(255,255,255,.3);
        -webkit-box-shadow: -1px 0 0 rgba(255,255,255,.3);
        box-shadow: -1px 0 0 rgba(255,255,255,.3);      
    }
  
    #menu ul li {
        float: none;
        display: block;
        border: 0;
        _line-height: 0; /*IE6 only*/
        -moz-box-shadow: 0 1px 0 #111, 0 2px 0 #666;
        -webkit-box-shadow: 0 1px 0 #111, 0 2px 0 #666;
        box-shadow: 0 1px 0 #111, 0 2px 0 #666;
    }
  
    #menu ul li:last-child { 
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;  
    }
  
    #menu ul a {  
        padding: 10px;
        width: 130px;
        _height: 10px; /*IE6 only*/
        display: block;
        white-space: nowrap;
        float: none;
        text-transform: none;
    }
  
    #menu ul a:hover {
        background-color: #0186ba;
        background-image: -moz-linear-gradient(#04acec,  #0186ba);  
        background-image: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba));
        background-image: -webkit-linear-gradient(#04acec, #0186ba);
        background-image: -o-linear-gradient(#04acec, #0186ba);
        background-image: -ms-linear-gradient(#04acec, #0186ba);
        background-image: linear-gradient(#04acec, #0186ba);
    }
  
    #menu ul li:first-child > a {
        -moz-border-radius: 3px 3px 0 0;
        -webkit-border-radius: 3px 3px 0 0;
        border-radius: 3px 3px 0 0;
    }
  
    #menu ul li:first-child > a:after {
        content: '';
        position: absolute;
        left: 40px;
        top: -6px;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-bottom: 6px solid #444;
    }
  
    #menu ul ul li:first-child a:after {
        left: -6px;
        top: 50%;
        margin-top: -6px;
        border-left: 0;  
        border-bottom: 6px solid transparent;
        border-top: 6px solid transparent;
        border-right: 6px solid #3b3b3b;
    }
  
    #menu ul li:first-child a:hover:after {
        border-bottom-color: #04acec;
    }
  
    #menu ul ul li:first-child a:hover:after {
        border-right-color: #0299d3;
        border-bottom-color: transparent;   
    }
  
    #menu ul li:last-child > a {
        -moz-border-radius: 0 0 3px 3px;
        -webkit-border-radius: 0 0 3px 3px;
        border-radius: 0 0 3px 3px;
    }
  
    /* Mobile */
    #menu-trigger {
        display: none;
    }

    @media screen and (max-width: 600px) {

        /* nav-wrap */
        #menu-wrap {
            position: relative;
        }

        #menu-wrap * {
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }

        /* menu icon */
        #menu-trigger {
            display: block; /* show menu icon */
            height: 40px;
            line-height: 40px;
            cursor: pointer;      
            padding: 0 0 0 35px;
            border: 1px solid #222;
            color: #fafafa;
            font-weight: bold;
            background-color: #111;
            background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, -moz-linear-gradient(#444, #111);
            background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, -webkit-linear-gradient(#444, #111);  
            background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, -o-linear-gradient(#444, #111);
            background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, -ms-linear-gradient(#444, #111);
            background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, linear-gradient(#444, #111);
            -moz-border-radius: 6px;
            -webkit-border-radius: 6px;
            border-radius: 6px;
            -moz-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
            -webkit-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
            box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
        }
      
        /* main nav */
        #menu {
            margin: 0; padding: 10px;
            position: absolute;
            top: 40px;
            width: 100%;
            z-index: 1;
            background-color: #444;
            display: none;
            -moz-box-shadow: none;
            -webkit-box-shadow: none;
            box-shadow: none;      
        }

        #menu:after {
            content: '';
            position: absolute;
            left: 25px;
            top: -8px;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-bottom: 8px solid #444;
        }  

        #menu ul {
            position: static;
            visibility: visible;
            opacity: 1;
            margin: 0;
            background: none;
            -moz-box-shadow: none;
            -webkit-box-shadow: none;
            box-shadow: none;              
        }

        #menu ul ul {
            margin: 0 0 0 20px !important;
            -moz-box-shadow: none;
            -webkit-box-shadow: none;
            box-shadow: none;      
        }

        #menu li {
            position: static;
            display: block;
            float: none;
            border: 0;
            margin: 5px;
            -moz-box-shadow: none;
            -webkit-box-shadow: none;
            box-shadow: none;          
        }

        #menu ul li{
            margin-left: 20px;
            -moz-box-shadow: none;
            -webkit-box-shadow: none;
            box-shadow: none;      
        }

        #menu a{
            display: block;
            float: none;
            padding: 0;
            color: #999;
        }

        #menu a:hover{
            color: #fafafa;
        }  

        #menu ul a{
            padding: 0;
            width: auto;      
        }

        #menu ul a:hover{
            background: none;  
        }

        #menu ul li:first-child a:after,
        #menu ul ul li:first-child a:after {
            border: 0;
        }      

    }

    @media screen and (min-width: 600px) {
        #menu {
            display: block !important;
        }
    }  

    /* iPad */
    .no-transition {
        -webkit-transition: none;
        -moz-transition: none;
        -ms-transition: none;
        -o-transition: none;
        transition: none;
        opacity: 1;
        visibility: visible;
        display: none;        
    }

    #menu li:hover > .no-transition {
        display: block;
    }
  • Ahora busca la etiqueta </head>, y encima de ella pega lo siguiente.
 <script src='http://code.jquery.com/jquery-latest.min.js' type='text/javascript'/>
<script type='text/javascript'>
// IJ tutorials //<![CDATA[
    $(function() {
        if ($.browser.msie && $.browser.version.substr(0,1)<7)
        {
        $('li').has('ul').mouseover(function(){
            $(this).children('ul').css('visibility','visible');
            }).mouseout(function(){
            $(this).children('ul').css('visibility','hidden');
            })
        }

        /* Mobile */
        $('#menu-wrap').prepend('<div id="menu-trigger">Menu</div>');      
        $("#menu-trigger").on("click", function(){
            $("#menu").slideToggle();
        });

        // iPad
        var isiPad = navigator.userAgent.match(/iPad/i) != null;
        if (isiPad) $('#menu ul').addClass('no-transition');    
    });     
//]]> 
</script>
  • Verás que el CSS es largo, pero es porque hace una adaptacion del menu para tablets, iPads y dispositivos moviles.
  • Guarda los cambios.
  • Ahora ve a Diseño, y agrega un gadget HTML/Javascript, y en el pega lo siguiente.
<nav id="menu-wrap">
<ul id="menu">
<li><a href="/">Inicio</a></li>
<li>
<a href="#">Pestaña 2</a>
<ul>
<li><a href="#">Subpestaña 2.1</a>
<ul>
<li><a href="#">Subpestaña 2.1.1</a></li>
<li><a href="#">Subpestaña 2.1.2</a></li>
<li><a href="#">Subpestaña 2.1.3</a></li>
<li><a href="#">Subpestaña 2.1.4</a></li>
</ul>
</li>
<li><a href="#">Subpestaña 2.2</a>
<ul>
<li><a href="#">Subpestaña 2.2.1</a></li>
<li><a href="#">Subpestaña 2.2.2</a></li>
<li><a href="#">Subpestaña 2.2.3</a></li>
<li><a href="#">Subpestaña 2.2.4</a></li>
</ul>
</li>
<li><a href="#">Subpestaña 2.3</a></li>
<li><a href="#">Subpestaña 2.4</a></li>
</ul>
</li>
<li><a href="#">Pestaña 3</a>
<ul>
<li><a href="#">Subpestaña 3.1</a>
<ul>
<li><a href="#">Subpestaña 3.1.1</a>
<ul>
<li><a href="#">Subpestaña 3.1.1.1</a></li>
<li><a href="#">Subpestaña 3.1.1.2</a></li>
<li><a href="#">Subpestaña 3.1.1.3</a></li>
</ul></li>
<li><a href="#">Subpestaña 3.1.2</a></li>
<li><a href="#">Subpestaña 3.1.3</a></li>
</ul>
</li>
<li><a href="#">Subpestaña 3.2</a></li>
<li><a href="#">Subpestaña 3.3</a></li>
</ul>
</li>
</ul>
</nav>
  • el #, es donde pondrás el enlace de la pestaña, subpestaña y sub de subpestañas.
  • Lo que ves de Rojo, es donde pondrás el nombre de la pestaña.
  • Lo que ves de Rojo Oscuro, es donde pondrás el nombre de la subpestaña.
  • Lo que ves de Rojo Claro, es donde pondrás el nombre de la Subpestaña de 3er nivel.
  • Lo que ves de Rojo Medio, es donde pondrás el nombre de la Subpestaña de 4º nivel.
  • Si quieres añadir una pestaña, solo agrega lo siguiente antes de </ul>.
 <li><a href="#">Pestaña</a></li>
  • Si quieres añadir una pestaña con subpestañas, solo agrega lo siguiente antes de </ul>
<a href="#">Pestaña 2</a>
<ul>
<li><a href="#">Subpestaña 1</a></li>
<li><a href="#">Subpestaña 2</a></li>
<li><a href="#">Subpestaña 3</a></li>
</ul>
  • Si quieres añadir una subpestaña solo tienes que poner lo siguientes antes del </ul> de la pestaña correspondiente.
 <li><a href="#">Subpestaña 3</a></li>
  • Si quieres añadir una subpestaña con mas subpestañas, solo tienes que agregar lo siguiente antes del </ul> de la pestaña correspondiente. 
<li><a href="#">Subpestaña 2.2</a>
<ul>
<li><a href="#">Subpestaña 2.2.1</a></li>
</ul>
</il>
Como usar el menu
  •  Es facil añadir una subpestaña a una pestaña, o agregar subpestañas a las subpestañas.
  • Una pestaña la verás así.
 <li><a href="#">Pestaña</a></li>
  • En la cual en el # agregas el enlace de la pestaña y lo rojo es donde se agregará el nombre de la pestaña. así.
 <li><a href="http://futudownloads.blogspor.com/artists">Artistas</a></li>
  • o si es en el mismo sitio puedes poner solo el enlace despues del diagonal del dominio /. así.
 <li><a href="/artists">Artistas</a></li>
  • Para agregarle una subpestaña a dicha pestaña, solo hay que bajar la etiqueta </li> de la pestaña, y encima de ella poner <ul> y </ul>.
<li><a href="/artists">Artistas</a>
<ul>
</ul>

</li>
  • y entre <ul> y </ul> se agregará la subpestaña que basicamente es el mismo codigo que la pestaña.
<li><a href="/artists">Artistas</a>
<ul>
<li><a href="/artists/kpop">K-Pop</a></li>
<li><a href="/artists/jpop">J-Pop</a></li>
<li><a href="/artists/alternative">Alternativo</a></li>
</ul>

</li>
  • Así tambien si se quiere agregar una subpestaña a la subpestaña solo hay que tomar la misma accion. Bajar la etiqueta </li> de la subpestaña correspondiente y agregando <ul> y </ul>.así.
<li><a href="/artists">Artistas</a>
<ul>
<li><a href="/artists/kpop">K-Pop</a> 
<ul>
</ul>

</li>
<li><a href="/artists/jpop">J-Pop</a></li>
<li><a href="/artists/alternative">Alternativo</a></li>
</ul>

</li>
  • Y entre <ul> y </ul> se agrega la subpestaña a la subpestaña que basicamente es la misma de la pestaña y subpestaña.
<li><a href="/artists">Artistas</a>
<ul>
<li><a href="/artists/kpop">K-Pop</a> 
<ul>
<li><a href="/artists/kpop/2NE1">2NE1</a></li>
<li><a href="/artists/kpop/4MINUTE">4MINUTE</a></li>
<li><a href="/artists/kpop/2PM">2PM</a></li>
</ul>

</li>
<li><a href="/artists/jpop">J-Pop</a></li>
<li><a href="/artists/alternative">Alternativo</a></li>
</ul>

</li>
  • Y ese es el metodo que se seguirá para todas las pestañas y subpestañas, es muy facil y normalmente se aplica a la mayoria de menus existentes.

Dificultad: Media
Fuente: Red-Team-Design.com




Ver mas...

11 jul. 2012

Manual:Servidor dedicado Halo CE, Sapp server

Muchos de los que juegan HALO CE, pueden darse cuenta que cuando entran a una partida, que casi siempre está disponible hay mensages que el servidor les da, incluso uno de Vote SKIP, to skip to this map.
Que quiere decir que si escribes skip y el 51% de los jugadores lo hacen, la partida terminará para cambiar.
Tambien hay servidores que cuando termina la partida da unas opciones para elegir mapa y partida por votación.
Hay muchos que quieren saber como hacerlo y aqui está esa solucion.
De hecho cualquier persona pudo hacerlo antes, si sabía inglés.

Contenido

  • Lo primero es descargar los archivos necesarios para esto.
SAPP Serve Descargas
  • Extraes la carpeta, en ella verás un archivo sapp.dll y haloceded.
  • Copia los dos archivos y pegalos en la carpeta de Halo Custom Edition.
C:\Archivos de programas\Microsoft Games\Halo Custom Edition
C:\Program files\Microsoft Games\Halo Custom Edition
  • te saldrá un mensage preguntando que si vas a reemplasar el archivo yá existente, le das que si.
  • Luego ve a C:\Documents and settings\Administrador\Mis Documentos\My Games\Halo CE. (Mis documentos)
  • Alli crea una carpeta que se llamará sapp, ten en cuenta que ese debe ser el nombre sin mayusculas.


Creacion de partidas y nombre del servidor init.txt
  • en esa carpeta crea un archivo de texto al que le llamarás init.txt, y en el escribirás lo siguiente.
sv_name "Nombre del servidor"
v1
afk_kick 300
ping_kick 600
log 1 ;this enables sapp log in gametypes folder.
antihalofp 1
anticaps 1
antispam 1
map_skip 51
spawn_protection 5
aimbot_ban 20000 2
sv_motd "motd.txt"
sv_log_enabled 1
sv_log_echo_chat 1
sv_timelimit 30
sv_mapcycle_timeout 10
mapvote 1 ; see mapvote page for explenation

; load should be placed after sv_mapcycle_begin
load
  • el 51 que se ve es para que los jugadores voten por salir de una partida. El 51 representa el porcentage 51%. y guardas los cambios.
  • de esta manera es el codigo si quieres dejar que los jugadores elijan el mapa, sino quieres que elijan el mapa entonces escribe este codigo. para más ve esta entrada.
sv_name "Nombre del servidor"
v1
afk_kick 300
ping_kick 600
log 1 ;this enables sapp log in gametypes folder.
antihalofp 1
anticaps 1
antispam 1
map_skip 51
spawn_protection 5
aimbot_ban 20000 2
sv_timelimit 30
sv_motd "motd.txt"
sv_log_enabled 1
sv_log_echo_chat 1
sv_mapcycle_timeout 10
sv_mapcycle_add mapa "partida"
sv_mapcycle_add hangemhigh "partida"
sv_mapcycle_add bloodgulch "partida"
sv_mapcycle_begin

; load should be placed after sv_mapcycle_begin
load


Votación de mapas
  • Para permitirle a los jugadores elegir la partida en la que quieran jugar y el mapa, en la misma carpeta sapp en donde guardaste el archivo init.txt, crearás otro archivo de texto al que le llamarás mapvotes.txt.
  • en mapvotes.txt escribirás lo siguiente.
mapa:partida:descripción
ejemplo
bloodgulch:slayer:Bloodgulch - slayer
hangemhigh:ctf:Hang 'em high - CTF
wizard:oddball:Wizard - Odd Ball
ratrace:king:Rat race - king
carousel:race:Derelict - Race
bloodgulch:ctf:Bloodgulch - CTF
hangemhigh:MyPartida:Hang 'em high - Asesino por equipos snipers
  • en lo rojo escribirás el nombre del mapa segun como se deva escribir en codigo sv. puedes ver el nombre de los mapas en este link.
  • lo de azul es donde escribirás el nombre de la partida, la cual puede ser alguna que hallas creado. y lo de purpura es donde podrás una descripcion de la partida a votar.
  • cuando hallas terminado guarda la carpeta.
  • si quieres elegir el numero de votos necesarios para iniciar la partida escribe en init.txt, (maxvotes 4). El 4 puede ser cambiado por el numero de votos que se necesitarán para iniciar la partida.


Mensages automaticos del servidor

Cuando estás jugando en un servidor al iniciar ves un mensage de bienvenida, cuando haces 10, 25, 50 o 100 muertes siempre te sale un mensage de felicitacion dependiendo de cuantas muertes hiciste.
Tambien cuando traicionas a alguien te da una advertencia diciendo que si lo vuelves a hacer te expulsan.
  • en la misma carpeta sapp donde tienes init.txt y mapvotes.txt, crea otro archivo de texto que se llamará events.txt.
  • En este archivo agregarás lo siguiente
Español
event_join $lvl>2 'w8 1;say * "Admin $wname has joined!"'
event_join 'wait 6000;say $n "Bienvenido \n! a Nombre del servidor" '
event_join 'wait 10000;say $n "\n! Tu ip es $ip y tu hash es $hash" '
event_join 'wait 14000;say $n "Por favor sigue las reglas o serás Expulsado o Baneado!" '
event_kill 'say $n "Tienes $kills Muertes, \n!" '
event_kill $kills=25 'say $n "25 muertes, no eres malo en este juego $name!" '
event_kill $kills=100 'say $n "WoW, Tienes 100 asesinatos, eres muy bueno en este juego $name!" '
event_kill $kills=500 'say $n "Te volviste un Señor de la guerra en este juego $name, tienes 500 muertes !!!" '
event_score 'say $n "Bien hecho, has puntuado para el equipo $team $name!" '
event_tk 'say $n "\n do not betray your teammates you idiot!" '
event_start 'wait 18000;say * "Vota para salir de este mapa escribiendo SKIP y obteniendo un 51% de los votos saldrán"'
event_end 'say * "Servidor SAPP desarrollado por xhalo.tk, servidor por FUTUdownloads users"'
event_teamswitch 'say $n "Bienvenido al equipo $team, \n!." '

English
event_join $lvl>2 'w8 1;say * "Admin $wname has joined!"'
event_join 'wait 6000;say $n "Welcome \n! to Server Name" '
event_join 'wait 10000;say $n "\n! Ur ip is $ip and ur hash is $hash" '
event_join 'wait 14000;say $n "Please follow the rules or you might get kicked or banned!" '
event_kill 'say $n "You have $kills kills, \n!" '
event_kill $kills=25 'say $n "25 kills, not bad $name!" '
event_kill $kills=100 'say $n "WoW, you have 100 kills $name!" '
event_kill $kills=500 'say $n "MDROFLOLMFAOMFG $name, you have 500 kills !!!" '
event_score 'say $n "Good Job, $name!" '
event_tk 'say $n "\n do not betray your teammates you idiot!" '
event_start 'wait 18000;say * "Map skipping is enabled! Type SKIP to vote to skip this map!"'
event_end 'say * "Server Powered by SAPP, server by FUTUdownloads users"'
event_teamswitch 'say $n "Welcome to the $team team, \n!." '


Mensage del día
  • Ahora crea otro archivo de texto llamado motd.txt, y en el puedes agregar cualquier mensage, eso sí que no sobrepase los cuatro renglones.
Ejemplo
Welcome to Nombre del servidor Serve
futudownloads.blogspot.com
New serve for u
Se el mejor y ten suerte

Fuente: XGCLAN.com
Desarrolllador: sehé xhalo.tk

    Ver mas...

    6 jul. 2012

    Gadget:Botones para compartir al lado del post






    Conforme se crea un sitio y/o blog las personas quieren que su sitio se haga más reconocido y la mejor forma de hacerlo es compartiendolo en la redes sociales como facebook, blogger, myspace y google+.
    pues hay les traigo un nuevo Gadget que les hará posible hacerlo y siempre estará visible en la entrada.
    este gadget se ha visto en varios sitios.
    • Ve a Plantilla, luego a Edicion de HTML.
    • Haces click en expandir plantilla de artilugios y busca la etiqueta ]]></b:skin>.
    • y encima de ella pega lo siguiente.
    .hb_social_floating {
    position: fixed;
    bottom: 10%;
    margin-left: -80px;
    float: left;
    width: 70px; /* ancho del gadget */
    background-color: #ffffff; /* fondo del gadget */
    padding: 5px 0 0px 0px;
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    z-index: 9999px !important;
    border-radius: 5px; /* radio del gadget */
    -moz-border-radius: 5px; /* radio del gadget */
    -webkit-border-radius: 5px; /* radio del gadget */
    }

    .hb_social_floating .hb_side_social_button {
    margin-bottom: 5px;
    float: none;
    height: auto;
    width: 70px;
    }

    .hb_social_floating .st_twitter_vcount, .hb_social_floating.st_plusone_vcount, .st_email {
    margin-left: 5px;
    }

    .hb_social_floating .st_fblike_vcount {
    margin-left: 5px;
    }

    .hb_social_floating .stButton_gradient {
    background: none !important;
    height: 21px !important;
    padding-left: 0 !important;
    }

    .hb_social_floating .chicklets, .hb_social_floating .stMainServices {
    background: url(''
    ) no-repeat !important;
    height: 19px !important;
    width: 50px !important;
    padding: 0 !important;
    }

    .st_email .chicklets {
    background-position: 0 -77px !important;
    background-image: url(''
    ) !important;
    }

    .hb_social_floating .st_twitter_vcount .st-twitter-counter {
    background-position: 0 -58px !important;
    }

    .hb_social_floating .stButton_gradient {
    border: none !important;
    }

    .hb_social_floating .stBubble_count {
    width: 59px !important;
    font-size: 15px !important;
    font-weight: normal !important;
    padding-top: 7px !important;
    height: 23px !important;
    background: none !important;
    }

    .hb_social_floating .st_twitter_vcount .stBubble_count {
    color: #00a6df;
    background-color: #f8fbfc !important;
    }

    .st_fblike_vcount {
    margin-bottom: 0px;
    display: block;
    }

    .st_twitter_vcount {
    margin-bottom: 3px;
    display: block;
    }

    .st_email {
    margin-bottom: 5px;
    margin-top: 3px;
    display: block;
    }

    .hb_social_floating .stBubble {
    background-position: 21px 31px !important;
    height: 35px !important;
    }
    • Lo que ves negreado es lo que puedes editar, recomiendo que el color de fondo sea el mismo de las entradas.
    • Ahora busca la siguiente etiqueta.
    <b:includable id="post" var="post">
    • Y justo debajo de ella pega lo siguiente.
    <b:if cond='data:blog.pageType == "item"'>
    <b:if cond='data:blog.pageType != "static_page"'>
    <div class='hb_social_floating'>
    <center><a class="addthis_button_facebook_like" fb:like:layout="box_count"></a>
    <a class="addthis_button_tweet" tw:count="vertical"></a>
    <a class="addthis_button_pinterest_pinit" pt:count="vertical"></a><a class="addthis_button_google_plusone" g:plusone:size="tall"></a>
    <a style='margin-left:10px' class="addthis_counter"></a></center>
    </div>
    <script src="//assets.pinterest.com/js/pinit.js" type="text/javascript"/>
    <script src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4ff768ba574abf90" type="text/javascript"/></b:if></b:if>
    • Puedes cambiar donde dice FUTUdownloads por el nombre de tu blog.
    • Donde dice iho_jose es el nombre del usuario twitter recomendado, puedes cambiarlo por el tuyo.
    • Y guardas los cambios, listo ya tendras tu gadget flotante con las redes sociales más visitadas para compartir tus entradas.



    Ver mas...

    4 jul. 2012

    Gadget:Boton Retweet en Blogger


    El boton retweet tiene una funcion casi como la de el boton Tweet, solo que este no solo se compartirá en tu cuenta Twitter sino tambien en tu Tweetmeme.com.
    Este boton viene en dos versiones la version por defecto que es un boton con un contador vertical, y el boton compacto que es un boton con el contador horizontal.

    Version por defecto

    <script type="text/javascript">tweetmeme_url = '<data:post.url/>';</script><script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"> </script>

    Version Compacto

    <script type="text/javascript">tweetmeme_style = "compact";</script>
    <script src="http://tweetmeme.com/i/scripts/button.js" type="text/javascript">
    </script>
    • Para agregar el boton tanto arriba o debajo de la entrada has lo siguiente.
    • Ve a Plantilla, luego a Edicion de HTML

    Arriba de la entrada.
    • Expandir plantilla de artilugios y busca la siguiente etiqueta.
    <data:post.body/>
    • Y encima de ella pega el codigo del boton que elegiste. Y guardas.

    Debajo de la entrada.
    • Expandir plantilla de artilugios y busca la siguiente etiqueta.
    <div class='post-footer-line post-footer-line-1'>
    • Y debajo de ella pega el codigo del boton que elegiste. Y guardas.
    • Listo ya tienes el boton retweet en tu blog.
    Ver mas...