subrayar texto
<u>aquí va el texto subrayado</u>
NOTA: haré más adelante un post agrupando todos los códigos básicos...o algún menú desplegable en la sidebar para acceder a ellos...ya veremos.
mover la fecha de los post
Así que me decidí a consultar directamente a los bloggenios y fue JMiur el que a un chasquido de dedos me da la respuesta y aquí la almaceno por si me hace falta más adelante configurarla y para que algún fugaz visitante disfrute de ella.
Explicación:
1.Entramos en Panel/Diseño/Edición HTML/Expandir plantilla de artilugios y buscamos el siguiente código:
<b:if cond="data:post.dateHeader">
<h2 class="date-header"><data:post.dateheader></data:post.dateheader></h2>
</b:if>
2. Ahora cortamos el código:
<h2 class="date-header"><data:post.dateheader></data:post.dateheader></h2>
JMiur recomienda "comentar" ésta línea de código para no perder su situación original (por si hay que restaurarla):
<!-- <h2 class="'date-header'"><data:post.dateheader/></h2> -->
poniéndola entre los símbolos
<!-- línea de código -->
3. Pegamos ésa línea aquí:
<b:includable id="post" var="post">
<div class="post">
<a name="data:post.id">
<b:if cond="data:post.title">
</b:if></a><h3 class="post-title"><a name="data:post.id">
<b:if cond="data:post.link">
</b:if></a><a href="data:post.link"><data:post.title></data:post.title></a>
<b:else>
<b:if cond="data:post.url">
<a href="data:post.url"><data:post.title></data:post.title></a>
<b:else>
<data:post.title>
</b:if>
</b:if>
</h3>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
mensaje subliminal
Muy agitada debe ser la vida de uno cuando algo así te calma....jajaja. mamaladilla's therapy
nube de etiquetas
Pasos:
1. justo antes del código:
]]></b:skin>:
2. pego éste otro código:
/* NUBE
----------------------------------------------- */
#labelCloud {text-align:center;font-family:arial,sans-serif;}
#labelCloud .label-cloud li{display:inline;background-image:none !important;padding:0 5px;margin:0;vertical-align:baseline !important;border:0 !important;}
#labelCloud ul{list-style-type:none;margin:0 auto;padding:0;}
#labelCloud a img{border:0;display:inline;margin:0 0 0 3px;padding:0}
#labelCloud a{text-decoration:none}
#labelCloud a:hover{text-decoration:underline}
#labelCloud li a{}
#labelCloud .label-cloud {}
#labelCloud .label-count {padding-left:0.2em;font-size:8px;color:#fff}
#labelCloud .label-cloud li:before{content:"" !important}
3. localizamos el código </head> y justo antes pegamos éste:
// LabelCloud User Variables
var cloudMin = 1;
var maxFontSize = 30;
var maxColor = [25,25,112];
var minFontSize = 10;
var minColor = [100,149,237];
var lcShowCount = false;
</script>
4. Ahora tendremos que SUSTITUIR toda una porción de código, que es la que está entre:
..............
<b:widget id='Label1' locked='false' title='Label Cloud' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div id='labelCloud'/>
<script type='text/javascript'>
// Don't change anything past this point -----------------
// Cloud function s() ripped from del.icio.us
function s(a,b,i,x){
if(a>b){
var m=(a-b)/Math.log(x),v=a-Math.floor(Math.log(i)*m)
}
else{
var m=(b-a)/Math.log(x),v=Math.floor(Math.log(i)*m+a)
}
return v
}
var c=[];
var labelCount = new Array();
var ts = new Object;
<b:loop values='data:labels' var='label'>
var theName = "<data:label.name/>";
ts[theName] = <data:label.count/>;
</b:loop>
for (t in ts){
if (!labelCount[ts[t]]){
labelCount[ts[t]] = new Array(ts[t])
}
}
var ta=cloudMin-1;
tz = labelCount.length - cloudMin;
lc2 = document.getElementById('labelCloud');
ul = document.createElement('ul');
ul.className = 'label-cloud';
for(var t in ts){
if(ts[t] < cloudMin){
continue;
}
for (var i=0;3 > i;i++) {
c[i]=s(minColor[i],maxColor[i],ts[t]-ta,tz)
}
var fs = s(minFontSize,maxFontSize,ts[t]-ta,tz);
li = document.createElement('li');
li.style.fontSize = fs+'px';
li.style.lineHeight = '1';
a = document.createElement('a');
a.title = ts[t]+' Posts in '+t;
a.style.color = 'rgb('+c[0]+','+c[1]+','+c[2]+')';
a.href = '/search/label/'+encodeURIComponent(t);
if (lcShowCount){
span = document.createElement('span');
span.innerHTML = '('+ts[t]+') ';
span.className = 'label-count';
a.appendChild(document.createTextNode(t));
li.appendChild(a);
li.appendChild(span);
}
else {
a.appendChild(document.createTextNode(t));
li.appendChild(a);
}
ul.appendChild(li);
abnk = document.createTextNode(' ');
ul.appendChild(abnk);
}
lc2.appendChild(ul);
</script>
<noscript>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>
</noscript>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
NOTA: Como siempre digo, todo ésto lo tengo a modo de guión propio, quien busque profundizar en los códigos éste no es su sitio (ni de coña) bebed de las fuentes, aquí os dejo unas pocas
desplegar partes del blog
1. descargamos el archivo scriptaculous-js-1.8.1
2. alojamos los archivos "prototype.js", "scriptaculous.js", "builder.js", "effects.js", "dragdrop.js", "controls.js" y "slider.js"; por ejemplo en googlepages
3. en diseño/edición html buscamos </head> y justo antes pegamos el siguiente código:
<script type="text/javascript" src="URLdelfichero prototype.js"></script>
<script type="text/javascript" src="URLdelfichero scriptaculous.js?load=effects"></script>
Sustituimos lo que está destacado en blanco por la "ruta de enlace" de cada uno de esos archivos que tengamos en googlepages (botón secundario/copiar ruta de enlace)
4. ahora, cada vez que queramos emplear éste efecto pondremos el siguiente código:
<a href="#" onclick="Effect.toggle('nombreunico','blind'); return false">ver/ocultar (+/-)</a>texto
<div id="nombreunico" style="display: none;"><div>elementoaver/ocultar</div></div>
significando lo que está destacado en blanco:
nombreunico:aquí pondremos un nombre (único y exclusivo!!) el que queramos al elemento al que le aplicamos dicho efecto
ver/ocultar (+/-): texto o imagen en la que clicamos para expandir el elemento oculto
texto: si queremos poner un texto entre el enlace anterior y el elemento a expandir
elementoaver/ocultar:la foto/texto/vídeo o lo que queramos expandir
NOTA: hay 3 efectos, blind, appear y slide (a gusto del bloggeador).
Et voilá, ésto lo he adaptado a mis entendederas de la explicación que oloblogger hace del efecto.
letra de inicio GIGANTE
Antes de:
</head>
pegamos lo siguiente:
<style type='text/css'>
.letrag {
float:left;
color: #990000;
font-size:100px;
font-family:none;
line-height:80px;
padding-top:1px;
padding-right:5px;
}
</style>
A partir de ahora y cada vez que queramos éste aspecto para los post deberemos hacer lo siguiente, supongamos (como en éste caso) que la L es la primera letra del post, el código sería:
<span class="letrag">L</span>
Hay la posibilidad de que ésta letra aparezca de manera automática al crear una entrada de forma que no tengamos que escribir el código cada vez que creemos una entrada, nos vamos a Configuración/Formato y en el recuadro que hay al final pegamos el código anterior.
Y seguimos para la configuración total.
He añadido éste color a algunas partes de los textos para decir donde lo puedo encontrar....cosas mías.
tópicos subvencionados
Toda ésta perorata la he soltado porque si a la porquería emitida le añadimos que alimenta tópicos, entonces el hedor es insoportable y si además quien lo perpetra es una cadena pública (directamente del bolsillo al vertedero) dan ganas de apearse en marcha del mundo G. Marx.
Lo único que me reconcilia con tanta malversación de dinero y torpeza de miras es la sacrosanta ironía y el saber que ésta visión de las cosas no es única sino que a mas de uno le repugna y aporta su granito de arena para ridiculizar tanta basura. Gracias Gran Wyoming.
cambiar el color del link
a:hover {
color:#f5f5f5;
text-decoration:underline;
}
donde cambiaremos lo que queramos modificar; en mi caso he quitado el subrayado (valor "none" donde pone "underline") y he cambiado el color a blanco "puro" #ffffff. Quedando el código de ésta guisa:
a:hover {
color:#ffffff;
text-decoration:none;
}
Es el efecto que más me gusta, destaca y es simple...puf cómo ha sonado ésto, jeje.
paradiso (messenger)
Primero he dado con un programa llamado PolygamyDellMessenger pero no me va con mi versión de msn ¿? (ni idea). Siguiendo buscando doy con el paradiso que es más modelo tipo pack, es decir, entre la cantidad inmensa de funciones tb ofrece ésta...vale, no me gustan mucho esos programas monstruosos pero tampoco voy a utilizarlo más que para lo dicho.
Si encuentro alguna otra utilidad práctica en éste programa lo postearé para la posteridad.
talento
Por cierto, si a alguien le ofende lo siento...por él.
modificar el interlineado
.post-body {
margin:0 0 .75em;
line-height:1.6em;
}
En la que tendremos que modificar el 1.6 en la línea "line-height:1.6em;"
Recordar que ésto sirve para la plantilla mínima que es la mía. Ciao.
poner la fecha en la sidebar
<script type="text/JavaScript">
var mydate=new Date()
var year=mydate.getYear()
if (year <1000)
year+=1900
var day=mydate.getDay()
var month=mydate.getMonth()
var daym=mydate.getDate()
if (daym<10)
daym="0"+daym
var dayarray=new Array("Domingo","Lunes","Martes","Miercoles","Jueves","Viernes","Sabado")
var montharray=new Array("01","02","03","04","05","06","07","08","09","10","11","12")
document.write("<medium> Hoy estamos a "+dayarray[day]+" "+daym+" "+montharray[month]+" "+year+"</medium>")
</script>
cómo hacer feliz a una mujer
COMO HACER FELIZ A UNA MUJER (me parece que no es tan complicado)
Para hacer feliz a una mujer basta ser :
1. Amigo
2. Compañero
3. Amante
4. Hermano
5. Padre
6. Maestro
7. Educador
8. Cocinero
9. Carpintero
10. Fontanero
11. Mecánico
12. Decorador
13. Estilista
14. Sexólogo
15. Ginecólogo
16. Psicólogo
17. Psiquiatra
18. Terapeuta
19. Audaz
20. Organizado
21. Buen padre
22. Muy limpio
23. Simpático
24. Atlético
25. Dulce
26. Detallista
27. Galante
28. Inteligente
29. Gracioso
30. Creativo
31. Tierno
32. Fuerte
33. Comprensivo
34. Tolerante
35. Prudente
36. Ambicioso
37. Capaz
38. Valiente
39. Determinado
40. Fiable
41. Respetuoso
42. Apasionado
SIN OLVIDAR:
43. Hacer cumplidos a menudo
44. Adorar ir de compras
45. No montar follones
46. Ser muy rico
47. No ponerla de los nervios
48. No mirar a otras mujeres
Y AL MISMO TIEMPO TAMBIEN SE HA DE:
49. Estar muy por ella sin llegar a ser celoso
50. Llevarse bien con su familia pero dedicándole siempre el mismo tiempo a ella.
51. Dejarle espacio pero mostrarle interés por lo que hace
ES MUY IMPORTANTE, no olvidar nunca:
Cumpleaños
Aniversarios
Bodas
Desgraciadamente, incluso cumpliendo estas reglas a rajatabla, su felicidad no está garantizada, ya que podría sentirse agobiada por una vida de asfixiante perfección y largarse con el primer desgraciado-alcohólico-mujeriego que encuentre.
COMO HACER FELIZ A UN HOMBRE:
1. Follar (y solo de vez en cuando)
2. Dejarlo en paz
eliminar el número de las etiquetas
ANTES
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>
<data:label.name/>
</a>
</b:if>
<span dir='ltr'>(<data:label.count/>)</span>
</li>
</b:loop>
</ul>
DESPUÉS
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>
<data:label.name/>
</a>
</b:if>
<span dir='ltr'>
</li>
</b:loop>
</ul>
goodnight moon
hacer desaparecer la navbar
Pero un servidor de ustedes tiene un código estético muy contrario al de nuestros amigos de blogger y si el blog es mío lo será hasta el último píxel que lo compone y cualquier elemento ajeno a mi gusto será considerado inmediatamente enemigo a abatir y así será. De modo que ahora la he tomado con la dichosa barrita navbar, eliminémosla pues:
Buscamos en el código html (ctrl+f) algo así:
xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
y justo antes de <head> ponemos el siguiente código:
<style type="text/css">
#navbar-iframe
{height:0px;visibility:hidden;display:none;}
</style>
quedando lo siguiente:
xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<style type="text/css">
#navbar-iframe
{height:0px;visibility:hidden;display:none;}
</style>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[/*
Et voilá, ya he dado un paso más en el camino hacia la autocomplacencia bloguera.
escribir código html en un post
introducir código html en los post; si lo hacemos tal cual, blogger entiende que estás metiendo
líneas de código e intenta ejecutarlas dando ERROR continuamente.
La solución es simple, consiste en sustituir los símbolos "estrictamente mayor y menor" (es decir, los símbolos < y > por & l t; código & g t; respectivamente hallá donde aparezcan (& l t; y & g t; se escribirán sin espacio entre las letras)
tachando palabras
paso 1: nos vamos a Crear entrada
paso 2: escribimos el texto
paso 3: localizamos la palabra o palabras que queremos que aparezcan tachadas
paso 4: antes y después de la palabra localizada escribiremos <s>palabro</s>
paso 5: guardamos el texto
paso 6: le damos a vista previa para comprobar que lo hemos hecho bien
paso 7: nos tomamos un azucarillo por lo bien que lo hemos hecho
Éste
malditas mayúsculas
emplearlo cuando
colores no soy "colorófobo" pero casi (al explicar un código están justificados). Ahora, eso
si, a lo que no renuncio es al "cursivicidio" tengo prohibido ese modelo de letra por
absurda...inclinar el texto, ¿en que puedes estar pensando para hacer eso?. Bueno, a lo que
voy, el siguiente paso que me interesa para no tener que ver el lamentable aspecto que ofrece
blogger por defecto es quitar todo rastro de mayúsculas y para eso hago lo siguiente:
Me voy al código html/expandir plantilla de artilugios/pulso Ctrl+F y en el recuadrito escribo
"uppercase", ahora en cada sitio donde encuentre un "uppercase" lo sustituiré por "normal" y
fin del "problemo". Algunos de los sitios donde he encontrado "uppercase" son:
#header h1 {
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:normal;
letter-spacing:.2em;
font: $pagetitlefont;
}
(el título del blog)
h2 {
margin:1.5em 0 .75em;
font:$headerfont;
line-height: 1.4em;
text-transform:normal;
letter-spacing:.2em;
color:$sidebarcolor;
}
(las cabeceras de los post, el perfil, las entradas....)
.post-footer {
margin: .75em 0;
color:$sidebarcolor;
text-transform:normal;
letter-spacing:.1em;
font: $postfooterfont;
line-height: 1.4em;
}
(el texto bajo cualquier post:autor, etiqueta...)
Y ASÍ SUCESIVAMENTE EN TODOS LOS QUE QUERAMOS VARIAR (p.ej. aquí se justifican las mayúsculas)
Ni que decir tiene que todo lo dicho anteriormente es criterio exclusivo de alfonsete del que
existirán tantas variantes como seres pueblan el planeta, así es y así debe ser.
Ahora que leo lo que escribo y el modo en que me expreso en cuestiones de códigos veo que es
totalmente de andar por casa, sin explicaciones técnicas....bueno, quien busque eso es mejor
que se vaya a alguno de los auténticos genios que he mencionado antes, ellos darán mejor
explicación del por que de todo ésto. Es mas un guión personal que un intento de ayuda.
Saludos a mis millones de fanáticos de ésta y las demás galaxias XD.
ancho del blog
/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper {
width: 920px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
#main-wrapper {
width: 680px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
cambio en los tres # los valores de width (ancho en inglés). De éste modo tengo un blog más ancho y "apetecible" deleer.
Observamos que ha cambiado el ancho del blog pero no de la cabecera (header) para ello
busquemos los códigos
#header-wrapper {
width:920px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
y
#header .description {
margin:0 5px 5px;
padding:0 20px 15px;
max-width:920px;
text-transform:normal;
letter-spacing:.2em;
line-height: 1.4em;
font: $descriptionfont;
color: $descriptioncolor;
}
haciendo coincidir sus anchos con los de outer wrapper.
Idem para el footer:
/* Footer
----------------------------------------------- */
#footer {
width:920px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:normal;
letter-spacing:.1em;
text-align: center;
}