[+/-] Barra de navegación Horizontal

La barra de navegación horizontal le permite cambiar de pagina, funcionan como pestañas, son de diferentes colores y pueden ir al link que usted prefiera.

Este código funciona con cualquier plataforma que funcione con HTML y CSS, aqui les pongo las intrucciones de como se aplica este código.
Para ver un ejemplo de estas barras de navegacion horizontal visite mi otro blog

.

El código es el siguiente:

<div id='menu'><ul><li id='current'><a href='http://TuBlogEnlace0'><span>Titulo</span></a></li><li><a href='http://TuBlogEnlace1'><span>Titulo</span></a></li><li><a href='http://TuBlogEnlace2'><span>Titulo</span></a></li><li><a href='http://TuBlogEnlace3'><span>Titulo</span></a></li> </ul></div>

/!\ En esta entrada se asume que tienes conocimientos de como editar la plantilla. Si no sabes como o donde se modifica, revisa esta entrada: Donde editar el código HTML de nuestra plantilla.

Solo sustituye las palabras en rojo por sus links y titulos de cada pestaña (Puede Agregar las que quiera).Si estas en blogger entra a Edición de HTML y selecciona la casilla Expandir plantillas de artilugios ya aqui busca la siguiente linea, y justo antes de esto el código anterior:

<div id='content-wrapper'>

Ahora, simplemente tenemos que seleccionar el Código CSS, si no usan Blogger simplemente tienen que implementarlo como cualquier otro elemento CSS, ahora si están usando Blogger tendrán que buscar:

]]></b:skin>

ahora solo elijan un color de pestañas y coloquen el código antes del anterior:

/* Dorado  ////////////////////*/#menu ul {  margin:0;  list-style:none;  }#menu li {  display:inline;  margin:0;  padding:0;  }#menu a {   float:left;  background:url(http://img508.imageshack.us/img508/971/hgoldljp3.gif) no-repeat left top;  margin:0 1.5px 0 1.5px;  padding:0 0 0 4px;  text-decoration:none;  }#menu a span {  float:left;  display:block;  background: url(http://img505.imageshack.us/img505/7849/hgoldrzx4.gif) no-repeat right top;  padding:5px 12px 4px 12px;  color:#fff;  }#menu a span {  font: bold 12px Arial, Helvetica, sans-serif;  color:#faf4d0;  float:none;  }#menu a:hover span {  color:#fff;  }#menu a:hover {  background-position:0% -27px;  }#menu a:hover span {  background-position:100% -27px;  }#menu #current a {  background-position:0% -27px;  }#menu #current a span {  background-position:100% -27px;  color:#fff  }.clear {  clear:left  }/* Fin de Barra */

/*Rojo ////////////////////*/#menu ul {   margin:0;   list-style:none;  }#menu li {  display:inline;  margin:0;  padding:0;  }#menu a {  float:left;  background:url(http://img508.imageshack.us/img508/8383/redlhh5.gif) no-repeat left top;  margin:0 1.5px 0 1.5px;  padding:0 0 0 4px;  text-decoration:none;  } #menu a span {  float:left;  display:block;  background: url(http://img257.imageshack.us/img257/1230/redrme9.gif) no-repeat right top;  padding:5px 12px 4px 12px;  color:#fff;  } #menu a span {  font: bold 12px Arial, Helvetica, sans-serif;  color:#faf4d0;  float:none;  } #menu a:hover span {  color:#fff;  } #menu a:hover {  background-position:0% -27px;  } #menu a:hover span {  background-position:100% -27px;} #menu #current a {  background-position:0% -27px;  } #menu #current a span {  background-position:100% -27px;  color:#fff  } .clear {  clear:left  } /* Fin de Barra */

/*Verde ////////////////////*/#menu ul {   margin:0;   list-style:none;  }#menu li {  display:inline;  margin:0;  padding:0;  }#menu a {  float:left;  background:url(http://img257.imageshack.us/img257/5924/verdelzc1.gif) no-repeat left top;  margin:0 1.5px 0 1.5px;  padding:0 0 0 4px;  text-decoration:none;  } #menu a span {  float:left;  display:block;  background: url(http://img257.imageshack.us/img257/4822/verdercx2.gif) no-repeat right top;  padding:5px 12px 4px 12px;  color:#fff;  } #menu a span {  font: bold 12px Arial, Helvetica, sans-serif;  color:#faf4d0;  float:none;  } #menu a:hover span {  color:#fff;  } #menu a:hover {  background-position:0% -27px;  } #menu a:hover span {  background-position:100% -27px;} #menu #current a {  background-position:0% -27px;  } #menu #current a span {  background-position:100% -27px;  color:#fff  } .clear {  clear:left  } /* Fin de Barra */

/*Azul ////////////////////*/#menu ul {   margin:0;   list-style:none;  }#menu li {  display:inline;  margin:0;  padding:0;  }#menu a {  float:left;  background:url(http://img257.imageshack.us/img257/5375/bluelco2.gif) no-repeat left top;  margin:0 1.5px 0 1.5px;  padding:0 0 0 4px;  text-decoration:none;  } #menu a span {  float:left;  display:block;  background: url(http://img442.imageshack.us/img442/4413/bluermk9.gif) no-repeat right top;  padding:5px 12px 4px 12px;  color:#fff;  } #menu a span {  font: bold 12px Arial, Helvetica, sans-serif;  color:#faf4d0;  float:none;  } #menu a:hover span {  color:#fff;  } #menu a:hover {  background-position:0% -27px;  } #menu a:hover span {  background-position:100% -27px;} #menu #current a {  background-position:0% -27px;  } #menu #current a span {  background-position:100% -27px;  color:#fff  } .clear {  clear:left  } /* Fin de Barra */

/*Rosa ////////////////////*/#menu ul {   margin:0;   list-style:none;  }#menu li {  display:inline;  margin:0;  padding:0;  }#menu a {  float:left;  background:url(http://img257.imageshack.us/img257/9909/rosalvt2.gif) no-repeat left top;  margin:0 1.5px 0 1.5px;  padding:0 0 0 4px;  text-decoration:none;  } #menu a span {  float:left;  display:block;  background: url(http://img523.imageshack.us/img523/7982/rosarjk6.gif) no-repeat right top;  padding:5px 12px 4px 12px;  color:#fff;  } #menu a span {  font: bold 12px Arial, Helvetica, sans-serif;  color:#faf4d0;  float:none;  } #menu a:hover span {  color:#fff;  } #menu a:hover {  background-position:0% -27px;  } #menu a:hover span {  background-position:100% -27px;} #menu #current a {  background-position:0% -27px;  } #menu #current a span {  background-position:100% -27px;  color:#fff  } .clear {  clear:left  } /* Fin de Barra */

[+/-] Página de contacto

Hola pues como a mi me gusta saber a que se dedican los autores de las páginas web etc.. pues aqui les dejo este truco de contacto.

primero tienes que ir a esta página web (que creará por ti un formulario para enviarte un correo electrónico directamente a tu correo)

: emailmeform

despues de entrar tienes que crear una cuenta en sign un for free!!, ya una ves con cuenta en emailmeform te vas a panel de control y haces clic en la opcion Create new form despues tienes que llenar los formularios, despues de ahi tienes que llenar el tamaño de los formularios , despues de ahi veras tu formulario.

arriba de este estará un link de HTML code lo abres y se verá tu código el cual será asi como este:

<form method="post" action="http://www.emailmeform.com/fid.php?formid=9049">
<INPUT TYPE=hidden NAME=FCode VALUE="g5b4rgty">
                  

<table cellpadding="2" cellspacing="0" border="0" bgcolor="#FFFFFF">
<tr>
<td>
<font face="Verdana" size="2" color="#000000">Descripción de mi Forma, saldra en la parte superior</font>
 <div style="" id="mainmsg"> </div>

</td>
</tr>
</table>

<br>

<table cellpadding="2" cellspacing="0" border="0" bgcolor="#FFFFFF">

<tr valign="top">
 <td nowrap><font face="Verdana" size="2" color="#000000">Primer Campo: Ej: TU NOMBRE</font></td>
 <td>
<input type="text" name="FieldData0" value="" maxlength="100" size="30"> </td>
</tr>      

<tr valign="top">
 <td nowrap><font face="Verdana" size="2" color="#000000">... ej. tu email</font></td>
 <td>
<input type="text" name="FieldData1" value="" maxlength="100" size="30"> </td>
</tr>      

<tr valign="top">
 <td nowrap><font face="Verdana" size="2" color="#000000">... ej. tu web</font></td>
 <td>
<input type="text" name="FieldData2" value="" maxlength="100" size="30"> </td>
</tr>      

<tr valign="top">
 <td nowrap><font face="Verdana" size="2" color="#000000">tu mensajito de la muerte</font></td>
 <td>
<textarea name="FieldData3" cols="60" rows="10"></textarea><br> </td>
</tr>      

<tr>
 <td colspan="2">
<table cellpadding=5 cellspacing=0 bgcolor="#E4F8E4" width="100%">
<tr bgcolor="#AAD6AA">
<td colspan="2"><font color="#FFFFFF" face="Verdana" size="2"><b>Image Verification</b></font></td>
</tr>
<tr>
<td style="padding: 2px;" width="10"><img src="http://www.emailmeform.com/turing.php" id="captcha"></td>
<td valign="top"><font color="#000000">Please enter the text from the image</font>   <br><input type="text" name="Turing" value="" maxlength="100" size="10">
 [ <a href="#" onclick=" document.getElementById('captcha').src = document.getElementById('captcha').src + '?' + (new Date()).getMilliseconds()">Refresh Image</a> ] [ <a href="http://www.emailmeform.com/?v=turing&pt=popup" onClick="window.open('http://www.emailmeform.com/?v=turing&pt=popup','_blank','width=400, height=300, left=' + (screen.width-450) + ', top=100');return false;">What's This?</a> ]
</td>
</tr>
</table>
</td>
</tr>
<tr>
 <td> </td>
 <td align="right">
<input type="text" name="hida2" value="" maxlength="100" size="3" style="display : none;">
<input type="submit" class="btn" value="Titulo del Boton/Enviar" name="Submit">    <input type="reset" class="btn" value="  Borrar  " name="Clear"></td>
</tr>
<tr>
<td colspan=2 align="center">
<br>
<font face="Verdana" size="2" color="#000000"> <a href="http://www.emailmeform.com">contact form</a></td>
</tr>
</table>                      

</form>

ahora, si estas en blogger tendras que desactivar los saltos de linea en "configuracion" y despues en "formato" una vez desactivados podras pegar los codigos en una página o entrada en la cual desees que se pongan en contacto con tigo.

[+/-] Insertar video en blogs

Para insertar un video en un blog solamente si el video tiene los suficientes derechos se necesita copiar el código embed que biene junto a otro (URL) de los videos es algo asi como
este:

<object width="425" height="350">
<param name="movie" value="http://www.youtube.com/v/EgATlhZFAfs">
</param>
<param name="wmode" value="transparent">
</param>
<embed src="http://www.youtube.com/v/EgATlhZFAfs" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350">
</embed>
</object>

En las letras rojas debes insertar la url que encontraste dos veces en el código embed
se verá asi

[+/-] Icono de feed en etiquetas

Este codigo lo que hace es poner un icono de feed a cada etiqueta de blogger, de igual manera que las entradas Atom, para ingresar este código es necesario tener los widgets activados (labels). si no lo están, activarlos en configuración, si ya esta comencemos.

/!\ En esta entrada se asume que tienes conocimientos de como editar la plantilla. Si no sabes como o donde se modifica, revisa esta entrada: Donde editar el código HTML de nuestra plantilla.

[1] Debes ingresar a Edición de HTML y seleccionar la opción Expandir plantillas de artilugios.
[2] Ahí buscar el siguiente código:

(<data:label.count/>)

[3] En seguida de este poner:

<a expr:href='data:blog.homepageUrl + "feeds/posts/default/-/" + data:label.name'>
<center>
<img src='http://img180.imageshack.us/img180/1855/synicotc5.png'/>
</center></a>

[Modiicaciones] El texto color rojo es la url de la imagen la cual puede ser cambiado por:

http://img412.imageshack.us/img412/3824/xmlol8.gif

http://img412.imageshack.us/img412/1610/rssen4.png

http://img444.imageshack.us/img444/7574/rsskw6.png

lo guardas y listo!!!!!!!!!

[+/-] Remover la barra de Blogger

Para remover la barra de blogger que muchas veces ayuda, pero que a veces molesta. Es necesario ingresar en Edición de HTML y sin expandir plantillas de artilugios, una vez ahí deberás buscar la siguiente linea de código

/!\ En esta entrada se asume que tienes conocimientos de como editar la plantilla. Si no sabes como o donde se modifica, revisa esta entrada: Donde editar el código HTML de nuestra plantilla.

]]></b:skin>
antes de esta linea de código debes insertar esta otra:

#navbar-iframe {
 height:0px;
 visibility:hidden;
 display:none;
}

Y con esto queda resuelto el problema sobre el navbar de blogger

[+/-] Politica de Privacidad

This Privacy Policy governs the manner in which SantyWeb collects, uses, maintains and discloses information collected from users (each, a "User") of the http://www.santyweb.blogspot.com/ website ("Site"). This privacy policy applies to the Site and all products and services offered by SantyWeb.

Personal identification information

We may collect personally identification information from Users in a variety of ways, including, but not limited to, when Users visit our site, subscribe to the newsletter, fill out a form, and in connection with other activities, services, features or resources we make available on our Site. Users may be asked for, as appropriate, email address, mailing address. Users may, however, visit our Site anonymously. We will collect personal identification information from Users only if they voluntarily submit such information to us. Users can always refuse to supply personally identification information, except that it may prevent them from engaging in certain Site related activities.

Non-personal identification information

We may collect non-personal identification information about Users whenever they interact with our Site. Non-personal identification information may include the browser name, the type of computer and technical information about Users means of connection to our Site, such as the operating system and the Internet service providers utilized and other similar information.

Web browser cookies

Our Site may use "cookies" to enhance User experience. User's web browser places cookies on their hard drive for record-keeping purposes and sometimes to track information about them. User may choose to set their web browser to refuse cookies, or to alert you when cookies are being sent. If they do so, note that some parts of the Site may not function properly.

How we use collected information

SantyWeb collects and uses Users personal information for the following purposes:

• - To improve our Site
  We continually strive to improve our website offerings based on the information and feedback we receive from you.
• - To improve customer service
  Your information helps us to more effectively respond to your customer service requests and support needs.
• - To administer a content, promotion, survey or other Site feature
  To send Users information they agreed to receive about topics we think will be of interest to them.
• - To send periodic emails
  The email address Users provide for order processing, will only be used to send them information and updates pertaining to their order. If User decides to opt-in to our mailing list, they will receive emails that may include company news, updates, related product or service information, etc. If at any time the User would like to unsubscribe from receiving future emails, we include detailed unsubscribe instructions at the bottom of each email or User may contact us via our Site.

How we protect your information

We adopt appropriate data collection, storage and processing practices and security measures to protect against unauthorized access, alteration, disclosure or destruction of your personal information, username, password, transaction information and data stored on our Site.

Sharing your personal information

We do not sell, trade, or rent Users personal identification information to others. We may share generic aggregated demographic information not linked to any personal identification information regarding visitors and users with our business partners, trusted affiliates and advertisers for the purposes outlined above.We may use third party service providers to help us operate our business and the Site or administer activities on our behalf, such as sending out newsletters or surveys. We may share your information with these third parties for those limited purposes provided that you have given us your permission.

Third party websites

Users may find advertising or other content on our Site that link to the sites and services of our partners, suppliers, advertisers, sponsors, licensors and other third parties. We do not control the content or links that appear on these sites and are not responsible for the practices employed by websites linked to or from our Site. In addition, these sites or services, including their content and links, may be constantly changing. These sites and services may have their own privacy policies and customer service policies. Browsing and interaction on any other website, including websites which have a link to our Site, is subject to that website's own terms and policies.

Changes to this privacy policy

SantyWeb has the discretion to update this privacy policy at any time. When we do, we will revise the updated date at the bottom of this page. We encourage Users to frequently check this page for any changes to stay informed about how we are helping to protect the personal information we collect. You acknowledge and agree that it is your responsibility to review this privacy policy periodically and become aware of modifications.

Your acceptance of these terms

By using this Site, you signify your acceptance of this policy. If you do not agree to this policy, please do not use our Site. Your continued use of the Site following the posting of changes to this policy will be deemed your acceptance of those changes.

Contacting us

If you have any questions about this Privacy Policy, the practices of this site, or your dealings with this site, please contact us at:
SantyWeb
http://www.santyweb.blogspot.com/

Página de Contacto

This document was last updated on January 20, 2011

[+/-] Publicidad

(espera)


(espera)


(espera)


(espera)


(espera)
Mini Directorio