Daleclick Templates

2006-05-22T20:16:00.000-07:00

Saludos y bienvenidos a DC Templates de daleclick! Aquí encontrarás templates para blogger, blogger-emoticons, calendario blogger y algunos trucos para tu blog... de blogger. Los mejores links de templates y servicios para blogger, ayuda en línea con tu blog y un foro con montones de preguntas sobre blogger y HTML Básico que puedes usar para editar tu blog y darle una apariencia única.

Más recientes:

(Menú Dinámico)

(Menú Expandible)

Recuerda que si vas a utilizar algunos de los templates o trucos de DC Templates primero debes leer y estar de acuerdo con las Condiciones de Uso. Gracias por visitar DC Templates y que tengas un buen dia. :)

Rounders Rainbow

2006-05-21T22:20:00.000-07:00

Download

Para mostrar el perfil incluya lo siguiente en el sidebar:

<$BlogMemberProfile$>


Perfil Preview:

Rounders Rainbow2

Download

Perfil Preview:

Los colores de fondo en la cabecera (Título), barra lateral y perfil pueden ser fácilmente editados, si quieres saber como hacer esto visita el foro de daleclick.

Menú Expandible

2006-05-21T16:41:00.000-07:00

Ver Ejemplo | Download

Ver Ejemplo | Download

Menú Dinámico

2006-05-21T14:45:00.000-07:00

Ver Ejemplo | Download

Ver Ejemplo | Download

n2sites template

2006-05-21T09:44:00.000-07:00

El template de n2sites.com

Download

Caspost para Blogger

2006-05-20T22:23:00.000-07:00

Una adaptación del diseño original de castpost para utilizar en tu blog de blogger.

Download

Bordes Redondos

2006-04-30T09:52:00.000-07:00

Download
Diseño original: HTML.it
Adaptado para blogger por: DC Templates

Condiciones de Uso - Templates/Trucos

2006-04-09T10:56:00.000-07:00

Los ususarios de daleclick estan en la libertad de usar y editar los templates de daleclick (DC Templates) a su gusto. Sin embargo, como condicion de uso les pido que por favor no remuevan los enlaces que se encuentran en los mismos hacia DC Templates. Un enlace como el siguiente: (DC Templates™) puede mostrarse en algunos de los templates de daleclick en la parte de abajo. Si quiere puede editar el estilo del mismo si piensa que es muy grande o no le gusta, incluso puede cambiarlo de lugar si quiere e incluirlo en su lista de enlaces favoritos en el "sidebar". Tambien puedes incluir alguno de los botones de DC Templates. Les agradezco su cooperacion en este asunto y que mantengan los links en los templates como forma de agradecimiento ya que asi otros usuarios pueden encontrar a DC Templates y beneficiarse de este blog.

Gracias por tu visita y como siempre que tengas un buen dia. :)

Ayuda Blogger

2006-02-17T20:10:00.000-08:00

Para ayuda blogger ve a ayuda-blogger.blogspot.com o visita el foro de daleclick.

Contacto

2006-02-17T20:08:00.000-08:00

N2 Templates

2006-02-12T11:32:00.000-08:00

DC 3 Columnas

2006-01-30T16:42:00.000-08:00

Download

DC Template

2006-01-28T19:28:00.000-08:00

Download

Cuadrado & Blog Templates

2006-01-21T11:51:00.000-08:00

Cuadrado

Ver Ejemplo | Download

Blog [flash]

Download

Forma para enviar comentarios

2006-01-17T20:30:00.000-08:00

Para incluir una forma para enviar comentarios en las páginas de los artículos (post-pages) incluya el siguiente código justamente bajo </BlogItemComments>

Código:


<div id="cform"><form action="http://www.blogger.com/login-comment.do" onsubmit="isSubmit=true;" method="post">
<input type="hidden" name="blogID" value="<$BlogID$>">
<input type="hidden" name="postID" value="<$BlogItemNumber$>">
<div id="cbody">
<div id="identity-options"> <div>
<div>
<label for="uname"> Nombre </label>
<div class="errorbox-good">
<input type="text" name="anonName" value="" maxlength="100" id="uname" class="text"> </div>
<label for="url"> Web <font size=1>(Opcional)</font></label>
<div class="errorbox-good">
<input type="text" name="anonURL" value="" maxlength="100" id="url" class="text">
</div>
</div><div> <input type="hidden" name="iden" value="Other" id="iden-other">
<label id="iden-other-label" for="iden-other"></label>
<input type="hidden" name="iden" value="Anon" id="iden-anon">
<label id="iden-anon-label" for="iden-anon"></label> </div></div></div>Comentario<br>
<textarea name="postBody" tabindex="1" class="comment" rows="11" cols="40" id="comment-body"></textarea>
<div class="errorbox-good">
</div> <p class="buttons">
<input style="margin-right:.3em" name="post" value="Publicar Comentario" class="publish" onclick="isSubmit=true;" type="submit" id="FinalPublish" tabindex="5">
<input value="Vista Previa" type="submit" name="preview" onclick="isSubmit=true;" tabindex="6"> </p>
</form></div></div>


Esto solo se muestra cuando el usuario esta viendo el artículo a través de los de los enlaces de los "artículos" (Post-pages). Para que el usuario vaya directo a la forma si está viendo el artículo en la página principal (MainPage) o por medio de los archivos o calendario debe cambiar el enlace de "comments" justamente luego de <BlogItemCommentsEnabled> por:

Código:
<a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemCommentCount$> comments</a>

...esto hace la misma función que al hacer click en la hora y/o fecha del artículo.

nota: La forma anterior imita la forma que se muestra en la página de enviar comentarios cuando no está activada la opción de "comentarios en ventana emergente".

Flor Template

2005-12-30T06:59:00.000-08:00

Download

Enlaces para daleclick-templates!

2005-12-15T17:46:00.000-08:00

Código:
<a href="http://daleclick-templates.blogspot.com" target="_blank" title="Daleclick Templates"><img src="http://www.n2sites.com/daleclick/dc_templates.PNG"></a>

DC Templates™

Código:
<a href="http://daleclick-templates.blogspot.com" target="_blank" title="Daleclick Templates"><font face="Verdana" size=1 color="black"><b>DC Templates™</b></font></a>

Código:
<a href="http://daleclick-templates.blogspot.com" target="_blank" title="Daleclick Templates"><img src="http://photos1.blogger.com/blogger/7678/802/1600/boton_templates.1.png" border=0></a>

Código:
<a href="http://daleclick-templates.blogspot.com" target="_blank" title="Daleclick Templates"><img src="http://photos1.blogger.com/blogger/7678/802/1600/boton_templates.png" border=0></a>

Código:
<a href="http://daleclick.pro-board.com" target="_blank" title="Foro de Daleclick!"><img src="http://photos1.blogger.com/blogger/7678/802/1600/boton_foro.0.png" border=0></a>

Código:
<a href="http://daleclick.pro-board.com" target="_blank" title="Foro de Daleclick!"><img src="http://photos1.blogger.com/blogger/7678/802/1600/blogger.png" border=0></a>

Código:
<a href="http://daleclick.blogspot.com" target="_blank" title="HTML Basico"><img src="http://photos1.blogger.com/blogger/7678/802/320/d_click1.GIF" border=0></a>

Código:
<a href="http://daleclick.blogspot.com" target="_blank" title="HTML Basico"><img src="http://photos1.blogger.com/blogger/7678/802/1600/html_boton.png" border=0></a>

Código:

<a href="http://daleclick-templates.blogspot.com/2005/12/blogger-emoticons.html" target="_blank"><img src="http://photos1.blogger.com/blogger/7678/802/1600/be_blogger_emoticons.png" border="0" title="Blogger Emoticons"></a>

Blogger Emoticons

2005-12-01T18:52:00.000-08:00

Cambia :) por automágicamente!

Pasos:
1) Copia y pega en los heads de tu blog el siguiente código: 
<script type="text/javascript">

</script>


2) Cambie el <body> en tu blog por: <body id="body" onload="replaceText();">

3) Guarda y publica!

nota: Algunos blogs tiene por defecto una línea de borde en las imágenes, por lo tanto las emoticons pueden salir con bordes a su alrededor. Para deshabilitar esto debe buscar en su template donde se encuentran las propiedades css de las imágenes y cambiar a cero (0).

Para pruebas o preguntas.
www.bloggeremoticons.be

Calendario para Blogger

2005-11-28T09:15:00.000-08:00

Para colocar un calendario en su blog de blogger siga los siguientes pasos:

1) Entre los heads de su blog va pegar las siguientes piezas de código:
<style type="text/css">@import url("http://daleclick.freeownhost.com/jscalendar-1.0/calendar-clear.css");
</style>
<script type="text/javascript" src="http://daleclick.freeownhost.com/jscalendar-1.0/calendar.js">
</script>
<script type="text/javascript" src="http://daleclick.freeownhost.com/jscalendar-1.0/lang/calendar-es.js">
</script>
<script type="text/javascript" src="http://daleclick.freeownhost.com/jscalendar-1.0/calendar-setup.js">
</script>
<script type="text/javascript" src="http://daleclick.freeownhost.com/jscalendar-1.0/blogger.js">
</script>

2) Busque en su template donde dice <body> y cambie por: <body onload="calendar()">

3) Ahora busque en su template donde quiera colocar su calendario y pegue este código: <div id="calendar-container"></div>

4) Ahora busque la sección de su template donde quedan los archivos, esta sección debe contener estos códigos: <MainOrArchivePage></MainOrArchivePage> y reemplaze esos códigos por: <div id="archive"></div>

5) Guarde y publique su blog y vaya a "Settings" >> "Archiving" >> "Archive Frequency" y seleccione la opción de "Daily" y guarde.

Finalmente debe ir nuevamente a "Settings" >> "Formatting" >> "Archive Index Date Format" y cambielo a "2005-00-00", tambien hágalo en la opción de "Date Header Format", cambielo a "2005-00-00", guarde y publique su blog. Ver Calendario!

El estilo de calendario que se mostrará NO es el mismo que vez en este blog, para cambiar el estilo busca la primera línea del código y cambia clear.css por:

blue.css
blue2.css
brown.css
clear.css (daleclick)
green.css
system.css
tas.css
win2k-1.css
win2k-2.css
win2k-cold-1.css
win2k-cold-2.css

Nota: Este calendario parte de un hosting compartido, por lo tanto puede que en algún momento deje de funcionar debido a la cantidad de banda ancha que se consuma durante el mes o que se ponga lento si es que muchas personas instalan el mismo en su blog. Para evitar esto usted puede instalar su calendario en un hosting privado, aparte, como lo hice yo, de ese hosting es que parte el calendario que se muestra en este blog y todos aquellos que decidan instalarlo con las instrucciones mencionadas anteriormente. Para hacer esto por su cuenta, en su propio hosting deberá seguir otros pasos y unas instrucciones un poco más detalladas pero no imposibles. Ecmanaut te explica como hacerlo.

Preguntas sobre el calendario favor responder a este post.

Fuente del Calendario: Ecmanaut

Café Template

2005-11-25T10:21:00.000-08:00

Ver Ejemplo | Download

Mariposas Template "En Flash!!!"

2005-11-10T10:02:00.000-08:00

Ver Ejemplo | Download

Enlaces Rotantes

2005-11-03T06:08:00.000-08:00

¿Haz visto los enlaces rotantes de la página principal de blogger? Con este código puedes lograr ese efecto en tu blog. Copia y pega este código justamente entre los <head></head> de tu blog.

Luego copia la siguiente pieza de código en tu template donde quieras mostrar los enlaces:


<div id="tab">
<div id="recent-changes-box">
<ul id="recent-changes">
<li><a href="http://google.com">Google1</a>
</li>
<li><a href="http://blogger.com">Blogger2</a>
</li>
<li><a href="http://gmail.com">G-mail3</a>
</li>
<li><a href="http://daleclick.net">Daleclick4</a>
</li>
<li><a href="http://wikeo.com">Wikeo</a>
</li>
</ul>
</div>
</div>


Este código puede que muestre errores si estas usando algun otro código como el del calendario y/o en templates que utilicen la palabra "tab" en su css. Para evitar esto te recomiento que lo hagas desde un iframe o sea, incluir el código en un documento .html que se encuentre en un "hosting" aparte y mostrar los enlaces desde un iframe dentro del template, por lo general en el "sidebar" o barra lateral.

Ejemplo:

Ahora bien, en el código existen 3 partes que puedes editar segun tu gusto y para el funcionamiento correcto del mismo. La primera es bastante arriba al inicio del código donde dice:

<style type="text/css">
.hide{display:none;}
.show{display:inline;}
#tab {background:none;margin-top:0px;}
#tab li {padding:0 0 0 0px;}
#tab ul#recent-changes {height:54px;width:180px;padding:0px;}
</style>

...donde 54 se refiere a la altura de la ventana que muestra los enlaces rotantes ya que si vas a incluir mas de 3 enlaces a simple vista (algo que voy a explicar ahora) esta debe ser un poco más grande; y donde 180 se refiere a el ancho ya que si vas a incluir un enlace extenso puede que no se muestre todo si este número es muy bajito.

Otra parte que debes prestar atención en el código es casi al final donde dice:

<script type="text/javascript" language="Javascript"> </script>

...donde 2500 se refiere al "tiempo que tarde en cambiar de un link a otro", 2 se refiere al "número de enlaces que deseas mostrar a primera vista" y 100 se refiere a la "velocidad del movimiento al cambiar de un link a otro".

Finalmente para cambiar el estilo y color de los enlaces debes hacerlo directamente antes de cada palabra en el enlace; por ejemplo si uno de los enlaces dice Click Aquí, deberás incluir el código para modificar el estilo del enlace, así:

<li><a href="http://loquesea.com"><font color="red" face="Verdana" size=1>Click Aquí</font></a></li>

...igual que en el ejemplo, justamente antes de la palabra NO antes del código de enlace <a href...

Si tienes preguntas sobre este código favor visitar el foro de daleclick, gracias.

Aroba Template

2005-11-03T06:00:00.000-08:00

Ver Ejemplo | Download

Rojo

Download

Anaranjado

Download

Editar Comentarios

2005-10-28T18:55:00.000-07:00

Para editar un comentario de su blog haga click en el icono de borrar [], cambie "delete-comment" por "post-edit" en la barra de URL y presione "Enter" o "GO".

También puede incluir el siguiente código justamente al lado de <$BlogCommentDeleteIcon$> en su template.

Código:

Para ver el número correspondiente a XXX y YYY en su blog debe ir a su blog estando log-in y hacer click en Ver Código Fuente, en el código fuente buscas donde dice <span class="item-control admin-123456789 pid-123456789"><a style="bo... etc. etc. (debe ser un número NO 123456789 es solo un ejemplo) y cambias el número que ves en el código fuente de tu blog en el código y listo. Esto hace que el enlace para editar comentarios solo sea visto por ti como administrador del blog y únicamente cuando estes log-in, igual que para editar tus artículos.

Preguntas? Foro de daleclick - Editar Comentarios

Preguntas

2005-10-28T18:28:00.000-07:00

Si tienes duda de como funciona alguno de los códigos o scripts visita el foro de daleclick donde encontrarás una serie de tópicos donde puedes encontrar la contestación a tus preguntas. Suerte!

Contacto

2005-10-28T18:24:00.000-07:00

HTML Básico para aficionados:
http://www.daleclick.net
-->http://daleclick.blogspot.com

Foro:
http://daleclick.pro-board.com

G-mail
daleclick@gmail.com

Hotmail
daleclick_blog@hotmail.com

nota: para preguntas visita el foro!