Destaca tu logo al comentar como autor

April 15, 2013, 11:14 am

≫ Next: Una simpática forma de compartir en Redes Sociales tus entradas

≪ Previous: Un empate con sabor a derrota - Betis (3-3) Sevilla F.C.

Como habréis observado, son muchos los blogger que tienen colocado al comentar como autor, su logo o imagen carasterictica de su blog. Pués bien, esto es lo que os voy a explicar hoy, la forma de colocar dicho logo o imagen en vuestros blog.
Para ello vamos a utilizar una imagen en base64, para no llamar al http y así aligerar la carga del blog. Esta imagen aparece al lado derecho del nombre del autor del blog como habréis podido observar en la imagen de esta entrada.

Pasos a seguir:
1.- Reducir la imagen que deseamos a 18px por 18px. (usar cualquier editor) .
2.- Subimos la imagen por ejemplo a Picassa y copiamos la URL. (picassa)
3.- La convertimos a Base64 entrando en esta web
Introducimos la URL de la imagen que alojamos en Picassa y clik en "Enviar consulta"

Nos devuelve la imagen ya convertida a Base64,¿un poco larga verdad?, cópiala y guardala.

4.- Vamos a colocar el CSS de la imagen para que esto tenga efecto:
Plantilla > Editar HTML> Buscamos (ctrl+f o la tecla f3) </b:skin>> Expande el CSS y volvemos a buscar </b:skin> y justamente antes colocamos el siguiente código:

.comments .comments-content .icon.blog-author{ background-repeat:no-repeat; background-image:url(IMAGEN BASE64)}

En IMAGEN BASE colocamos la que teníamos guardada antes y listo, ya podemos disfrutar de nuestro logo o imagen en nuestros comentarios.

Si tienes alguna duda.....!No dejes de comentarla!

↧

Una simpática forma de compartir en Redes Sociales tus entradas

April 16, 2013, 12:17 pm

≫ Next: Habilitar comentarios de Google+ en Blogger

≪ Previous: Destaca tu logo al comentar como autor

Hace unos días vimos como instalar una simpática caja de autor para blogger y al final de dicha entrada expuse que era totalmente personalizable para incluir en su interior cualquier cosa. Pues bien, hoy la he adaptado para mostrar los botones de compartir en las diferentes Redes Sociales.

VER DEMO

Si quieres colocar esta original caja para compartir en tu blog, sigue estos pasos:
1.- Plantilla - Editar HTML - buscamos (ctrl+f o F3)

<div class='post-footer-line post-footer-line-1'/> o en su lugar <div class='post-footer-line post-footer-line-2'/>

y justamente debajo pegamos lo siguiente:

<style type="text/css">
.caja{
float:center;}
.base {
position:relative ;
width: 540px;
height: 62px;
margin: 10px auto;
background-color: #f7f7f7;
z-index: 1;
padding: 2px;
-webkit-box-shadow: 0 2px 10px rgba(0,0,0,0.3);
-mox-box-shadow: 0 2px 10px rgba(0,0,0,0.3);
box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}
.izquierda{
position: absolute;
background: #DBDCDE;
bottom: 0;
right: 50%;
left: 0;
top: 0;
border:1px solid #F0F0F0;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
-o-transition:all 0.5s ease-out;
transition: all 0.5s ease-out;
}
.base:hover .izquierda{
right: 100%;
left: -50%;
}
.derecha{
position: absolute;
background: #DBDCDE;
bottom: 0;
left: 50%;
right: 0;
top: 0;
border:1px solid #F0F0F0;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}
.base:hover .derecha{
left: 100%;
right: -50%;
}
.portada {
overflow: hidden;
}
.portada .izquierda {
background: url(https://lh3.googleusercontent.com/-UMYWlCNlNkg/UWvfMjI1cmI/AAAAAAAALMk/5LsBE3_kRRU/s260/IZQU-COMPARTIR.jpg);
border:1px solid #F0F0F0;
z-index: 1;
}
.portada .derecha {
background: url(https://lh5.googleusercontent.com/-XKLiTNqpZsU/UWvfQcs2-tI/AAAAAAAALMs/D9mEWkIvGgw/s260/DERECHA-COMPARTIR.jpg);
border:1px solid #F0F0F0;
z-index: 1;
}
.base img {
margin-top: 15px;
}
.compartir {text-align: center;position:relative;
margin-top:-10px;
border-radius:8px;
margin-bottom:20px;
}
</style>
<div class='caja'>
<div class='base portada'>
<div class='izquierda'></div>
<div class='derecha'></div>
<div class='compartir' id='compartir'>
<table border='0' cellpadding='7'>
<tr>
<td><iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url+ "&layout=box_count&show_faces=false&width=73&height=63&action=like&font=tahoma&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:73px; height:63px;'/></td>

<td><a class='twitter-share-button' data-count='vertical' data-lang='es' href='https://twitter.com/share'>Tweet</a><script src='//platform.twitter.com/widgets.js' type='text/javascript'/></td>

<td><script type='text/javascript'>(function(){var x=document.createElement('script'), s=document.getElementsByTagName('script')[0];x.async=true;x.src='http://widgets.itaringa.net/share.js';s.parentNode.insertBefore(x,s)})()</script>
<t:sharer data-layout='big'/></td>

<td><g:plus action='share' annotation='vertical-bubble' expr:href='data:post.url'/></td>
<td><script src="http://platform.linkedin.com/in.js" type="text/javascript"></script>
<script type="IN/Share" data-counter="top"></script></td>
<td><a expr:href='"http://bitacoras.com/anotaciones/" + data:post.url'><img alt='votar' expr:src='"http://widgets.bitacoras.com/votar/normal/" + data:post.url' style='vertical-align:middle;border:0;float:right; margin-left:10px;' title='Votar este artículo en Bitacoras.com'/></a></td>

</tr>
</table>
</div></div></div>

Guardamos cambios y listo.

↧

Habilitar comentarios de Google+ en Blogger

April 19, 2013, 5:34 am

≫ Next: La realidad supera a la ficción

≪ Previous: Una simpática forma de compartir en Redes Sociales tus entradas

De nuevo Blogger no sosprende, trás la última actualización de su editor, ahora ha introducido un nuevo sistema de comentarios integrado con el perfil o página de Google+. Es muy fácil de implementar en las plantillas predeterminadas, es lo que he podido comprobar en varios blog de pruebas, pero en este personalizado, no podía implantarlo de ninguna forma. Después de explorar varias plantillas conseguí colocarlo con un simple código, creo que será efectivo para todas las plantillas. Aún así, no termina de gustarme este nuevo sistema, pero lo tendré unos días de pruebas.

De momento se aprecian algunos errores, como bien comenta +Oloman Oloman pero como todo lo nuevo siempre suele dar algunos problemitas, esperemos que los técnicos lo solucionen cuanto antes.

Para habilitar estos nuevos comentarios, tendremos que tener vinculado nuestro Blog al perfil o página de Google+ y activar en Blogger en la casilla Google+, "Usar comentarios de Google+ en este blog".

Si habéis seguidos los dos pasos anteriores y aún no os muestra el nuevo sistema, podéis intentar lo siguiente:

1.- Ir a Plantilla> Edición de HTML
2.- Click en plantilla de formato, buscamos con (ctrl+f):

<b:includable id='comment-form' var='post'>

y a continuación colocamos esto:

<div class='cmt_iframe_holder' expr:data-href='data:post.canonicalUrl' expr:data-viewtype='data:post.viewType'/>

Ahora guardamos la plantilla y listo, a mí me dió resultado, espero que también a vosotros.

↧

La realidad supera a la ficción

April 22, 2013, 4:33 am

≫ Next: Reñir para que no te riñan

≪ Previous: Habilitar comentarios de Google+ en Blogger

¿La realidad?.
Sí, la realidad de bajarnos de la nube, los jugadores los primeros y aceptar que no estamos diseñados para pelear por objetivos importantes, sino para estar en la zona tranquila de la tabla sin pasar más apuros de los necesarios.
Lo real de ser conscientes que hay equipos mejor diseñados que el nuestro, uno de ellos sin ir más lejos el que se ha llevado los puntos de Nervión esta noche. Los colchoneros no han pasado más apuros de los previstos en un partido disputado fuera de su casa. Creando peligro. Serios en defensa y esperando su oportunidad, sabiendo que esta llegaría antes o después para desesperación de los sevillistas.
Hoy por hoy no son rival asequible sino más bien de esos que diez veces se cruzan en nuestro camino y perdemos once. No hemos sido capaces de ganarle ni un partido de los cuatro a los madrileños.

¿La ficción?.
De creernos más de lo que somos.
De dejarnos llevar por entusiasmos juveniles cuando Alberto nos pone en la UEFA sí o sí.
De creernos ciegamente que aun podemos conseguir clasificaciones imposibles.
Desde el comienzo del partido se veía venir lo que podía pasar. Partido cada vez poniéndose más feo y sabiendo que al final el Atleti marcaba su gol y lo ponía imposible del todo.
Partido en el que una vez más el Sr. Costa vuelve a demostrar que es tan buen futbolista como marrullero y provocador pero con el que nosotros volvemos a caer una y otra vez. Al parecer no nos enteramos de como se las gasta el señorito.
Pues, tres puntos menos en Nervión. A seguir buscando la salvación de la temporada lo más dignamente posible y a esperar limpieza de verano, esta vez sin más remedio que obligatoriamente.

↧

Reñir para que no te riñan

April 25, 2013, 1:13 am

≫ Next: Esta sí es nuestra Liga de las Estrellas

≪ Previous: La realidad supera a la ficción

Después de transcurridos unos días de la derrota ante el Atco. Madrid me encuentro con una noticia publicada por ahí en la que al parecer nuestro entrenador muestra en su blog un tremendo enfado para con Diego Costa por su actitud antideportiva y marrullera en el partido pasado y en lo que lleva de carrera casi. No sólo molesto con esto, también se dedica a criticar al seno interno colchonero por defender a ultranza a su futbolista en vez de imponerle un castigo ejemplar, que bien podría ser...y esto lo digo yo....no volver a jugar contra los sevillistas.

Ahora bien.

Centrémonos en todo un poco.
Yo le diría primeramente a nuestro entrenador, el cual también dice que pudimos ganar el partido, que en ningún momento tuvimos opciones de ganar el partido por varios motivos deportivos que son los siguientes...El Atco. defendió de "cojones"...nosotros no supimos defender....El Atco. atacó con muchísimo peligro y supieron esperar su oportunidad para meterla y llevarse los puntos....nosotros atacamos bien en ocasiones pero sin saber aprovechar nuestra oportunidad como casi siempre. Los colchoneros nos manejaron a su antojo durante todo el encuentro y...... ¿por qué?. Porque son mejores, tienen mejor equipo y están a otro nivel diferente al nuestro en el que todo le sale y bien.

Esto en lo meramente futbolístico.
En el resto, le diría a nuestro entrenador que lleva razón cuando juzga a Costa pero también le pregunto ¿qué haría usted si lo tuviera en su equipo Emery?.
Seguramente le reiría las gracias y todo serían palmaditas en la espalda al acabar el partido por haber sabido sacar de quicio a los jugadores, entrenadores, presidentes y directivos del equipo rival y encima los tres puntos para la buchaca. O ¿no?.
Sí Emery. Estas cosas duelen cuando te tocan de frente, en caso contrario no importa un carajo a quien le toque y sino ahí está Competición para no sancionar lo sancionable y encima perdonar a lo Jesucristo.
Y ¿yo me voy a amargar con lo que hace o deja de hacer el Costa este?.
Pues no. Tengo cosas más importantes en las que llorar que leer sus tonterías de rabieta sin sentido.
Lo siento míster.

↧

Esta sí es nuestra Liga de las Estrellas

April 28, 2013, 11:59 am

≫ Next: Notable alto

≪ Previous: Reñir para que no te riñan

Esta sí. Esta es la Liga en la que podemos pelear por algo importante, siempre y cuando eso pase por conseguir la permanencia matemática. Es lo más importante por lo que podemos pelear, sino lo úlnico.

Habría muchas cosas que comentar de este partido.

Desde muy pronto se empieza a uno a dar cuenta de detalles como por ejemplo el seguir sin comprender por qué Cala está en las filas del Sevilla, por qué lo repescaron de Grecia y no lo dejaron allí para que terminara su carrera cómodamente. Un central no puede buscarse una tarjeta amarilla en el minuto dos del partido a menos que sea del todo necesaria (no fue el caso), y mucho menos lejos de su puesto.

Otro que debería haberse quedado ayudando a su equipo en tierras cordobesas es Javi Hervás. Un futbolista que se pasa una temporada en blanco pase quien pase por el banquillo como director es por algo y no me vale el hecho de no jugar apenas, si no lo hace es por algo y hoy lo ha demostrado. Su calidad es cortita para Primera División.
Tampoco hemos contado hoy con el buen hacer en los últimos partidos de Rakitic o Reyes. Ambos desaparecidos en combate y con fallos terribles como el de Rakitic que nos cuesta el gol del Valladolid.
No ha sido la noche de Negredo. Fallón el vallecano ante el gol y extremadamente tranquilo en el penalty.

No he llegado a entender el primer cambio de Emery. Alberto entra y sale Cala. Pasa a Navarro al eje de la defensa y deja a Moreno en el lateral. No discuto que Cala saliera por lo anteriormente expuesto pero...no me pareció la mejor opción de cambio, cuando necesitábamos ataque a la desesperada.

Somos el equipo que menos partidos ha ganado lejos del Sánchez Pizjuán y hoy ha quedado claro el porqué.
Desde Septiembre no ganamos fuera, la única vez y fue en casa del Dépor.
Esta es nuestra Liga. Esta sí. La del Valladolid, Levante, Getafe, etc..etc... Porque hasta nuestros vecinos son capaces de hacerlo mejor que nosotros.

↧

Notable alto

May 5, 2013, 12:01 pm

≫ Next: Agregar unos simpáticos iconos flotantes de Redes Sociales en Blogger

≪ Previous: Esta sí es nuestra Liga de las Estrellas

Cuánto nos hubiese gustado ver a este Sevilla durante toda la temporada, y no sólo en los partidos de casa.
Si califico el partido de hoy con un notable alto, rayando el sobresaliente, es no ya por lo contundente del resultado sino más bien por la disciplina empleada, el saber hacer, la recuperación de futbolistas tales como Diego Perotti, un pausado Medel o un pletórico Coke.
Hoy hemos demostrado lo que tanto y tanto echábamos en falta, saber estar arriba y saber estar abajo pasando por una medular con las ideas superclaras.

Hoy se vuelve a dar un pasito adelante. Un pasito, que a ver si de una vez por todas, tiene su recompensa rubricando fuera de casa lo que hacemos dentro, aunque quizás no nos enfrentemos la semana que viene al rival más adeucado para despegar a domicilio.
Nos quedan cuatro encuentros para intentarlo con el consiguiente obstáculo que supone no sacar tajada fuera de casa durante casi toda la temporada y los dos huesos que nos quedan por pisar Nervión...Real Sociedad y Valencia.

Esto es fútbol y es grande por cosas imposibles. Debemos confiar, al menos ahora que nos encontramos pletóricos con la victoria de hoy ante un flojísimo Español.....(que me perdone nuestro comentarista y amigo Perico). De todas formas era de esperar un Español relajado después de conseguir la permanencia matemática y por tirar a favor de los pericos decir, que pronto se encuentran con un gol en propia meta que quieras o no ralla bastante.

Tres puntos más. A rubricar toca.

↧

Agregar unos simpáticos iconos flotantes de Redes Sociales en Blogger

May 8, 2013, 12:21 pm

≫ Next: Ranking EBUZZING del Sevillismo en el mes de Mayo (2013)

≪ Previous: Notable alto

Hoy os voy a mostrar la forma de agregar unos simpáticos iconos de redes sociales flotantes en Blogger. Con ellos les permitirá a sus lectores del blog que se conecten o suscriban a su blog a través de los diferentes medios sociales. Se encuentran flotando a la derecha o la izquierda de su blog.

En este tutorial, los sitios sociales que he incluido son Facebook, Twitter, Google+ y RSS. Así que veamos como instalarlos.

VER DEMO

1.- Entrar en panel de administración - Diseño - Añadir un gadget HTML/Javascript y pega el siguiente código:

<style type="text/css">.redes-flotantes {
position: fixed;
right: 5px;
top: 40%;
}
.redes-flotantes img {
float: right;
clear: right;
margin: 5px;
-moz-transform: scale(.8) ;
-webkit-transform: scale(.8) ;
-o-transform: scale(.8) ;
-ms-transform: scale(.8) ;
transform: scale(.8) ;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.redes-flotantes img:hover {
-moz-transform: scale(1.1) rotate(6deg);
-webkit-transform: scale(1.1) rotate(6deg);
-o-transform: scale(1.1) rotate(6deg);
-ms-transform: scale(1.1) rotate(6deg);
transform: scale(1.1) rotate(6deg);
}</style>
<div class='redes-flotantes'>

<a href='URL DE TWITTER' target='blank'><img alt='Twitter' height='48' src='https://lh3.googleusercontent.com/-HiZe1pm_Rok/ToE0l_3Wl4I/AAAAAAAACvY/ztE85o-w3Lg/s800/Fa_Twitter_creatures.png' width='48'/></a>

<a href='URL PAGINA FACEBOOK' target='blank'><img alt='Facebook' height='48' src='https://lh3.googleusercontent.com/-QaLRred01jw/ToE0l2ruGBI/AAAAAAAACvc/ydfvF-xOi_4/s800/Facebook_creatures.png' width='48'/></a>

<a href='' target='blank'><img alt='Feed' height='48' src='https://lh5.googleusercontent.com/-dUIx19LJB_A/UYqbVu4cK_I/AAAAAAAALeI/p7qqF1vg3ng/s48-no/google%252B.gif' width='48'/></a>

<a href='URL DE FEEDBURNER' target='blank'><img alt='Feed' height='48' src='https://lh5.googleusercontent.com/-16rpSgs_Rdk/ToE0l6-gnjI/AAAAAAAACvg/pbKahocVGVg/s800/Feed_creatures.png' width='48'/></a>
</div>

2.- Realizar los siguientes y sencillos cambios:
URL DE TWITTER por la vuestra.
URL PAGINA FACEBOOK por la vuestra.
URL DE GOOGLE+ por la vuestra.
URL DE FEEDBURNER por la vuestra.

3.- Cambiar de lado los iconos:
En el código aparecen los iconos en el lateral derecho y a media altura pero pueden cambiarse al izquierdo y con diferente altura y para ello hay que modificar la primera parte del código:

right: 5px;
top: 40%;

por:

left: 5px;
top: 40%;

La altura la aplicamos subiendo o bajando el: top: 40%;

!Espero que sean de vuestro agrado estos simpáticos iconos!

↧

Ranking EBUZZING del Sevillismo en el mes de Mayo (2013)

May 9, 2013, 9:44 am

≫ Next: Tostón andaluz

≪ Previous: Agregar unos simpáticos iconos flotantes de Redes Sociales en Blogger

Acaba de publicarse la actualización del Ranking EBUZZING (WIKIO) del mes de Mayo, y la Blogosfera Sevillista sube su nivel en cuanto a Blogs, ya que este mes entra en el puesto 94, Sevilla Somos Nosotros, quedándo con 31 los representantes en este TOP-100.

En cuanto a nivel de Ranking, hemos subido progresivamente este mes.
Lo más destacado de este mes sería la entrada del Blog Sevilla Somos Nosotros y la considerable subida de este Blog Amor Sevillistacon 20 puestos.

Os dejo abajo las estadísticas de este mes comparado con los pasados.

Mes	Suben	Bajan	Se mantienen
Enero	11 blog	20 blog	1 blog
Febrero	9 blog	13 blog	9 blog
Marzo	7 blog	24 blog
Abril	4 blog	24 blog	2 blog
Mayo	8 blog	20 blog	3 blog

Así que seguimos ocupando un 31% de este Ranking.

Estos son los Blogs Sevillistas en el Ranking de MAYO:

Ranking	Blog	Puesto Sube/Baja
1	La Palangana Mecánica	10 (+ 5)
2	El Sevillista	20 ( + 2 )
3	Amor Sevillista	24 (+ 20 )
4	Sevillismo.com	34 ( - 4 )
5	El Papi Magase	36 ( - 10 )
6	El Alminar de Nervión	38 ( + 2)
7	Sevilla Sevilla Sevilla	39 ( = )
8	Triana 1952	40 ( - 12)
9	Latidos de Nervión	41 ( - 3)
10	Almas Sevillistas	43 ( - 1 )
11	Un Sevillista Cualquiera	44 ( + 5 )
12	Javi SFC	48 ( - 15)
13	El Blog de Mayte Carrera	49 ( + 2 )
14	El Equipo del Arte y Salero	52 ( + 1 )
15	El Blog de Jesús Creations	54 ( - 7 )
16	Sentimiento Sevillista	56 ( = )
17	Ahora más que nunca Sevillista soy	57 ( = )
18	El Talibán Sevillista	58 ( - 3 )
19	Sin Complejos	65 ( - 2 )
20	Lo Mejor Sigue Estando sin Llegar	66 ( - 1 )
21	Crónicas en Blanco y Rojo	68 ( - 2 )
22	Sevilla Stones	70 ( - 3 )
23	P.C.S. Tres Carabelas	71 ( - 2 )
24	El Blog de Dragos Sur	74 ( - 2 )
25	Sevillismo desde la Cuna	76 ( - 3 )
26	Blanco y Rojo es mi Color	84 ( - 3)
27	Crónicas del Sevilla FC	85 ( - 2 )
28	Benditos Colores	88 ( - 1 )
29	El Sevillismo	91 ( - 1 )
30	Palanganas en la Red	93 ( - 1 )
31	Sevilla Somos Nosotros	94 ( entra)

↧

Tostón andaluz

May 12, 2013, 2:15 pm

≫ Next: Redes Sociales con efecto deslizante (lateral blog)

≪ Previous: Ranking EBUZZING del Sevillismo en el mes de Mayo (2013)

Partido soso el que hemos visto esta noche en La Rosaleda. Partido que a buen seguro no deja satisfecho a ninguno de los entrenadores, así como a los aficionados.
Pocas ocasiones de gol, yo diría que quien más cerca ha estado de ganar ha sido el Sevilla con dos ocasiones seguidas de Rakitic y Negredo. Dos ocasiones en noventa y tantos minutos dan fe de lo pobre de nuestro juego y del rival en el partido de hoy.

Un Málaga sin fuelle a estas alturas de temporada después del enorme esfuerzo realizado en Champions y con el golpe moral que supuso la eliminación en la forma que ocurrió allá por tierras alemanas y un Sevilla a lo suyo, a mejorar poco a poco en defensa, controlar el centro del campo y no saber rematar lo poco que se nos presenta.

El objetivo muy lejos a pesar del punto obtenido. Difícil lo que nos acontece y difícil la pretemporada que se avecina con muchas despedidas importantes a buen seguro.

↧

Redes Sociales con efecto deslizante (lateral blog)

May 13, 2013, 12:24 pm

≫ Next: El Sevilla FC presente en el Día de Internet de forma solidaria

≪ Previous: Tostón andaluz

Anteriormente ya vimos como colocar unos simpáticos iconos flotantes de Redes Sociales y para continuar ahorrando espacio en nuestros Blog, hoy os muestro otra forma de hacerlo y es colocando en el lateral las redes sociales de más auge en estos momentos (Facebook,Twitter,Google+,Pinteres,Youtube y nuestro feed).

Este gadget los muestra en el lateral del blog y con un efecto deslizante y al colocar el cursor sobre los iconos van a salir lentamente.

VER EJEMPLO

1.- Entrar en panel de administración - plantilla - buscar (f3 o ctsl+f) </head> y pega justo antes el siguiente script:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js' type='text/javascript'/>
<script>
$(window).load(function(){
$('.botones-sociales .social').mouseenter(function(){
$(this).stop();
$(this).animate({width:'160'}, 500, 'easeOutBounce',function(){});
});
$('.botones-sociales .social').mouseleave(function(){
$(this).stop();
$(this).animate({width:'43'}, 500, 'easeOutBounce',function(){});
});
});
</script>

2.- Entrar en panel de administración - Diseño - Añadir un gadget HTML/Javascript y pega el siguiente código:

<style type="text/css">
.botones-sociales {
position: fixed;
top: 130px;
width: 45px;
z-index: 9999;
}
.izquierda {
left: 0;
}
.derecha{
right: 0;
}
.botones-sociales #twitter-btn .social,
.botones-sociales #facebook-btn .social,
.botones-sociales #google-btn .social,
.botones-sociales #rss-btn .social,
.botones-sociales #pinterest-btn .social,
.botones-sociales #youtube-btn .social {
background-color: #33353B;
background-image: url(http://1.bp.blogspot.com/-KOzIiYFlBAk/UUmLwwZSs-I/AAAAAAAAAnA/h6G772N3cpI/s1600/mas-icons.png);
}
.izquierda #facebook-btn span {
background-position: right 10px;
}
.izquierda #twitter-btn span {
background-position: right -35px;
}
.izquierda #google-btn span {
background-position: right -127px;
}
.izquierda #rss-btn span {
background-position: right -80px;
}
.izquierda #pinterest-btn span {
background-position: 11px -177px;
}
.izquierda #youtube-btn span {
background-position: 11px -223px;
}
.derecha #facebook-btn span {
background-position: 12px 10px;
}
.derecha #twitter-btn span {
background-position: 11px -35px;
}
.derecha #google-btn span {
background-position: 10px -127px;
}
.derecha #rss-btn span {
background-position: 11px -80px;
}
.derecha #pinterest-btn span {
background-position: 11px -177px;
}
.derecha #youtube-btn span {
background-position: 11px -223px;
}
.botones-sociales #facebook-btn:hover .social {
background-color: #3B5998;
}
.botones-sociales #twitter-btn:hover .social {
background-color: #62BDB2;
}
.botones-sociales #google-btn:hover .social {
background-color: #DB4A39;
}
.botones-sociales #rss-btn:hover .social {
background-color: #FF8B0F;
}
.botones-sociales #pinterest-btn:hover .social {
background-color: #D43638;
}
.botones-sociales #youtube-btn:hover .social {
background-color: #C4302B;
}
.botones-sociales a:hover .texto{
display: block;
}
.izquierda .social {
-moz-transition: background-color 0.4s ease-in 0s;
-webkit-transition: background-color 0.4s ease-in 0s;
background-repeat: no-repeat;
display: block;
float: left;
height: 43px;
margin-bottom: 2px;
width: 43px;}

.izquierda .texto{
display: none;
float: right;
font-size: 1em;
font-weight: bold;
margin: 11px 40px 11px 0px;
white-space: nowrap;
}
.derecha .social {
-moz-transition: background-color 0.4s ease-in 0s;
-webkit-transition: background-color 0.4s ease-in 0s;
background-repeat: no-repeat;
display: block;
float: right;
height: 43px;
margin-bottom: 2px;
width: 43px;}

.derecha .texto {
display: none;
float: left;
font-size: 80%;
font-weight: bold;
margin: 11px 0 11px 40px;
white-space: nowrap;
}
.botones-sociales .texto{
color: #FFFFFF;
}
</style>

<div class='botones-sociales derecha hidden-phone hidden-tablet'>
<a class='itemsocial' href='url de facebook' id='facebook-btn' target='_blank'><span class='social'><span class='texto'>Síguenos via Facebook</span></span></a>
<a class='itemsocial' href='url de twitter'id='twitter-btn' target='_blank'><span class='social'><span class='texto'>Síguenos via Twitter</span></span></a>
<a class='itemsocial' href='url de google+' id='google-btn' target='_blank'><span class='social'><span class='texto'>Síguenos via Google</span></span></a>
<a class='itemsocial'href='url de pinterest 'id='pinterest-btn' target='_blank'><span class='social'>
<span class='texto'>Síguenos via Pinterest</span></span></a>
<a class='itemsocial' href='url de youtube' id='youtube-btn' target='_blank'><span class='social'><span class='texto'>Síguenos via Youtube</span></span></a>
<a class='itemsocial' href='url del feed' id='rss-btn' target='_blank'><span class='social'><span class='texto'>Síguenos via RSS</span></span></a>
</div>

Cambiamos las url de nuestras redes sociales y listo.

Las dudas que te hayan quedado sobre este tutorial, por favor, déjamelas en el espacio de comentarios, te contestaré lo antes posible.

↧

El Sevilla FC presente en el Día de Internet de forma solidaria

May 14, 2013, 4:43 am

≫ Next: Generador de Redes Sociales Flotantes (seguidores)

≪ Previous: Redes Sociales con efecto deslizante (lateral blog)

Sevilla F.C. presente en el Día de Internet.

Con motivo de la celebración del próximo 17 de mayo del Día Mundial de las telecomunicaciones y de la sociedad de información (Día de Internet), la Peña Sevillista de Ubrique en colaboración con el Sevilla FC han querido estar presentes en las actividades que un año más esta organizando la Asociación de Usuarios de Internet, para ello han donado una camiseta firmada por los jugadores de la primera plantilla para recaudar fondos que serán donados íntegramente a la ONG Save The Children.

Esta Subasta Solidaria, en la que se podrá pujar a través de eBay, se desarrollará entre los días 14 y 21 de Mayo y en ella además de la mencionada camisa del Sevilla FC, se podrá pujar por objetos firmados por Fernando Alonso, Alejandro Sanz, Pablo Alborán,... o donados por Josema Yuste, Huawei, Nokia o Movistar.

La camiseta del Sevilla Fútbol Club cuenta con las firmas de los siguientes jugadores de la temporada 2012/2013: 1) Andrés Palop, 9) Álvaro Negredo, 7) Jesús Navas, 2) Federico Fazio, 8) Gary Medel, 10) Diego Perotti, 23) Coke Andújar, 21) Alex Sandro Cicinho, 3) Fernando Navarro, 6) José Gómez Campaña, 20) Baba Diawara, 11) Ivan Rakitic, 14) Manu del Moral.

Un estupendo recuerdo que esperamos que la afición sevillista sepa valorar en la puja a la misma puesto que de esta recaudación se verán beneficiados muchos niños a través de Save The Children.

↧

Generador de Redes Sociales Flotantes (seguidores)

May 17, 2013, 12:34 pm

≫ Next: La otra Liga, es mucha Liga

≪ Previous: El Sevilla FC presente en el Día de Internet de forma solidaria

Anteriormente vimos como instalar Redes Sociales con efecto deslizante (lateral blog) y hoy os muestro otro interesante widget, el cual a diferencia del anterior, contiene a nuestros seguidores de las 3 Redes Sociales más importantes (Facebook, Twitter y Google Plus.) con el mismo efecto deslizante.

Esta es otra forma de aumentar nuestros seguidores en las redes sociales, porque una vez instalada nos mostrará la opción de seguirnos en Facebook, Twitter o añadirnos a un círculo de Google+. La gran ventaja de este gadget es que nos libera de bastante espacio en el blog, porque si sumamos las tres cajas a nuestra sidebar ocuparía bastante espacio.

Hay multitud de tutoriales en Internet de como colocar estas cajas de Seguidores en el Blog, pero nunca tan fácil como este generador.

VER EJEMPLO (o en este mismo blog)

Para instalarlo en vuestros blog, solo hay que seguir las instrucciones del generador y una vez acabado nos generará un código el cual colocaremos en un widget/html de nuestro blog.

Estoy seguro que este WIDGET le ayudará a conseguir más seguidores en Facebook, Twitter y Google Plus. Espero que les guste y si necesitas ayuda, deja tu comentario a continuación.

↧

La otra Liga, es mucha Liga

May 18, 2013, 2:56 pm

≫ Next: Generador de caja de Subscripción para Blogger

≪ Previous: Generador de Redes Sociales Flotantes (seguidores)

Cuando un equipo de la otra Liga aparece por Nervión se nota y la Real esta temporada lo es. Nada tiene que ver este equipo vasco con el de anteriores temporadas y mucho menos aun con nuestro Sevilla. A buen seguro me dará la razón el que me lea y haya seguido el partido que estos chavales de Anoeta han sido el mejor equipo que ha pasado por Eduardo Dato.

Muy serio en defensa y con un ataque letal perfectamente llevado por Xavi Prieto en casi todas las acciones, con un Aguirretxe inconmensurable.
Nosotros por nuestra parte y aunque no lo hayamos hecho tan rematadamente mal como en otras ocasiones, hemos desperdiciado varias ocasiones claras, nos han birlado un penalty en las mismas narices del árbitro, sí, en esas mismas que después nos robaron una ocasión clarísima de Medel al pitarle fuera de juego inexistente cuando encaraba a Bravo. En la misma jugada se autoexpula desde la banda y pleno calentamiento Reyes.

Con este partido terminamos con las pocas esperanzas de algo que no sea terminar cuanto antes la temporada.

¿Limpieza?.... Por favor que devuelvan a Babá a Senegal.

↧

Generador de caja de Subscripción para Blogger

May 20, 2013, 5:06 am

≫ Next: Generador de últimas entradas por etiquetas

≪ Previous: La otra Liga, es mucha Liga

Hace unos días os mostré la forma de colocar los Seguidores de las distintas redes sociales en el lateral del blog mediante un generador y hoy voy a compartir otro widget impresionante que nos muestra una bonita caja de subscripción.

Así que en este post, con la ayuda de otro generador podéis integrar facilmente el código del widget y añadirlo directamente a vuestros blogs.

Sólo hay que seguir unos sencillos pasos y añadir este impresionante widget a tu blog

.

VER EJEMPLO

Para instalarlo en vuestros blog, solo hay que seguir las instrucciones del generador y una vez acabado nos generará un código el cual colocaremos en un widget/html de nuestro blog.

Personalización:

1.- Reemplace todo lo requerido en el generador.
2.- Haga clic en Generar y copie el código.
3.- Pegue el código resultante en un widget/HTML.

↧

Generador de últimas entradas por etiquetas

May 21, 2013, 9:10 am

≫ Next: Caja de autor con seguidores de Redes Sociales.

≪ Previous: Generador de caja de Subscripción para Blogger

Hoy traigo de nuevo otro generador con una gran cantidad de características y opciones totalmente personalizables. Se trata de mostrar las últimas entradas con o sin miniaturas de cualquier etiqueta o categoría en particular.

En Blogger podemos encontrar varios gadget para colocar en nuestros blog tales como, entradas recientes o entradas populares, pero no nos proporciona una opción para mostrar las últimas entradas de una etiqueta o categoría en particular.
Así que en esta entrada, voy a mostraros la forma de colocar las últimas entradas con o sin miniaturas.

VER EJEMPLO

Para instalarlo en vuestros blog, solo hay que seguir las instrucciones del generador y una vez acabado nos generará un código el cual colocaremos en un Gadget/html de nuestro blog.

Personalización:

1.- Reemplace todo lo requerido en el generador.
2.- Haga clic en Generar y copie el código.
3.- Pegue el código resultante en un gadget/HTML

↧

Caja de autor con seguidores de Redes Sociales.

May 25, 2013, 11:57 am

≫ Next: Tenemos lo que nos merecemos

≪ Previous: Generador de últimas entradas por etiquetas

Son varias las entradas que he mostrado para colocar cajas de autor en nuestros blog, tales como, una original caja de Autor y caja de autor bajo las entradas de blogger, pero quizás esta sea la más completa hasta el momento.

La he diseñado a partir de un plugin de Wordpress denominado Fanciest Author Box y para ello he usado un gadget de pestañas que vimos aquí un poco de photoshop y los script de las diferentes cajas de seguidores de las redes sociales.

En la caja podemos observar diferentes pestañas (Autor, facebook, twitter, google+ y entradas relacionadas) mostrando cada una de ellas los diferentes seguidores de cada Red Social y las entradas relacionadas de dicha entrada.

VER DEMO

Para colocarla en vuestros blog seguiremos estos pasos:
1.- Buscamos en nuestra plantilla
<div class='post-footer-line post-footer-line-2'> o <div class='post-footer-line post-footer-line-3'>
y a continuación pegamos el siguiente código:

<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
div.TabView div.Tabs a{float: left;display: block;width: 90px; height: 33px;
text-align: center; margin: 5px 0px 0px 3px; background-color: #ccc; /* color de fondo */padding-top: 2px; border: 1px solid #ffffff; /* color del borde */
border-bottom: 1px solid #ccc;font-family: "Arial, Helvetica, sans-serif", Arial; /* Font Kotak Tab */font-weight: 900;}
div.TabView div.Pages{clear: both;border: 1px solid #cccccc; overflow: hidden;
background-color: #fff;}
div.TabView div.Pages div.Page{height: 100%;padding: 5px;overflow: hidden;}
div.TabView div.Pages div.Page div.Pad{padding: px 5px;}
</style>
<form action='tabview.html' method='get'>
<div class='TabView' id='TabView'>
<div class='Tabs' style='width: 490px;'>
<a><span style='color: #000'><img src='https://lh3.googleusercontent.com/-UqaLmqAF7EQ/UZ0V35UDenI/AAAAAAAALzc/8alagpm_Et8/w90-h32-no/autor.jpg'/></span></a>
<a><span style='color: #000'><img src='https://lh5.googleusercontent.com/-9zbbMu7PHT4/UZ0V56lRGYI/AAAAAAAALzk/3XYupEPSI3s/w90-h32-no/facb.jpg'/></span></a>
<a><span style='color: #000'><img src='https://lh6.googleusercontent.com/-X6S2xE6MaKQ/UZ0V9YWSFjI/AAAAAAAALzs/Y_X3cPz6j9Y/w90-h32-no/twitter.jpg'/></span></a>
<a><span style='color: #000'><img src='https://lh5.googleusercontent.com/-vT3EzeWZHaU/UZ0WCVTxRII/AAAAAAAALz8/JRmoHvJO7L4/w90-h32-no/google%252B.jpg'/></span></a>
<a><span style='color: #000'><img src='https://lh4.googleusercontent.com/-JGagcYUAGXs/UZ_AQX78hAI/AAAAAAAAL0s/7kuiMA-DLLA/w90-h32-no/entradas.jpg'/></span></a>
</div>
<div class='Pages' style='width: 490px; height: 170px;'>
<div class='Page'>
<div class='Pad'>
<style>
.base {
position: relative;
width: 460px;
height: 80px;
margin: 10px auto;
z-index: 1;
}
.contenido {
margin-top:-130px;
margin-left:170px;
}
</style>
<div class='caja'>
<div class='base portada'>
<div class='izquierda'>
</div>
<div class='derecha'>
</div>
<img height='140' src='https://lh5.googleusercontent.com/-wEmZIe0gpbg/UQEmSl4VaxI/AAAAAAAAINU/C7F0Oq6AsYs/s128/DSC02216.png' width='140'/>
<br/>
<div class='contenido'>
<span style='font-family: arial; font-size:14px; '>
Escrito por:
</span>
<span style='font-family: arial; font-size:16px; '>
<b>
<data:post.author/>
</b>
</span>
<p>
<span style='font-family: arial; font-size:12px; '>
Una breve descripción sobre ti....................
</span>
</p>
</div>
</div>
</div>
</div>
</div>
<div class='Page'>
<div class='Pad'>
<div class='likeboxwrap'>
<iframe allowTransparency='true' frameborder='0' scrolling='no' src='http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fnombre-página-facebook&width=485&colorscheme=light&show_faces=true&stream=false&header=false&height=170' style='border:none; overflow:hidden; width:485px; height:170px;'/></div>
<style type='text/css'>
div.likeboxwrap {
width:483px;
height:145px;
background-color:#fff;
overflow:hidden;
}
div.likeboxwrap iframe {margin:-1px}
</style>
</div>
</div>
<div class='Page'>
<div class='Pad'>
<div class='textwidget'>
<script src='http://s.moopz.com/fanbox_init.js' type='text/javascript'/><div id='twitterfanbox'>
<script type='text/javascript'>fanbox_init("nombre-twitter");</script></div>
</div>
<style type='text/css'>
.FB_SERVER_IFRAME {
width: 485px !important;
height: 145px !important;
}
</style>
</div>
</div>
<div class='Page'>
<div class='Pad'>
<div class='g-plus' data-action='followers' data-height='165' data-href='https://plus.google.com/ID-Google+' data-source='blogger:blog:followers' data-width='480'>
</div>
<script type='text/javascript'>
(function() {
window.___gcfg = {'lang': 'es'};
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
})();
</script>
</div>
</div>
<div class='Page'>
<div class='Pad'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:0px;
padding-left:25px;
}
#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}
#related-posts a:hover {
background-color:#ccc;
}
</style>
<script type='text/javascript'>
var defaultnoimage="http://2.bp.blogspot.com/-R285B_Pf0q4/TbXKNLTdA8I/AAAAAAAAAzk/9cKeL67QAzc/s1600/sinimagen.jpg";
var maxresults=4;
var splittercolor="#d4eaf2";
var relatedpoststitle="";
</script>
<script src='http://sevillporelmundo.webcindario.com/posts-relacionados-blogger.js' type='text/javascript'/>
<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=4"' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs("<data:post.url/>");
</script>
</div><div style='clear:both'/>
</b:if>
</div>
</div>
<script src='http://sevillporelmundo.webcindario.com/tab-viewmaskolis.js'>
</script>
<script type='text/javascript'>
tabview_initialize('TabView');
</script></div></div></form>
</b:if>

Configuración:
1.- Cambiar la URL ROJA (imágen de autor) por la vuestra.
2.- Cambiar Nombre-página-facebook por la vuestra.
3.- Cambiar Nombre-Twitter por el vuestro.
4.- Cambiar ID-Google+ por el vuestro.

Eso es todo, espero que sea funcional en todas las plantillas, las he probado en varias y el resultado ha sido óptimo.

↧

Tenemos lo que nos merecemos

May 26, 2013, 12:49 pm

≫ Next: Personalizar Formulario de Contacto de Blogger

≪ Previous: Caja de autor con seguidores de Redes Sociales.

Era echarle mucha imaginación pensar que ocho meses después podíamos tener posibilidades de ganar fuera de casa, máxime tratándose de un partido hostil donde los haya. Hostil por su afición y hostil por sus jugadores siempre enfrentados a los nuestros con algo más que simple deportividad.

Mucho era imaginar que podíamos ganar. Lo tuvimos cerca con el golazo de Negredo, aunque pienso que ni consiguiendo dicho gol en el noventa hubiéramos tenido asegurado los tres puntos, seguramente nos habrían remontado en el descuento.
No he podido ver el partido debido seguramente a la retransmisión de todos los encuentros a la misma hora y como el Sevilla no goza de mucho interés, pues los internautas habrán optado por otros con más relevancia.

Tratábamos de conseguir un puesto que nos acercara a disputar la UEFA por la vía de las sanciones. Increíble que tengamos que andar así. O se merece o no se merece pero aprovecharnos de los despachos de los demás me parece cuando menos injusto e inmerecido totalmente.

Desde hace mucho tiempo se fraguaba que esta temporada sería de paso sin más. Es lo que desde un principio nos han metido en la cabeza estos jugadores. Toca, como digo todos los domingos, limpieza a final de temporada con el agravante que en la limpia caerán sin solución lo poquito bueno que tenemos...Negredo, Navas, Rakitic...
Empezaremos desde cero con la ilusión de que después de una debacle vengan siete temporadas inmemorables.
Esto sólo ocurre una vez en la vida y yo, al menos, he tenido la suerte de vivirlo.

↧

Personalizar Formulario de Contacto de Blogger

May 28, 2013, 4:21 am

≫ Next: Andrés Palop " Adiós a una Leyenda"

≪ Previous: Tenemos lo que nos merecemos

Blogger nos ha sorprendido con un nuevo widget, se trata de un formulario de contacto, el cual dígase de paso, me parece bastante simple, lo bueno, lo fácil de su instalación.

Este sencillo formulario de contacto lo podemos personalizar y agregar a cualquier parte de nuestro blog, hoy os muestro la forma de llevarlo a una página estática. Está un poco modificado con un nuevo botón, para borrar el mensaje en caso de cualquier equivocación de nuestros lectores.

VER DEMO

Para instalar el formulario en una página estática vamos a seguir estos pasos:
Lo primero sería añadir el widget a la sidebar.
1.-Diseño > Añadir gadget ( Formulario de Contacto).- Guardar.

Ver Demo

Bien, ya lo tenemos instalado en nuestra sidebar.

Lo siguiente sería ocultarlo en todas las partes del blog y para ello buscamos: </head> y justamente antes colocamos:

<b:if cond='data:blog.url != ""'>
<style type='text/css'>
#ContactForm1 {
display: none;
}
</style>
</b:if>

Ahora vamos a instalarlo en la página estática y seguimos estos pasos:
Panel de control - Páginas - Página nueva - Página en blanco - le colocamos el título (Formulario de Contacto) y en su interior colocamos lo siguiente:

<style type="text/css">
.contact-form-name, .contact-form-email, .contact-form-email-message {
max-width: 430px; /* ANCHO DEL FORMULARIO */
width: 100%;
font-weight:bold;
}
.contact-form-name {
background: #FFF url(http://2.bp.blogspot.com/-bNZePDihTPU/UZ-lhWAHXqI/AAAAAAAAJuo/aSVVE_A6HpE/s320/name.png) no-repeat 7px 8px;
background-color: #FFF;
border: 1px solid #ddd;
box-sizing: border-box;
color: #A0A0A0;
display: inline-block;
font-family: Arial,sans-serif;
font-size: 12px;
font-weight:bold;
height: 24px;
margin: 0;
margin-top: 5px;
padding: 5px 15px 5px 28px;
vertical-align: top;
}
.contact-form-email {
background: #FFF url(http://3.bp.blogspot.com/-Wf_IBW4cEts/UZ-li4SsnvI/AAAAAAAAJuw/qYAi9lghY1E/s320/email.png) no-repeat 7px 10px;
background-color: #FFF;
border: 1px solid #ddd;
box-sizing: border-box;
color: #A0A0A0;
display: inline-block;
font-family: Arial,sans-serif;
font-size: 12px;
font-weight:bold;
height: 24px;
margin: 0;
margin-top: 5px;
padding: 5px 15px 5px 28px;
vertical-align: top;
}
.contact-form-email:hover, .contact-form-name:hover{
border: 1px solid #bebebe;
box-shadow: 0 1px 2px rgba(5, 95, 255, .1);
padding: 5px 15px 5px 28px;
}
.contact-form-email-message:hover {
border: 1px solid #bebebe;
box-shadow: 0 1px 2px rgba(5, 95, 255, .1);
padding: 10px;
}
.contact-form-email-message {
background: #FFF;
background-color: #FFF;
border: 1px solid #ddd;
box-sizing: border-box;
color: #A0A0A0;
display: inline-block;
font-family: arial;
font-size: 12px;
margin: 0;
margin-top: 5px;
padding: 10px;
vertical-align: top;
max-width: 450px!important; /* ANCHO CAJA MENSAJE */
height: 150px;
border-radius:4px;
}
.contact-form-button {
cursor:pointer;
height: 32px;
line-height: 28px;
font-weight:bold;
border:none;
}
.contact-form-button {
display: inline-block;
zoom: 1;
*display: inline;
vertical-align: baseline;
margin: 0 2px;
outline: none;
cursor: pointer;
text-align: center;
text-decoration: none;
font: 14px/100% Arial, Helvetica, sans-serif;
padding: .5em 2em .55em;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
-webkit-border-radius: .5em;
-moz-border-radius: .5em;
border-radius: .5em;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.contact-form-button:hover {
text-decoration: none;
}
.contact-form-button:active {
position: relative;
top: 1px;
}
.amor-button-color {
color: #fff; /* color letras botones */
border: solid 1px #7D7D7C;/* color borde botones */
background: #626160; /* color fondo botones */
}
.amor-button-color:hover {
background: #27231F; /* color fondo botones al pasar cursor */
border-color: #27231F!important;
}

</style>
<div class='form'>
<form name='contact-form'>
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' value="Nombre" size='30' type='text' onblur='if (this.value == "") {this.value = "Nombre";}' onfocus='if (this.value == "Nombre") {this.value = "";}' />
<p></p>
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='Correo Electrónico' value="Correo Electrónico" size='30' type='text'onblur='if (this.value == "") {this.value = "Correo Electrónico";}' onfocus='if (this.value == "Correo Electrónico") {this.value = "";}' />
<p></p>
<textarea class='contact-form-email-message' id='ContactForm1_contact-form-email-message' name='email-message' value='Deja tu mensaje..' onblur='if (this.value == "") {this.value = "Deja tu mensaje..";}' onfocus='if (this.value == "Deja tu mensaje..") {this.value = "";}'></textarea>
<p></p>
<input class='contact-form-button contact-form-button-submit amor-button-color' type='reset' value='Borrar'/>
<input class='contact-form-button contact-form-button-submit amor-button-color' id='ContactForm1_contact-form-submit' type='button' value='Enviar'/>
<p></p>
<div style='text-align: center; max-width:450px; width: 100%'>
<p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
<p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
</div>
</form>
</div>

Personalización:
Lo que está en ROJO es para aumentar/disminuir el ancho de la caja del nombre y email.
Lo que está en AZUL es para cambiar el color de los botones.

Si te ha gustado este artículo clic aquí para suscribirse gratis a través de nuestro correo electrónico, de esta forma recibirás un envío por cada nuevo artículo publicado o compártelo en las diferentes redes sociales.

↧

Andrés Palop " Adiós a una Leyenda"

May 29, 2013, 11:16 am

≫ Next: Can...Cervera

≪ Previous: Personalizar Formulario de Contacto de Blogger

El verano de 2005 llega al Sevilla FC, ANDRÉS PALOP, donde pronto se convirtió en uno de los pilares del equipo. En su primera temporada conquistó la Copa de la UEFA, el primer trofeo europeo en la historia del club. El título se reeditó la siguiente temporada y Palop jugó un papel destacado. El 15 de marzo de 2007, Palop se convirtió en el héroe de la jornada para su equipo, ya que éste perdía 2-1 con el Shakhtar Donetsk ucraniano en los octavos de final de la Copa UEFA 2006/07 y en el tiempo de descuento hizo el gol del empate rematando de cabeza un saque de esquina. En la final, jugada el 16 de mayo de 2007 contra el RCD Espanyol,Palop se convirtió una vez más en el héroe de su equipo al parar tres lanzamientos durante la tanda de penaltis, en la que el Sevilla FC se impuso 3 penaltis a 1 tras concluir el tiempo reglamentario con el resultado de 1-1 y la prórroga con 2-2. En ese partido fue designado mejor jugador del mismo.1

La temporada 2006/07 también conquistó la Supercopa de Europa y la Copa del Rey, además de terminar la liga en tercera posición, después de pelear durante toda la temporada por el título.

El día 19 de mayo de 2010 conquista una nueva Copa del Rey con el Sevilla FCtras imponerse al Atlético de Madrid en el Camp Nou de Barcelona por 0-2. Como homenaje a Antonio Puerta, decide ponerse la camiseta con el número 16 para recoger la copa de manos del Príncipe Felipe.

OS DEJO UN PEQUEÑO HOMENAJE A MI ÍDOLO DEL SEVILLA F.C.

Los aficionados deben acudir este Sábado al estadio a despedirle como se merece:

" El sábado despedimos a uno de los mejores jugadores de la historia del Sevilla F.C."

Al mejor portero de la historia del Sevilla FC y a uno de los que más títulos ha conseguido en la historia contemporánea de la entidad. La despedida de Andrés Palop es motivo más que suficiente como para que todos los sevillistas le arropemos y arropemos en el Ramón Sánchez Pizjuán".

Con él se va la magia. Con él se fue mi ídolo del Sevilla FC. Pero la leyenda del mejor portero de la Historia del Sevilla F.C.

!CONTINUARÁ......!

Este Sábado, esperemos que Unai Emery le haga la despedida que se merece.