Vista previa del multibanner:
Consideraciones:
Sólo utiliza el multibanner si tienes suficiente espacio en la sidebar, mínimo 300px de ancho.
¿Cómo obtener este multibanner?
Paso 1: Añadiendo los estilos:
Vamos a ''Diseño/Edición HTML'', en donde marcamos ''Expandir plantilla de artilugios''. Buscaremos la siguiente línea:
]]></b:skin>
Arriba de ésta, pegaremos el siguiente código:
/* Banners 125 x 125
----------------------------------------------- */
.ads {
margin-top:5px;
margin-left:5px;
}
.ads img {
padding: 4px;
margin-bottom: 5px;
}
/* miniBanners 32 x 32
----------------------------------------------- */
.adsmini {
margin-top:5px;
margin-left:5px;
}
.adsmini img {
padding: 1.6px;
margin-bottom: 5px;
}
/* BANNER CAMBIANTE
----------------------------------------------- */
{
margin: 0;
padding: 0;
}
#rotator {
border: 1px solid #dadada;
overflow: hidden;
margin-left: 8px ;
padding:2px;
position: relative;
width: 258px;
height: 60px;
}
#rotator img {
border: 0;
width: 258px;
height: 60px;
}
Guardamos los cambios y listo:
Paso 2: Instalando el script del multibanner:
En ''Diseño/Edición HTML'' buscaremos la siguiente sección:
</head>Arriba de ésta, pegas el siguiente código:
<script src='https://sites.google.com/a/blogsydescargas.co.cc/ayudabloggers/scripts/xfade2.js' type='text/javascript'/>
Guardas los cambios y listo:
Paso 3: Añadiendo el multibanner:
Vamos a ''Dieño/Edición HTML'' marcamos ''Expandir plantillas de artilugios'' y buscamos la siguiente línea:
<div id='sidebar-wrapper'>
Debajo de esta, pegaremos el siguiente código:
<div class='ads'>
<a href='URL DE DESTINO' title='¡Espacios disponibles para tu banner!'><img src='https://lh5.googleusercontent.com/-_Ab1jipToss/TYjNKgEWWeI/AAAAAAAAAjs/umSnT6KTd5c/s1600/banner125.jpg'/></a>
<a href='URL DE DESTINO' title='¡Espacios disponibles para tu banner!'><img src='https://lh5.googleusercontent.com/-_Ab1jipToss/TYjNKgEWWeI/AAAAAAAAAjs/umSnT6KTd5c/s1600/banner125.jpg'/></a>
<a href='URL DE DESTINO' title='¡Espacios disponibles para tu banner!'><img src='https://lh5.googleusercontent.com/-_Ab1jipToss/TYjNKgEWWeI/AAAAAAAAAjs/umSnT6KTd5c/s1600/banner125.jpg'/></a>
<a href='URL DE DESTINO' title='¡Espacios disponibles para tu banner!'><img src='https://lh5.googleusercontent.com/-_Ab1jipToss/TYjNKgEWWeI/AAAAAAAAAjs/umSnT6KTd5c/s1600/banner125.jpg'/></a>
</div>
<div id='rotator'>
<a href='URL DE DESTINO' title='Obtén este espacio'><img alt='Obtén este espacio gratis!' src='https://lh3.googleusercontent.com/-e0tXfBvRnMs/TY1sOYKMAxI/AAAAAAAAAmg/DgBqWqBvwMU/s1600/banner260x60.png'/></a>
<a href='URL DE DESTINO' title='Obtén este espacio'><img alt='Obtén este espacio gratis!' src='https://lh3.googleusercontent.com/-e0tXfBvRnMs/TY1sOYKMAxI/AAAAAAAAAmg/DgBqWqBvwMU/s1600/banner260x60.png'/></a>
<a href='URL DE DESTINO' title='Obtén este espacio'><img alt='Obtén este espacio gratis!' src='https://lh3.googleusercontent.com/-e0tXfBvRnMs/TY1sOYKMAxI/AAAAAAAAAmg/DgBqWqBvwMU/s1600/banner260x60.png'/></a>
<a href='URL DE DESTINO' title='Obtén este espacio'><img alt='Obtén este espacio gratis!' src='https://lh3.googleusercontent.com/-e0tXfBvRnMs/TY1sOYKMAxI/AAAAAAAAAmg/DgBqWqBvwMU/s1600/banner260x60.png'/></a>
</div>
<div class='adsmini'>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
</div>
Previsualizas los cambios y si el resultado es satisfactorio guardas los cambios:
Paso 4: Sólo mostrar al ingresar a las entradas (Opcional):
A petición de Chamorro, mostraré cómo evitar que la sección de banners se muestren en la página principal:
Primero, buscas el código del paso 3, y ese código deberás ponerlo entre el siguiente:
<b:if cond='data:blog.pageType == "item"'>CODIGO-PASO3</b:if>
De tal forma que quede de la siguiente forma:
<b:if cond='data:blog.pageType == "item"'>
<div class='ads'>
<a href='URL DE DESTINO' title='¡Espacios disponibles para tu banner!'><img src='https://lh5.googleusercontent.com/-_Ab1jipToss/TYjNKgEWWeI/AAAAAAAAAjs/umSnT6KTd5c/s1600/banner125.jpg'/></a>
<a href='URL DE DESTINO' title='¡Espacios disponibles para tu banner!'><img src='https://lh5.googleusercontent.com/-_Ab1jipToss/TYjNKgEWWeI/AAAAAAAAAjs/umSnT6KTd5c/s1600/banner125.jpg'/></a>
<a href='URL DE DESTINO' title='¡Espacios disponibles para tu banner!'><img src='https://lh5.googleusercontent.com/-_Ab1jipToss/TYjNKgEWWeI/AAAAAAAAAjs/umSnT6KTd5c/s1600/banner125.jpg'/></a>
<a href='URL DE DESTINO' title='¡Espacios disponibles para tu banner!'><img src='https://lh5.googleusercontent.com/-_Ab1jipToss/TYjNKgEWWeI/AAAAAAAAAjs/umSnT6KTd5c/s1600/banner125.jpg'/></a>
</div>
<div id='rotator'>
<a href='URL DE DESTINO' title='Obtén este espacio'><img alt='Obtén este espacio gratis!' src='https://lh3.googleusercontent.com/-e0tXfBvRnMs/TY1sOYKMAxI/AAAAAAAAAmg/DgBqWqBvwMU/s1600/banner260x60.png'/></a>
<a href='URL DE DESTINO' title='Obtén este espacio'><img alt='Obtén este espacio gratis!' src='https://lh3.googleusercontent.com/-e0tXfBvRnMs/TY1sOYKMAxI/AAAAAAAAAmg/DgBqWqBvwMU/s1600/banner260x60.png'/></a>
<a href='URL DE DESTINO' title='Obtén este espacio'><img alt='Obtén este espacio gratis!' src='https://lh3.googleusercontent.com/-e0tXfBvRnMs/TY1sOYKMAxI/AAAAAAAAAmg/DgBqWqBvwMU/s1600/banner260x60.png'/></a>
<a href='URL DE DESTINO' title='Obtén este espacio'><img alt='Obtén este espacio gratis!' src='https://lh3.googleusercontent.com/-e0tXfBvRnMs/TY1sOYKMAxI/AAAAAAAAAmg/DgBqWqBvwMU/s1600/banner260x60.png'/></a>
</div>
<div class='adsmini'>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
<a href='URL DE DESTINO' title='¡Obtén este espacio!'><img src='https://lh4.googleusercontent.com/-4DFAUAJ4VzU/TYqpt7iKIPI/AAAAAAAAAk4/XTq8mnBdGCI/s1600/banner32.jpg'/></a>
</div>
</b:if>
Notas:
- Recuerda que en paso 1, deberás modificar los márgenes y los valores pertinentes.
- Si deseas agregar un banner de mi blog en la sección, visita este enlace.
No hay comentarios:
Publicar un comentario