tag:blogger.com,1999:blog-61759222483492656812024-03-05T20:15:46.921-03:00Not a Single Songcatalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.comBlogger598125tag:blogger.com,1999:blog-6175922248349265681.post-63803799773821930092014-05-25T16:53:00.001-03:002014-05-25T16:57:58.279-03:00¿Advinas quién lo dijo?: ganadoras<div style="text-align: justify;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgym6Rb9hrAsBYH1dBhmar-EijWLfA8F04MHiURa4zv6ZpuTkElKNp9LInpU6rABxlBWT0NBY_5LhI5BwQfz8-z2D0rS377mSrOGzYtsU7a4mw6rDKSd5mPcRVrSv5jHqhZpH1uVs6FUv4/s1600/ganadoresaqld.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgym6Rb9hrAsBYH1dBhmar-EijWLfA8F04MHiURa4zv6ZpuTkElKNp9LInpU6rABxlBWT0NBY_5LhI5BwQfz8-z2D0rS377mSrOGzYtsU7a4mw6rDKSd5mPcRVrSv5jHqhZpH1uVs6FUv4/s1600/ganadoresaqld.png" /></a></div>
<div style="text-align: center;">
<i><span style="font-size: x-small;"> *Llorando porque Blogger hace que la imagen se vea con una calidad malisimamente mala!*</span></i></div>
<div style="text-align: center;">
<br /></div>
Bueno, llegamos al final del juego así que ya tenemos 2 ganadoras. Pero primero vamos con la resolución del último.</div>
<blockquote class="tr_bq">
<u>RESOLUCIÓN ¿ADIVINAS QUIÉN LO DIJO? 2C</u> </blockquote>
<div style="text-align: justify;">
<b><u>Frase de la semana pasada</u>:</b> "<span style="font-family: Georgia,"Times New Roman",serif;"><i>Creo que no todo el mundo puede conservar sus ojos, o no ponerse enfermo, o lo que sea, pero todo el mundo debería tener amor verdadero, y debería durar como mínimo toda la vida.</i></span>"</div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLGWYWKfXb3LC3Uu3gamVrtcO-whD4c4492dNpxLECx_-GDd8lDgwCBeSDI8xmgmm089jNVcUIfxA3FIQJb3wsKGEVGvzwKN4toSY0jKt2ZT5Ws8pxu2mlm2zsCxlQ5UIbf7HREvSQo7A/s1600/tfios.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLGWYWKfXb3LC3Uu3gamVrtcO-whD4c4492dNpxLECx_-GDd8lDgwCBeSDI8xmgmm089jNVcUIfxA3FIQJb3wsKGEVGvzwKN4toSY0jKt2ZT5Ws8pxu2mlm2zsCxlQ5UIbf7HREvSQo7A/s1600/tfios.png" /></a></div>
<br />
<b><u>Respuesta correcta</u>:</b> Isaac en <i>"Bajo la misma estrella"</i>, que está narrada por Hazel.<br />
<br />
<span style="font-family: Georgia,"Times New Roman",serif;"><i>Y las puntuaciones quedaron así:</i></span><br />
<b></b><br />
<b>+ Natalie M: 13 puntos<br />+ Mica Vali: 12 puntos</b><br />
+ Iara, Nasi, Shine: 10 puntos<br />
+ Amanda: 6 puntos <br />
<b>+</b> I'm a dreamer: 4 puntos<br />
<b>+</b> Consejos y tutos, Cammiii Stoessel, Jane, Yazmín Lázaro: 2 puntos<br />
<b>+ </b>Pollitos de Paulina: 1 punto<br />
<br />
<div style="text-align: justify;">
Así que Natalie M y Mica Vali son nuestras ganadoras, <b>¡felicitaciones!</b> Chicas, si quieren la plantilla necesito que me envíen un mail a <i>notasinglesongcata@gmail.com</i> así puedo ponerme a trabajar con ellas. Por favor, <b>haganlo antes del miércoles</b>; sino se la daré a otra persona.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
En fin, que en unas semanas empezaremos uno nuevo! Así más de ustedes tienen la posibilidad de llevarse una plantilla pero primero voy a hacer las de las ganadoras de esta vez y terminar el nuevo diseño de notasinglesong que ya estoy haciendo :)</div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com7tag:blogger.com,1999:blog-6175922248349265681.post-79010301754977037432014-05-22T11:21:00.000-03:002014-05-22T11:21:18.547-03:00¿Adivinas quién lo dijo? (2C)<div style="text-align: justify;">
¡Hola! Creo que la frase anterior fue un poco difícil, ¿no? Porque pocos la adivinaron, y sólo han puesto de qué libro era. Aunque, es entendible considerando que es un libro que tiene partes narradas por diferentes personajes. En fin que como retribución, nuestra última frase es de un libro muuuy conocido; creo que la única persona sobre la faz de la tierra que no ha podido terminarselo soy yo! </div>
<br />
<div style="text-align: justify;">
<i><span style="font-size: large;"><span style="font-family: Georgia,"Times New Roman",serif;"><b>"Creo que no todo el mundo puede conservar sus ojos, o no ponerse
enfermo, o lo que sea, pero todo el mundo debería tener amor verdadero, y
debería durar como mínimo toda la vida."</b></span></span></i></div>
<br />
<div style="text-align: justify;">
Además de poner de qué libro es y quién la dijo, les pregunto <i>¿quién nos narra la historia?</i> Y esta es la última pregunta, así que con todo, después de esto tendremos al/los ganador/es. Ya les contaré como haremos para el premio y tal.</div>
<blockquote class="tr_bq">
<u>RESOLUCIÓN ¿ADIVINAS QUIÉN LO DIJO? 2B</u> </blockquote>
<div style="text-align: justify;">
<b><u>Frase de la semana pasada</u>:</b> "<span style="font-size: small;"><i><span style="font-family: Georgia,"Times New Roman",serif;">No
todo depende del azar. Si todo dependiese del azar, el universo nos
abandonaría por completo. Y el universo no nos abandona. Cuida de sus
creaciones más frágiles de un modo invisible.</span></i></span>"</div>
<br />
<b><u>Respuesta correcta</u>:</b> Justin en "La lección de August" de R. J. Palacio<br />
<br />
<div style="text-align: justify;">
Ahora que saben de quién es, como dije en la entrada anterior, no se si es el mejor libro o siquiera uno de los mejores que haya leído en la vida pero es una historia preciosa! No me voy a hablar sobre él, pero busquen la sinópsis o alguna reseña y estoy segura de que les va a encantar</div>
<br />
<b><u></u></b>
<b><u>Puntuación actualizada</u>:</b><br />
<br />
<b>+</b> Natalie M: 11 puntos<br />
+ Magga, Mica Vali: 9 puntos<br />
+ Nasi: 8 puntos <br />
<b>+</b> Shine, Iara: 7 puntos<b></b>catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com8tag:blogger.com,1999:blog-6175922248349265681.post-36374665601449160512014-05-18T11:56:00.003-03:002014-05-18T13:50:37.952-03:00¿Adivinas quién lo dijo? (2B)<div style="text-align: justify;">
Hola! Vamos con la anteúltima frase del juego :) Después de la próxima tendremos un ganador! La frase es la que está debajo de la imagen, lo que aparece en ella es otra parte del mismo pasaje pero lo he puesto solo a modo ilustrativo. Si lo encuentran, leanlo completo, que es precioso. Y les recomiendo el libro también, si no lo leyeron, porque es una historia realmente hermosa.</div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1G98PAOdVHfny6FazY0iQ5-sBMoj2oQYVL0JNGSmaZZDl3aSPuoUnMjGmp6CWFliAQ-sYmwXLmf9cyC9pm2tgsbMDQR6-9jucYYFxTsblnpvavAvzRk1lXntOhvqfuA0dCCq06A5h3eo/s1600/maybeits.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1G98PAOdVHfny6FazY0iQ5-sBMoj2oQYVL0JNGSmaZZDl3aSPuoUnMjGmp6CWFliAQ-sYmwXLmf9cyC9pm2tgsbMDQR6-9jucYYFxTsblnpvavAvzRk1lXntOhvqfuA0dCCq06A5h3eo/s1600/maybeits.png" height="242" width="320" /></a></div>
<br />
<div style="text-align: justify;">
<span style="font-size: large;"><i><b><span style="font-family: Georgia,"Times New Roman",serif;">"No todo depende del azar. Si todo dependiese del azar, el universo nos abandonaría por completo. Y el universo no nos abandona. Cuida de sus creaciones más frágiles de un modo invisible."</span></b></i></span><br />
<br />
La pregunta <i>extra</i> (además de las 2 de siempre: de dónde es la frase y quién la dijo) de esta semana es <b>¿quién es el/la autor/a de este libro? </b>Recuerden, si responden esta tienen un punto más.</div>
<blockquote class="tr_bq">
<u>RESOLUCIÓN ¿ADIVINAS QUIÉN LO DIJO? 2A</u> </blockquote>
<b><u>Frase de la semana pasada</u>:</b> "<span style="font-size: small;"><span style="font-family: Georgia,"Times New Roman",serif;"><i>No puedes quedarte ahí sentado esperando que el nuevo mundo se adapte a ti, eres tú el que tiene que adaptarse.</i></span></span>"<br />
<br />
<b><u>Respuesta correcta</u>:</b> Hans Hubermann, padre adoptivo de Liesel en "La ladrona de libros". <br />
<br />
<b><u></u></b>
<b><u>Puntuación actualizada</u>:</b><br />
<br />
<b>+</b> Natalie M: 9 puntos<br />
<b>+</b> Nasi, Mica Vali, Shine, Magga, Iara: 7 puntos<b><br /></b><b>+</b> I'm a dreamer: 4 puntos<br />
<b>+</b> Amanda: 3 puntos<br />
<b>+</b> Consejos y tutos, Cammiii Stoessel, Jane, Yazmín Lázaro: 2 puntos<br />
<b>+ </b>Pollitos de Paulina: 1 punto catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com5tag:blogger.com,1999:blog-6175922248349265681.post-41998610008129920312014-05-13T19:00:00.001-03:002014-05-13T19:00:26.761-03:00¿Adivinas quién lo dijo? (2A)<div style="text-align: justify;">
Hola! Siento muuucho haberme tardado de nuevo en publicar esta segunda parte, de verdaddd! Pero como dicen, más vale tarde que nunca, ¿no? </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Antes que nada, aclaro una cosa que me preguntó una seguidora en la entrada anterior. Ella me dijo que había respondido bien (poniendo de qué serie era la frase y quién la había dicho) y que sólo le había sumado 2 puntos; en realidad, en las reglas figuraba como que si estaba bien respondido se sumaban 4 puntos y si sólo ponían de dónde era la frase, tendrían 2 puntos. Pero cuando comenzó el juego me confundí y empecé contabilizando 2 puntos si la respuesta estaba completa y 1 punto si contestaban de dónde provenía la frase. Por lo tanto así se queda y he contado para todos por igual, así que no se preocupen :) No tengo intención de ser injusta con nadie! Y los comentarios estan todos publicados para que vean quién respondió bien y quién mal, por si quieren contabilizarlo ustedes mismos.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Dicho esto, vamos con la frase de hoy, que da comienzo a la segunda ronda; en este caso serán frases de libros y además de responder las 2 preguntas añadiré una más, que podrá cambiar con cada frase, lo aclaro debajo.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2F0ZG4jkDMkxawcxxy2IAel-lA0pFK9Z03zHAaCqP2zP88qUB6q4wniZfsPGE22NF3v7zn-mIYqXX35QOI4ToF526-Jy1ohHj_4pISxyDGP9sBX4OLuQURN7NPOps1VUT1FGQHAUi2l4/s1600/asdfgh345.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2F0ZG4jkDMkxawcxxy2IAel-lA0pFK9Z03zHAaCqP2zP88qUB6q4wniZfsPGE22NF3v7zn-mIYqXX35QOI4ToF526-Jy1ohHj_4pISxyDGP9sBX4OLuQURN7NPOps1VUT1FGQHAUi2l4/s1600/asdfgh345.png" /></a></div>
<br /></div>
<div style="text-align: center;">
<span style="font-size: large;"><span style="font-family: Georgia,"Times New Roman",serif;"><i><b>"No puedes quedarte ahí sentado esperando que el nuevo mundo se adapte a ti, eres tú el que tiene que adaptarse."</b></i></span></span><br />
<br /></div>
En esta ronda, además de decirme de qué libro es y qué personaje lo dijo, tienen que agregar qué relación tiene este personaje con el/la protagonista (y con esto, va una pequeña pista jajajaj). Si me ponen las tres cosas, tendrán 3 puntos y si no, lo de siempre :)<br />
<blockquote class="tr_bq">
<u>RESOLUCIÓN ¿ADIVINAS QUIÉN LO DIJO? 1C</u> </blockquote>
<b><u>Frase de la semana pasada</u>:</b> "As much as being broken up hurts, being alone is way worse."<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://data3.whicdn.com/images/105980982/large.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://data3.whicdn.com/images/105980982/large.gif" height="179" width="320" /></a></div>
<br />
<b><u>Respuesta correcta</u>:</b> Stiles Stilinski, Teen Wolf.<br />
<br />
<b><u>Puntuación actualizada</u>:</b><br />
<br />
<b>+</b> Natalie M, Nasi: 6 puntos<br />
<b>+ </b>Shine: 5 puntos<b><br /></b><br />
<b>+</b> Magga, Mica Vali, Iara: 4 puntos<br />
<b>+</b> Consejos y tutos, Cammiii Stoessel, Jane, Yazmín Lázaro, Amanda: 2 puntos<br />
<b>+ </b>Pollitos de Paulina y Im a dreamer tienen: 1 punto<br />
<br />catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com10tag:blogger.com,1999:blog-6175922248349265681.post-29133685673735194082014-05-08T09:15:00.001-03:002014-05-10T11:45:27.420-03:00¿Adivinas quién lo dijo? (1C)<div style="text-align: justify;">
¡Hola! Se que dije que esto tocaba publicarlo ayer pero se me hizo imposible, estuve fuera de casa todo el día... Ahora sí, vamos a lo que toca.<br />
<br />
Primero, la frasede hoy. Tienen tiempo hasta el domingo para responder y comenzamos con la segunda ronda, serán 3 frases pero en lugar
de ser de series esta vez tocaran libros. Al acabar con esas tres,
tendremos al/los ganador/es :) Más abajo esta la <a href="http://notasinglesong.blogspot.com.ar/2014/05/adivinas-quien-lo-dijo-1b.html" target="_blank">resolución del anterior</a>.</div>
<div style="text-align: justify;">
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjstPA56iT_SZb-v4WTH-K14yiT5gMq2bHORltNfvaZQcU2AcZ6e-Dqs_vTz0qg72xLmOAN8zCcLDIn_6pjDjSEJHN6BHq8GLlNEqVzodNVkB6Aa96yKxfwiQBENx47jKRuWm34P_R0Zic/s1600/beingalone.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjstPA56iT_SZb-v4WTH-K14yiT5gMq2bHORltNfvaZQcU2AcZ6e-Dqs_vTz0qg72xLmOAN8zCcLDIn_6pjDjSEJHN6BHq8GLlNEqVzodNVkB6Aa96yKxfwiQBENx47jKRuWm34P_R0Zic/s1600/beingalone.png" /></a></div>
</div>
<br />
<div style="text-align: center;">
<i><b><span style="font-family: Georgia,"Times New Roman",serif;"><span style="font-size: large;">"As much as being broken up hurts, being alone is way worse."</span></span></b></i></div>
<div style="text-align: center;">
<i><b><span style="font-family: Georgia,"Times New Roman",serif;"><span style="font-size: large;"> </span></span></b></i>
</div>
<blockquote class="tr_bq">
<u>RESOLUCIÓN ¿ADIVINAS QUIÉN LO DIJO? 1B</u> </blockquote>
<b><u>Frase de la semana pasada</u>:</b> "Fashion is the most powerful art there is. It's movement, design and architecture all in one. It shows the world who we are and who we'd like to be."<br />
<br />
<b><u>Respuesta correcta</u>:</b> Blair Waldorf, de Gossip Girl<br />
<br />
<b><u>Puntuación actualizada</u>:</b><br />
<br />
<b>+</b> Shine, Natalie M, Nasi: 4 puntos<br />
<b>+</b> Cammiii Stoessel, Jane, Maga, Iara, Yazmín Lázaro, Amanda y Mica Vali: 2 puntos<br />
<b>+ </b>Pollitos de Paulina, Consejos y tutos y Im a dreamer tienen: 1 punto<br />
<br />catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com15tag:blogger.com,1999:blog-6175922248349265681.post-66352805517039266172014-05-04T15:23:00.003-03:002014-05-04T15:25:26.559-03:00¿Adivinas quién lo dijo? (1B)<div style="text-align: justify;">
La respuesta correcta a la <a href="http://notasinglesong.blogspot.com.ar/2014/05/adivinas-quien-lo-dijo-1a.html" target="_blank">anterior frase</a> era <span style="font-family: Georgia,"Times New Roman",serif;"><i><b>Toby en Pretty Little Liars</b></i></span>, la mayoría respondió bien! Más abajo les dejo los punto pero primero vamos con la segunda frase, tienen tiempo hasta el miércoles para responder!<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjndnkAD6bdlF3gu9FwqqiDi0oM02t7HoIu2qDFAOqq5nnAI9cT7ubCvkbGdus1XwczD1lXVqTrC5k-msrcaghjf9ZcqX0u_3K_0H9gQZNSK34w4JRQhwmTi73pzKjOSzH_V7HUM1Afq5U/s1600/fashionis.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjndnkAD6bdlF3gu9FwqqiDi0oM02t7HoIu2qDFAOqq5nnAI9cT7ubCvkbGdus1XwczD1lXVqTrC5k-msrcaghjf9ZcqX0u_3K_0H9gQZNSK34w4JRQhwmTi73pzKjOSzH_V7HUM1Afq5U/s1600/fashionis.png" /></a></div>
<br /></div>
<div style="text-align: center;">
<div style="text-align: justify;">
<span style="font-size: large;"><i><b><span style="font-family: Georgia,"Times New Roman",serif;">"Fashion is the most powerful art there is. It's movement, design and architecture all in one. It shows the world who we are and who we'd like to be."</span></b></i></span><br />
<br />
Y aquí los puntos.<br />
Algunos sólo pusieron la serie, y solo tienen la mitad de los puntos así que estamos así:<br />
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<b>+</b> NatalieM, Cammiii Stoessel, Nasi, Shine, Jane, Maga, Iara y Mica Vali tienen 2 puntos.</div>
<div style="text-align: justify;">
<b>+ </b>Pollitos de Paulina, Consejos y tutos y Im a dreamer tienen 1 punto.</div>
</div>
</div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com9tag:blogger.com,1999:blog-6175922248349265681.post-38777328974454493012014-05-02T14:36:00.003-03:002014-05-02T14:37:11.764-03:00Una guía de CSS: todas las propiedades que debes conocer<div style="text-align: justify;">
</div>
<div style="text-align: justify;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhARhWKzLa1q_Kt3hyphenhyphen1s_kZdZnRPRVC8cVqWQU1L68Yv8_x4EGSEX6nrG1Z5FgFAi2dC-V3Y5t5f2fqEOU7XtIdiErD8nDunGR7QEsXkIB0ZF5Q2hyphenhyphend3yL3PM8xKAOLaO4xIpPzOOR5Aso/s1600/guiadecss.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhARhWKzLa1q_Kt3hyphenhyphen1s_kZdZnRPRVC8cVqWQU1L68Yv8_x4EGSEX6nrG1Z5FgFAi2dC-V3Y5t5f2fqEOU7XtIdiErD8nDunGR7QEsXkIB0ZF5Q2hyphenhyphend3yL3PM8xKAOLaO4xIpPzOOR5Aso/s1600/guiadecss.png" /></a></div>
¿Recuerdan lo que les había contado <a href="http://notasinglesong.blogspot.com.ar/2014/03/estructura-basica-de-una-plantilla.html" target="_blank">aquí</a> sobre el CSS? Sirve para darle un poco de color y de estilo a HTML ya que sin él todo nuestro blog sería muy plano y todos los sitios serían iguales. <span style="font-family: Georgia,"Times New Roman",serif;"> </span><br />
<br />
<span style="font-family: Georgia,"Times New Roman",serif;">V</span>amos a ver las propiedades más comunes para que se vayan familiarizando, que sepan qué signifca cada una y puedan ir incluyendolas en sus blogs. Porque en las otras entradas que ya estan publicadas y las que seguiré publicando hablo más que nada de cuestiones estructurales.<br />
<br /></div>
<div style="text-align: justify;">
<a href="http://notasinglesong.blogspot.com.ar/2014/05/css-efecto-hover.html" target="_blank">Cambia el efecto al pasar el cursor por encima: efecto hover</a></div>
<div style="text-align: justify;">
<a href="http://notasinglesong.blogspot.com.ar/2014/05/css-background.html" target="_blank">background || fondo</a><br />
<a href="http://notasinglesong.blogspot.com.ar/2014/05/css-border-radius.html" target="_blank">border-radius || bordes redondeados</a><br />
<a href="http://notasinglesong.blogspot.com.ar/2014/05/css-text-shadow.html" target="_blank">text-shadow || sombra del texto</a><br />
box-shadow || sombra <br />
<br />
Iré agrandando la lista poco a poco ^^ Si tienen algun efecto particular que quieran que haga pronto, haganmelo saber en un comentario :)</div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com1tag:blogger.com,1999:blog-6175922248349265681.post-61499342593706106542014-05-02T14:34:00.001-03:002014-05-04T18:49:15.516-03:00CSS: border-radius<div style="text-align: justify;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqU9otsn39mE8QLiLOhOp8t8FwRY3dcKjHtAwqAtl79MkXBfRCKR4G1-NpynBSn91dA4eF3VmIT1GmsNCmaWAwWBR2bDrZu9aMhx_M0HF0hg7ffLVdckOzM5-fANmCZ6STSBXFkEohpNU/s1600/borderradius.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqU9otsn39mE8QLiLOhOp8t8FwRY3dcKjHtAwqAtl79MkXBfRCKR4G1-NpynBSn91dA4eF3VmIT1GmsNCmaWAwWBR2bDrZu9aMhx_M0HF0hg7ffLVdckOzM5-fANmCZ6STSBXFkEohpNU/s1600/borderradius.png" /></a></div>
<br />
¿Cuantas veces me han preguntado como poner las puntas de tal o cual o cosa para que se vean redonditas?</div>
<center>
<div style="background: #c8d2fb; border-radius: 10px; color: #6676b3; padding: 5px; width: 500px;">
<center>
Si quieres que las cuatro puntas se vean igualmente redondeadas, como lo ves justo en este ejemplo, puedes colocar lo que sigue a continuación:</center>
</div>
</center>
<blockquote class="tr_bq">
<span style="font-family: Georgia,"Times New Roman",serif;">border-radius: 10px;</span><br />
<span style="font-family: Georgia,"Times New Roman",serif;">-moz-border-radius: 10px;</span><br />
<span style="font-family: Georgia,"Times New Roman",serif;">-webkit-border-radius: 10px;</span></blockquote>
Y
obviamente cambiar el 10 por el valor que ustedes quieran; las tres
líneas que aparecen sirven para lo mismo, pero tienen que poner las 3 ya
que sirven para que se vean en diferentes exploradores.<br />
<br />
<center>
<div style="background: #c8d2fb; border-radius: 0 10px 0 10px; color: #6676b3; padding: 5px; width: 500px;">
<center>
También
puedes elegir que dos puntas se vean redondeadas y las otras dos
no, como lo ves en este ejemplo. En ese caso lo que deberías elegir es: </center>
</div>
</center>
<blockquote class="tr_bq">
<span style="font-family: Georgia,"Times New Roman",serif;">border-radius: 0px 10px 0px 10px;</span><br />
<span style="font-family: Georgia,"Times New Roman",serif;">-moz-border-radius: 0px 10px 0px 10px;</span><br />
<span style="font-family: Georgia,"Times New Roman",serif;">-webkit-border-radius: 0px 10px 0px 10px;</span></blockquote>
<br />
<span style="font-family: Georgia,"Times New Roman",serif;">++ border-radius: arriba izquierda | arriba derecha | abajo derecha | abajo izquierda</span><br />
<br />
<div style="text-align: justify;">
Ya queda en ustedes ver cómo lo quieren poner y recuerden que el valor 0 es para que las puntas se vean normal.</div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com0tag:blogger.com,1999:blog-6175922248349265681.post-5429674191138359452014-05-02T14:32:00.000-03:002014-05-02T14:34:14.897-03:00CSS: background<div style="text-align: justify;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivOTbzb-oRSwlFZhqF5IVTxIdCANL0g1rTWdbgoM9tZdEfMv3MZT12Xb1KYTjqCdS1Mzc_kW8LlMvc-75Ule5aaeA4DqLziGNcVrPZyk93NmAV6dnvTkUFq3cDfBEgzLagT_-brULkdSU/s1600/background.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivOTbzb-oRSwlFZhqF5IVTxIdCANL0g1rTWdbgoM9tZdEfMv3MZT12Xb1KYTjqCdS1Mzc_kW8LlMvc-75Ule5aaeA4DqLziGNcVrPZyk93NmAV6dnvTkUFq3cDfBEgzLagT_-brULkdSU/s1600/background.png" /></a></div>
<br />
Background es basicamente fondo, creo que ya la he explicado en alguna de las entradas pero la pongo aquí pero la incluyo para que puedan encontrarla más facilmente.</div>
<blockquote class="tr_bq">
<div style="text-align: justify;">
<span style="font-family: Georgia,"Times New Roman",serif;">background: #FFFFFF;</span></div>
<div style="text-align: justify;">
<span style="font-family: Georgia,"Times New Roman",serif;">background-image: url('link del fondo');</span></div>
</blockquote>
<div style="text-align: justify;">
Recuerden
el primero si quieren que el fondo sea un color y el segundo para poner
una imagen. También existe una opción para que se repita.</div>
<blockquote class="tr_bq">
<div style="text-align: justify;">
<span style="font-family: Georgia,"Times New Roman",serif;">background-repeat: repeat-x/repeat-y/repeat;</span></div>
</blockquote>
<div style="text-align: justify;">
<b><span style="font-family: Georgia,"Times New Roman",serif;">Repeat-x</span> </b>sirve para que se repita horizontalmente, <span style="font-family: Georgia,"Times New Roman",serif;"><b>repeat-y</b></span> para que lo haga verticalmente y <span style="font-family: Georgia,"Times New Roman",serif;"><b>repeat</b></span> si quieren que se repita hacia ambos lados, lo que se conoce como mosaico. Se elige sólo una repeat-x o repeat-y o repeat.<br />
<br />
Esta
propiedad sirve lo mismo para ponerle fondo no sólo a todo el blog sino
también a cualquier otra cosa que quieran ponerle un fondo como puede
ser el blockquote (cita), a las imágenes, a las entradas, etc.<br />
<br /></div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com1tag:blogger.com,1999:blog-6175922248349265681.post-18607745901054085532014-05-02T14:30:00.001-03:002014-05-02T14:34:14.894-03:00CSS: text-shadow<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQS3dvfCfBaPkwx_jdHyPRaefNv1kxO4KXExRmXssX29Et5pb_I4B34VpCbbFgkiH8u2pgUywFZ_AOFdujJgjx4YzVDBGmVPEmzpLyL312dCTCz0rdRcbJLSC_V3PR9WOWZuE5SBUdmvE/s1600/textshadow.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQS3dvfCfBaPkwx_jdHyPRaefNv1kxO4KXExRmXssX29Et5pb_I4B34VpCbbFgkiH8u2pgUywFZ_AOFdujJgjx4YzVDBGmVPEmzpLyL312dCTCz0rdRcbJLSC_V3PR9WOWZuE5SBUdmvE/s1600/textshadow.png" /></a></div>
<br />
Text-shadow sirve para ponerle sombra al texto.<br />
<blockquote class="tr_bq">
<div style="text-align: justify;">
<span style="font-family: Georgia,"Times New Roman",serif;">text-shadow: 1px 1px 5px #ff0000;</span></div>
<span style="font-family: Georgia,"Times New Roman",serif;">-moz-border-radius: 1px 1px 5px </span><span style="font-family: Georgia,"Times New Roman",serif;"><span style="font-family: Georgia,"Times New Roman",serif;">#ff0000</span>;</span><br />
<span style="font-family: Georgia,"Times New Roman",serif;">-webkit-border-radius: 1px 1px 5px </span><span style="font-family: Georgia,"Times New Roman",serif;"><span style="font-family: Georgia,"Times New Roman",serif;">#ff0000</span>;</span></blockquote>
<span style="font-family: Georgia,"Times New Roman",serif;"><span style="font-family: Georgia,"Times New Roman",serif;"> text-shadow: sombra horizontal (hacia los lados) | sombra vertical | el difuminado</span> </span><br />
<br />
<div style="text-align: justify;">
Los
dos primeros pueden llevar valores negativos: si ustedes ponen en el
primero valor 1 y se corre hacia la derecha, si ponen -1 la sombra se
correra hacia la izquierda. Lo último, creo que ya saben que es el
código del color.<br />
<br />
Acá les dejo algunos ejemplos.<br />
<br />
<div style="background: #ffecc3; color: #ff8ba2; padding: 5px; text-shadow: 0 0 5px #fb586c;">
Ejemplo de text-shadow número uno</div>
<blockquote class="tr_bq">
<span style="font-family: Georgia,"Times New Roman",serif;">text-shadow: 0 0 5px #fb586c;</span></blockquote>
<br />
<div style="background: #d3e1f5; color: #b283ff; padding: 5px; text-shadow: 1px 1px 0 #ffffff;">
Ejemplo de text-shadow número dos</div>
<blockquote class="tr_bq">
<span style="font-family: Georgia,"Times New Roman",serif;">text-shadow: 1px 1px 0 #ffffff;</span></blockquote>
<br />
<div style="background: #dbe793; color: white; padding: 5px; text-shadow: 2px 2px 2px #92b646;">
Ejemplo de text-shadow número tres</div>
<blockquote class="tr_bq">
<span style="font-family: Georgia,"Times New Roman",serif;">text-shadow: 2px 2px 3px #92b646; </span></blockquote>
<br />
Ya les toca a ustedes jugar un poco a ver cómo quedan!</div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com0tag:blogger.com,1999:blog-6175922248349265681.post-80054666895986340552014-05-02T14:05:00.002-03:002014-05-02T14:34:14.903-03:00CSS: efecto hover<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXOB269NqOAo6ZhQHVmuZeNx9KxCGlttK9LT_J8KtbfbAmtkJzDNMutN4FJtQjf6myoBFHBYte6Xn0vfqhvuYyJ5oDjdvEDlEgMg_pXhZDtaF8HKkgxyFpxFupTyLebo2UduY5nqVHwW8/s1600/hovereffect.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXOB269NqOAo6ZhQHVmuZeNx9KxCGlttK9LT_J8KtbfbAmtkJzDNMutN4FJtQjf6myoBFHBYte6Xn0vfqhvuYyJ5oDjdvEDlEgMg_pXhZDtaF8HKkgxyFpxFupTyLebo2UduY5nqVHwW8/s1600/hovereffect.png" /></a></div>
<div style="text-align: justify;">
</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Muchas de las propiedades de CSS que van a encontrar en la lista quedan muy bonitas si hacemos que sean diferentes cuando pasamos el mouse por encima de algo.<b> </b>Lo que nos sirve para esto es el <i><b><span style="font-family: Georgia,"Times New Roman",serif;">:hover</span></b></i>. Y sirve para cualquier elemento.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
¿Cómo lo usamos? Bueno, hagamoslo con un ejemplo para hacerlo más sencillo: tomemos el caso de las imágenes. Cuando van al código del blog, la propiedad que habla de las imágenes es <span style="font-family: Georgia,"Times New Roman",serif;"><b>img</b></span> (aunque puede aparecer como post-img o diferente, segun de qué imágenes se trate) Y si yo quiero que cambie el efecto, entonces deberé agregar<span style="font-family: Georgia,"Times New Roman",serif;"> <b>img:hover</b></span>.</div>
<div style="text-align: justify;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3SQmPlFxlbswBU5-tMf5_NCoLO02f4tW2ZpF0GXoW4Pnz4R60X8dmu_USY51yruIzAQyW1WGdjvdqThjKmhGyC7NpSFyu7bKEVK0Wg1sZiP7K1T_OfC1va8GdbMUZRSJMh6dM2_ZQrJg/s1600/9.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3SQmPlFxlbswBU5-tMf5_NCoLO02f4tW2ZpF0GXoW4Pnz4R60X8dmu_USY51yruIzAQyW1WGdjvdqThjKmhGyC7NpSFyu7bKEVK0Wg1sZiP7K1T_OfC1va8GdbMUZRSJMh6dM2_ZQrJg/s1600/9.png" height="152" width="320" /></a></div>
<div style="text-align: justify;">
</div>
<div style="text-align: justify;">
Como ya dije, sirve para cualquier elemento. Por lo tanto a cualquier elemento que quieren cambiar un efecto al pasar el cursor por encima, deben incluirlo un hover. Así que recuerden, a partir de ahora, <span style="font-family: Georgia,"Times New Roman",serif;"><i>hover = al pasar el cursor</i></span>. Y siempre se agrega así: elemento:hover Por ejemplo, a:hover (para los links), img:hover, blockquote:hover, etc.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Quizás es un poco dificil de verlo pero cualquier cosa, me dejan un comentario y lo vemos!</div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com0tag:blogger.com,1999:blog-6175922248349265681.post-26299625742890392322014-05-01T20:07:00.003-03:002014-05-01T20:07:59.864-03:00¿Adivinas quién lo dijo? (1A)<div style="text-align: center;">
<div style="text-align: justify;">
¡Hola! Bueno, ¿recuerdan <a href="http://notasinglesong.blogspot.com.ar/2014/02/quieres-una-plantilla-100-personalizada.html" target="_blank">esta</a> entrada donde les comenté sobre un pequeño juego donde participabamos por una plantilla personalizada? La verdad es que nunca comencé con él porque me dió la sensación de que no les había interesado tanto. Pero vamos por él, para ver si se animan un poco. Y sino tocará cancelarlo y ya está.</div>
<br /></div>
<div style="text-align: center;">
Comenzamos con la primera frase, que creo que es bastante facilita.</div>
<div style="text-align: justify;">
Pueden ver las reglas <a href="http://notasinglesong.blogspot.com.ar/2014/02/quieres-una-plantilla-100-personalizada.html">aquí</a>; si tienen alguna pregunta, haganla para no recibir reclamos luego. Pero <b>recuerden</b>: comentar <u>escribiendo correctamente</u> de qué película, libro o sie es la frase, y si quieren y lo saben, quién la dijo. El jueves o viernes dejo la próxima frase, ¡a estar atentos!<br />
<br />
Y la frase del día de hoy es... <br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJtN01AVFZsZJ3ZkRMtSv4m8Gl0aR4LTVxm_fHUqqkt_e8DJ9O4oAJx3amPD_m3rZvK-7hzKGE851ClgT6SFIxMrA4oy-5FKVz2beqcECyQpiyJBB8tUyto1oKXbmsfrfk4eEardAaIZE/s1600/adivinasquienlodijo1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJtN01AVFZsZJ3ZkRMtSv4m8Gl0aR4LTVxm_fHUqqkt_e8DJ9O4oAJx3amPD_m3rZvK-7hzKGE851ClgT6SFIxMrA4oy-5FKVz2beqcECyQpiyJBB8tUyto1oKXbmsfrfk4eEardAaIZE/s1600/adivinasquienlodijo1.png" /></a></div>
</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: center;">
<b><span style="font-family: Georgia,"Times New Roman",serif;"><span style="font-size: large;"><i>"Secrets aren't secrets, they are weapons. Things you keep in your pocket until you need them."</i></span></span></b></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
(Los secretos no son secretos, son armas que guardas en tu bolsillo hasta que los necesites.)</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<i><span style="font-size: large;"><span style="font-family: Georgia,"Times New Roman",serif;">¡!</span></span></i> Pongo la frase en español por si hay alguien que no entiende inglés y quiere saber qué pone. Pero les recomiendo, que si no tienen idea de dónde es y van a buscar en Google, la busquen en inlgés. Sólo un dato jaja.<br />
<br />
Recuerden que sus comentarios no serán visibles hasta que haga el recuento de puntos y publique la próxima pregunta, así que no se preocupen si no sale cuando lo publican, que es por eso.</div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com14tag:blogger.com,1999:blog-6175922248349265681.post-12538865272193964102014-05-01T00:24:00.003-03:002014-05-01T00:24:53.229-03:00Hello may!<div style="text-align: justify;">
El título de la entrada es porque no sabía que poner y bueno, estaba en WeHeartIt y apareció esta foto:</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1SOTSOrT3o1QKjrJxl85F5Bun36AZ48thQUBuixel4uwffwUfPLf2prdnVqzdRBqLk-BThEQi5z4vUlIwDlq11ZicVipwqGeI0YkJzMADHvIKAUxMebS355DV-MoZb2z2GMkP68D6FMw/s1600/hellomay.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1SOTSOrT3o1QKjrJxl85F5Bun36AZ48thQUBuixel4uwffwUfPLf2prdnVqzdRBqLk-BThEQi5z4vUlIwDlq11ZicVipwqGeI0YkJzMADHvIKAUxMebS355DV-MoZb2z2GMkP68D6FMw/s1600/hellomay.png" /></a></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Y me recordo que ya estamos en Mayo. Ok, y creanme cuando les digo que me siento mi abuela cuando pienso que <i>"el tiempo pasa volando"</i>. Real.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Esta entrada no va de tutoriales ni de plantillas ni de recursos, no. Solamente quería contarles algo y es que a partir de este momento, este blog deja de ser oficialmente un blog relacionado con el diseño, los tutoriales, el photoshop, los blogs y blah, blah, blah. Vamos, como ha venido siendo siempre hasta ahora.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Obviamente
que voy a seguir subiendo cosas de estas, seguiré subiendo los
tutoriales para hacer sus propias plantillas y tal pero también voy a
hacer entradas de otras cosas. Random, variadas, diversas... lo que se me venga en mente. Sin ir má lejos, recién estaba mirando una serie y me dije <i>"me apetece contarle al mundo en una entrada sobre mis 10 series preferidas"</i>;
porque amo ver series y me encanta compartir opiniones con otras
personas. Y así me pasa con muchas otras cosas, los libros por ejemplo. Y
como este blog tiene llegada a bastante gente, creí que sería una buena
opción para hacerlo.</div>
<div style="text-align: justify;">
<br /></div>
No se si a muchos irá a gustarles la idea, porque ultimamente algunos andan reclamando astante pero como una vez alguien me dijo, al fin y al cabo este es mi blog y puedo hacer lo que me venga en gana con él, así que iremos a probar con esto. Esto, para que no se lleven una sorpresa. Son bienvenidos a decirme qué les parece y si hay algun <i>extra</i> que les gustaría que publicara.<br /><div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<i><span style="font-family: Georgia,"Times New Roman",serif;"><b>A otra cosa mariposa...</b></span></i></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Tengo un par de entradas pendientes para ser publicadas. Estan ahí casi que listillas para ser publicadas pero a todas les falta uno que otro detalle. Una tiene que ver con los tutoriales de cómo hacer una plantilla y la otra... también, pero más que nada con el diseño, no tanto con los códigos que es lo que venimos haciendo hasta ahora. Intentaré acabar con alguna mañana y luego el sábado o el domingo, publicaré la otra (si es que hay un par de comentarios, tampoco es cuestión de hacer el tonto... a veces hasta siento que hablo sola jajaja).</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Y creo que esto es todo. Ah, en <i>"Peligro mundial"</i> nos informan que faltan 43 días y no se cuantas horas para el primer partido de Argentina en el mundial, quiero que empiece así como ya. Lo peor de todo es que no se por que pensaba que para la fecha que empezaba el mundial ya iba a estar libre de exámenes, tranquila para estar tirada en el sillón mirando cuanto partido televisaran y no. Voy a estar en plena temporada de exámenes de mitad de curso, fiesta!</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Bueno gente, me voy a dormir porque mañana me espera un laaaargo día. Acá los dejo con el <span style="font-family: Georgia,"Times New Roman",serif;"><i><b>asquerosamente perfecto</b></i></span> Dylan O' Brien. Y el que diga que no es perfecto puede ir cerrando el blog......... No mentira, pero en serio, lo amo. <i>*fangirling*</i> <b>Si alguna ama a Dylan, say it! Pero es mío, ok? </b><i>*end of fangirling*</i></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTygIbd34sxg8LzJ5t7sxQMX_t9vECGbAaTqSGFHHdMVGfBSqUUzbuiF1qPWOTWTlL3f7JYwTxXBaCpuhUi5XkPjzztfaoucwBf_PKJhc2ZPSMoAKU3E6u3vctRd8fuwqItgFFECItwTo/s1600/ad84js.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTygIbd34sxg8LzJ5t7sxQMX_t9vECGbAaTqSGFHHdMVGfBSqUUzbuiF1qPWOTWTlL3f7JYwTxXBaCpuhUi5XkPjzztfaoucwBf_PKJhc2ZPSMoAKU3E6u3vctRd8fuwqItgFFECItwTo/s1600/ad84js.gif" /></a></div>
<div style="text-align: justify;">
<br /></div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com6tag:blogger.com,1999:blog-6175922248349265681.post-6862520183537153042014-04-22T21:41:00.001-03:002014-04-22T21:43:18.133-03:00Around the world blogger theme<div style="text-align: justify;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhO8D4jXffmu7ArxCjh6HsEyQOlWxuhgNOmEYIAIeg5t1GUJBzfkTh3c4MsBedf8ygI_aw-UJgpcOZadvmM7tFbCHmon7qQgoFYp-r3D8SF8WYcwBgdmvXz6HH6ewpCThTDf6_HJLKz3uY/s1600/aroundthewolrd.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhO8D4jXffmu7ArxCjh6HsEyQOlWxuhgNOmEYIAIeg5t1GUJBzfkTh3c4MsBedf8ygI_aw-UJgpcOZadvmM7tFbCHmon7qQgoFYp-r3D8SF8WYcwBgdmvXz6HH6ewpCThTDf6_HJLKz3uY/s1600/aroundthewolrd.png" /></a></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
¡Hola! Ultimamente tengo muchas cosas que hacer pero yo es que cada vez
pierdo más tiempo, así que me dispuse a hacer algo productivo e hice
esta nueva plantilla descargable exclusiva para ustedes. Me gustó
bastante el resultado, considerando que hace tiempo que perdí la
inspiración y no la encuentro por ninguna parte. Igual, como siempre, es
una base y pueden cambiar todo lo que quieran.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Esta vez en el archivo que descarguen, además de encontrar el archivo xml de plantilla, van a encontrar 2 archivos PSD del menú y el header. Pueden modificarlos con sus links y el nombre de su blog o sencillamente pueden utilizar otros, más abajo explico como pueden quitarlos.<br />
<a name='more'></a></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: center;">
<b><span style="font-family: Georgia,"Times New Roman",serif;"><a href="http://aroundtheworlddemo.blogspot.com.ar/" target="_blank">{DEMO}</a> | <a href="https://www.mediafire.com/?d4dujoz4jpf41ys" target="_blank">{DOWNLOAD}</a></span></b></div>
<div style="text-align: center;">
Si no estas seguro sobre cómo instalarla, <a href="http://notasinglesong.blogspot.com.ar/2013/01/como-instalar-un-blogger-template.html" target="_blank">haz clic aquí</a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: justify;">
A continuación les explico un par de cosas sobre el menú. </div>
<div style="text-align: justify;">
Como ya dije, es una imagen y tienen en el archivo descargable el PSD para que puedan modificarlo y cambiar LINK 1, LINK 2, etc. por lo que ustedes quieren. </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Si les gusta y quieren utilizarlo, solo tienen que modificarlo en Photoshop, luego cargan la imagen en una página como Tinypic y ya que tengan el link por ahí, le van a hacer el image-map para que funcionen los links. Si no saben cómo hacer image-map <a href="http://notasinglesong.blogspot.com.ar/2012/10/como-hacer-imagemap-tu-header.html" target="_blank">pueden revisar este tutorial</a>.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Luego, ya que tengan el código que corresponde a su header mapeado, abren el editor de HTML y buscan<span style="font-family: Georgia,"Times New Roman",serif;"><i><b> <div class='menu'>.</b></i></span> Justo por debajo te saldrá <i><span style="font-family: Georgia,"Times New Roman",serif;"><img src='http://i57.tinypic.com/2vtuyqe.jpg'/></span></i> esta ultima línea la borras y la reemplazas por el código que hayas obtenido desde image-maps.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Por otra parte, si no deseas el menu y quieres eliminarlo, vas a buscar <span style="font-family: Georgia,"Times New Roman",serif;"><i><b><div class='menu'> </b></i></span>y borras desde ahí hasta el primer </div> que sale inmediatamente después del link de la imagen y voilá, habrá desaparecido!<br />
<br />
Otra cosa... el diminuto link al blog que aparece hasta abajo de todo. Si por alguna razón quisieran quitarlo, no tengo problemas, pero les agradecería que me lo comentaran.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Bueno, realmente espero que les guste! Así que espero comentarios, sugerencias y/o críticas... que siempre que sean constructivas, ya saben que son bienvenidas. Cualquier cosa que quieran saber, ya saben, me preguntan y les respondo encantadísima :) Un besito</div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com9tag:blogger.com,1999:blog-6175922248349265681.post-74911043713767895262014-04-21T19:23:00.000-03:002014-04-21T19:28:50.895-03:00Cómo hacer una plantilla: el título de las entradas<div style="text-align: justify;">
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkLfR5D03ka3NzfTouE2wTK2unRh9ulUDYRrAINgebWSPYBuuT_ArRcHlFTDrAyIQnTC-ecMxAtxdAvOQARWvzTSz8TgoN9cG_5vf2iiFr_Vc_y4XenbhGhr8CqobEtpjaaXNxQ_8yLYY/s1600/tituloentradassss.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkLfR5D03ka3NzfTouE2wTK2unRh9ulUDYRrAINgebWSPYBuuT_ArRcHlFTDrAyIQnTC-ecMxAtxdAvOQARWvzTSz8TgoN9cG_5vf2iiFr_Vc_y4XenbhGhr8CqobEtpjaaXNxQ_8yLYY/s1600/tituloentradassss.png" /></a></div>
<div style="text-align: center;">
<span style="font-family: Georgia,"Times New Roman",serif;"><i>**Un par de novedades hasta el final!**</i></span><br />
<br />
<div style="text-align: justify;">
¡Hola! Vamos a seguir tratando de entender nuestra plantilla... hoy veremos cómo modificar el título de las entradas. Así que si tienen ganas de aprenderlo, los invito a seguir leyendo.</div>
<div style="text-align: justify;">
<span style="font-family: Georgia,"Times New Roman",serif;"><i><br /></i></span></div>
</div>
<a name='more'></a><br />
<br /></div>
<div style="text-align: justify;">
Como siempre digo, primero lo primero.</div>
<div style="text-align: justify;">
¿Cuál es el código que hace alusión al título de las entradas? </div>
<div style="text-align: justify;">
Bien, será cualquiera que haga contenga h3 <i>(dato: esto es así en la gran mayoría de las plantillas por no decir <b>todas</b>)</i>. </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
En nuestro caso vamos a abrir el buscador (recuerden hacer clic en el cuadro de código, luego CTRL+F)y buscamos <i><span style="font-family: Georgia,"Times New Roman",serif;"><b>.post h3</b></span></i><br />
<br />
Esto sirve cuando vemos el título de una entrada desde el link directo a la misma; es decir si la vemos desde la página principal (donde vemos todas las últimas entradas publicadas), estaríamos viendo el título como un link (ya que si le hacemos clic nos lleva a la entrada) y eso toca definirlo en un apartado diferente que explico más abajo. </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Nos vamos a encontrar esto, pueden modificar lo que esta señalado</div>
<blockquote class="tr_bq">
<div style="text-align: justify;">
.post h3 {<br />
margin:.25em 0 0;<br />
padding:0 0 4px;<br />
font-size: 140%; / * - Tamaño de letra, recomiendo cambiarlo por un valor en px - * /<br />
font-weight: normal; / * - Cambia normal por <i>bold</i> si quieres que poner la letra en <b>negrita</b> - * / <br />
line-height: 1.4em;<br />
color: $titlecolor; / * - Cambia <i>$titlecolor </i>por el código de un color, ej #ff0000 - * /<br />
}</div>
</blockquote>
<div style="text-align: justify;">
Te recomiendo también agregar <i><span style="font-family: Georgia,"Times New Roman",serif;"><b>font-family: Georgia</b></span></i>; cambiando el Georgia por el nombre de la letra que quieres que tenga tu título. Solo puedes poner nombres de letras comunes como Arial, Trebuchet, Georgia, Courier, etc. Si quieres poner una letra diferente que tengas en tu PC puedes hacerlo <a href="http://notasinglesong.blogspot.com.ar/2014/02/como-poner-fuentes-personalizadas-en.html" target="_blank">siguiendo este tutorial</a>.</div>
<div style="text-align: justify;">
<br />
Otra cosa que pueden agregar, y que me preguntan mucho, es la propiedad de alineación del texto que será <span style="font-family: Georgia,"Times New Roman",serif;"><i><b>text-align: left/center/center</b></i></span>; (una sola opción; izquierda, centrado o derecha)</div>
<div style="text-align: justify;">
Inmediatamente debajo encontraras <i><span style="font-family: Georgia,"Times New Roman",serif;"><b>.post h3 a</b></span></i> y <i><span style="font-family: Georgia,"Times New Roman",serif;"><b>.post h3 a:visited</b></span></i> y pelín más abajo <b><i><span style="font-family: Georgia,"Times New Roman",serif;">.post h3 a:hover </span></i></b>Estos sirven ahora sí para cuando ves las entradas desde la página principal ya que desde allí si ven como un link.</div>
<div style="text-align: justify;">
<b><i><span style="font-family: Georgia,"Times New Roman",serif;"><br /></span></i></b></div>
<div style="text-align: justify;">
<b><i><span style="font-family: Georgia,"Times New Roman",serif;">.post h3 a y .post h3 a:visited </span></i></b>son para el link normal y para el link después de que fue visitado, es decir después de que se le hizo clic. Aparecen juntos, así que se verán igual. </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Lo que si puedes poner diferente es el <b><i><span style="font-family: Georgia,"Times New Roman",serif;">.post h3 a:hover </span></i></b>que es para cuando le pasas el mouse al link por encima. De nuevo, modifica a tu gusto en cada caso sólo lo que marco.</div>
<blockquote class="tr_bq">
<div style="text-align: justify;">
.post h3 a, .post h3 a:visited, .post h3 strong {<br />
display:block;<br />
text-decoration:none; / * - Puedes poner <i>italic</i>, <u>underline</u> o <b>bold</b>, ¡solo una! - * /<br />
color:$titlecolor; / * - Cambia <i>$titlecolor </i>por el código de un color, ej #ff0000 - * /<br />
font-weight:normal; / * - Cambia normal por <i>bold</i> si quieres que poner la letra en <b>negrita</b> - * / <br />
}
<br />
.post h3 strong, .post h3 a:hover {
<br />
color:$textcolor; / * - Cambia $titlecolor por el código de un color, ej #ffff00 - * /
}</div>
</blockquote>
<div style="text-align: justify;">
</div>
Y con eso modificamos lo básico del título de las entradas. Existen miles de efectos que pueden poner si juegan con los valores y otras propiedades; si las conocen, las pueden aplicar. Más adelante haré una entrada con propiedades CSS que pueden usar para sus títulos.<br />
<br />
Bueno y hasta aquí por hoy, había pensado en hacer en conjunto el título de las entradas en conjunto con el título de los gadgets pero este último tiene una pequeña complicación que prefiero explicar en una entrada aparte, con otra cosa.<br />
<br />
Como siempre, cualquier duda, espero sus comentarios. O sin dudas, simplemente para hacerme saber que leen estos tutoriales ya que los pidieron muchisimo y la verdad es que muy poca gente anda comentando en ellos... la verdad, hacerlos para nadie sería una pérdida de tiempo :(<br />
<br />
Y antes de irme, les comento para los que no me siguen en twitter (<a href="https://twitter.com/notasinglesong" target="_blank">@notasinglesong</a>) o para quienes que no lo hayan visto que estoy preparando un nuevo theme descargable :) Creo que a partir del fin de semana estará disponible para descargar!<br />
<br />
Besos mileeees :)
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com3tag:blogger.com,1999:blog-6175922248349265681.post-29171644475740313282014-04-17T14:27:00.001-03:002014-04-17T14:27:19.724-03:00¿Por qué creas un blog?<div style="text-align: justify;">
¡Hola! Esta es una entrada que, a ver, no es que se relacione demasiado con el contenido del blog pero si que lo hace un poco y es algo que me hace ruidito desde hace bastante. Pueden quedarse a leer que pienso al respecto o no, simplemente quería decirlo.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Es una cosa que me molesta. </div>
<div style="text-align: justify;">
O no se si 'molestar' sea la palabra adecuada pero es que no lo entiendo.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
A ver, que no se por donde empezar. Es algo que he visto mucho tiempo y que incluso he llegado a experimentar, así que porque he pasado por ello es que voy a hablar de mi experiencia personal. </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
El caso es que no entiendo porque hay mucha gente que cree que tener un blog <i>'exitoso'</i> o <i>'conocido'</i> es una cosa que se consiga de la noche a la mañana. Que no, que no es así.<br />
<br />
Por ejemplo, me pasa de ver que dejen comentarios diciendo <i>'qué hermoso tu blog! cómo lo has hecho?'</i>. Es que a ver, crear un blog es como crearte un Twitter, una cuenta en Gmail o lo que sea... en pocas palabras, no es ninguna ciencia. Pero no se, es que pienso que su pregunta apunta a otra cosa, ¿no? Y luego estas mismas personas son las que luego se aparecen con un blog que, casi por casualidad, tiene un nombre parecido al tuyo, cuyo diseño se asemeja al tuyo y que incluso llega a copiar la forma en la que escribes o las cosas que subes. </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Y es que no me entra en la cabeza cómo alguien puede pensar que un día abriste el blog y que al siguiente ya tenías más de 100 seguidores o más de 50.000 visitas. No, no y no! Que construir el blog y que llegue a ser conocido o como sea, requiere tiempo, esfuerzo, dedicación y sobre todo, hacerlo por gusto, porque lo disfrutas y no porque pienses que la gente va a agolparse a entrar en tu blog.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi97mjMcztPz0MffNidNSw72x6Z0rBNLcHuIegNbn46n1hIUu7W9m2xLOy8kRBEF8sIKqL6zUVvtBhKpN1HKjEvwJK_6EYJc-rKknKiAxjIf2Q4eRwaWOABP8K3AWaM3vFThseU0xXZFtQ/s1600/Sin+t%C3%ADtulo-4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi97mjMcztPz0MffNidNSw72x6Z0rBNLcHuIegNbn46n1hIUu7W9m2xLOy8kRBEF8sIKqL6zUVvtBhKpN1HKjEvwJK_6EYJc-rKknKiAxjIf2Q4eRwaWOABP8K3AWaM3vFThseU0xXZFtQ/s1600/Sin+t%C3%ADtulo-4.png" height="280" width="400" /></a></div>
<div style="text-align: center;">
<b><i><span style="font-family: Georgia,"Times New Roman",serif;"> "El éxito no es fácil y realmente no es para los perezosos"</span></i></b></div>
<br />
Así que si estas pensando un blog con ese propósito, mejor no lo hagas. Seguro que te cansas a las 2 semanas al ver que solo tienes 2 o 3 seguidores y acabas dejandolo, como el 90% de la gente que se aparece por Blogger solo para que le digan maravillas.<br />
<br />
Estoy segura de que los blogs más conocidos son los que menos esperaron el reconocimiento de los demás... ¿soy la única loca por aquí que piensa así? <br />
<br />
Y por último, si de verdad le pones ganas a lo que haces y te dedicas a tu blog, no te eches abajo porque no tienes suficientes seguidores o visitas en un tiempo mínimo... son sólo números y aunque tardan en llegar, en ocasiones mucho más de lo que esperamos o queremos, al final llegan! </div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com11tag:blogger.com,1999:blog-6175922248349265681.post-25366410718694495992014-04-14T13:27:00.000-03:002014-04-14T13:27:02.145-03:00Cómo hacer una plantilla: la cabecera<div style="text-align: justify;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz9tnDIxyGajExTIEiXjroWX0MariujAPesKQEe94WrXirsaI0j7Wf4vaVTQV25bwWEzPQnYu60HH8osgZql3_jD0ukCyJ_XI8G1QH4I7lmdzbrxPmEqGAp-IIiEOELm2Ro1mLzWOiOzE/s1600/lacabecera.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz9tnDIxyGajExTIEiXjroWX0MariujAPesKQEe94WrXirsaI0j7Wf4vaVTQV25bwWEzPQnYu60HH8osgZql3_jD0ukCyJ_XI8G1QH4I7lmdzbrxPmEqGAp-IIiEOELm2Ro1mLzWOiOzE/s1600/lacabecera.png" /></a></div>
<br />
¡Hola a todos! Cuarta entrega de la serie de tutoriales 'cómo hacer tu propia plantilla para Blogger'. En esta oportunidad veremos cómo modificar el encabezado o header de nuestros blogs. </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Si nos remontamos a la primera entrada, les había contado que la cabecera de nuestro blog está contenida dentro de <i><span style="font-family: Georgia,"Times New Roman",serif;"><b>#header-wrapper</b></span></i>. También vimos cómo modificar el ancho del mismo a nuestro gusto. Hoy veremos cómo podemos darle estilo al título o bien reemplazarlo por una imagen.<br />
<a name='more'></a></div>
<blockquote class="tr_bq">
<div style="text-align: justify;">
<b>1. Modificando el título</b></div>
</blockquote>
<div style="text-align: justify;">
Si lo que quieres es simplemente cambiar la letra, el color, el tamaño, etc. del título de tu blog lo haces desde <span style="font-family: Georgia,"Times New Roman",serif;"><b>#header</b></span>. Ya sabes, font-family para el tipo de letra, font-size para el tamaño, etc.; cosas que hemos visto en más de un tutorial. En próximas entradas haré una guía de CSS para que tengan todo ordenado.</div>
<blockquote class="tr_bq">
<div style="text-align: justify;">
<b>2. Reemplazando el título por una imagen</b></div>
</blockquote>
<div style="text-align: justify;">
Si en cambio quieres colocar una imagen, lo que tienes que hacer es hacer tu imagen en cualquier programa de diseño prestando atención a las medidas que vas a utilizar y luego cargarla a un servidor con Tinypic.<br />
</div>
<div style="text-align: justify;">
<br />
<br /></div>
<div style="text-align: justify;">
Una vez tengas el link de tu imagen, vas a ir '<u>Editar HTML</u>' en tu blog y vas asegurarte de dentro de #header-wrapper el 'width' coincide con el ancho de tu imagen, es decir si hiciste tu header de 900x500px, el width de header wrapper debe ser de 900px.<br />
<br />
Luego vas a ir a buscar: <i><span style="font-family: Georgia,"Times New Roman",serif;"><div id="header-wrapper"></span></i> te saldrá algo como lo que muestro a continuación y vas a eliminar lo que está dentro de la etiqueta, como te marco:<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdoEhDvmIwJpjquqBLbXD5XmXqhzQj68DDpM-p5V_XdTGtNWw4ocHFj4921Bi6Q7FPfUdFTiYEJAHW80SDBoxkPwqjhm0KdhgkvzGmbx5DtVe4NXjbA0HRDOhwcEu13j3AetUtquqVIww/s1600/8.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdoEhDvmIwJpjquqBLbXD5XmXqhzQj68DDpM-p5V_XdTGtNWw4ocHFj4921Bi6Q7FPfUdFTiYEJAHW80SDBoxkPwqjhm0KdhgkvzGmbx5DtVe4NXjbA0HRDOhwcEu13j3AetUtquqVIww/s1600/8.png" height="32" width="400" /></a></div>
<br />
Una vez lo que hayas borrado, lo vas a reemplazar por esto:</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<i><span style="font-family: Georgia,"Times New Roman",serif;"> <img src="link de tu imagen" /></span></i></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
También puedes decidir colocar un header con image-map, en ese caso en vez de pegar el código anterior, simplemente pegarías el código que obtienes después de hacerlo. </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Si no sabes qué es image-map o cómo hacerlo, puedes revisar este tutorial <span style="font-family: Georgia,"Times New Roman",serif;"><a href="http://notasinglesong.blogspot.com.ar/2012/10/como-hacer-imagemap-tu-header.html">{cómo hacer image-map a tu header}</a></span> que hice hace un tiempo.<br />
<br />
Entonces ya lo único que te queda es reemplazr 'link de tu imagen' por el link que hayas conseguido cuando cargaste la imagen a Tinypic. <br />
<br />
Puede pasarte que cuando lo pongas, te salga un pequeño borde por debajo o por encima de la imagen; si ese es tu caso, vuelva a #header-wrapper y debajo del width agrega: <span style="font-family: Georgia,"Times New Roman",serif;"><b>height: XXpx;</b></span> reemplazando el XX por el valor de la altura de tu header y problema solucionado.<br />
<br />
Recuerden que voy haciendo la prueba de cómo iría quedando el blog <a href="http://dreamingaboutwonderland.blogspot.com.ar/" target="_blank">{aquí}</a><br />
<br />
Y listo, ya tendrías tu blog con una cabecera! Cualquier duda, dejen su comentario :)<br />
</div>
catalina ∞http://www.blogger.com/profile/02416643383771291393noreply@blogger.com2tag:blogger.com,1999:blog-6175922248349265681.post-7863623123175118882014-03-31T15:43:00.000-03:002014-03-31T15:43:00.522-03:00Backgrounds para tu blog: estilo 'tribal'<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoJSM2-wYKgbqUPbWECFKqNBVDxRb7cMKaJMnvdCx2jUUMHf-R2pgn6nN4cjCcS5qsYitHWyJqyNGh_wVGa3jsLrsFzD_hg1hJZMIQfldy7RztbuK9UH_X5GDUvRcf9vv4uC-UMr4SAODv/s1600/preview.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoJSM2-wYKgbqUPbWECFKqNBVDxRb7cMKaJMnvdCx2jUUMHf-R2pgn6nN4cjCcS5qsYitHWyJqyNGh_wVGa3jsLrsFzD_hg1hJZMIQfldy7RztbuK9UH_X5GDUvRcf9vv4uC-UMr4SAODv/s1600/preview.png" height="300" width="500" /></a></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
¡Hola! Hace un tiempo me topé con este tipo de fondos que me eeencantaron así que quería compartirlos con ustedes, quedan super lindos. Son 15 fondos diferentes y a todos los recolecté de WeHeartIt :) Espero que les gusten y los disfruten!</div>
<div style="text-align: justify;">
<br />
<a name='more'></a>Yo les llamo 'estilo tribal' porque me recuerda a eso pero por si no saben muy bien a qué me refiero, les dejo una imagen con algunos de los fondos que contiene el pack pero como ya dije son 15 en total así que no estan todos... son realmente muy hermosos!</div>
<div style="text-align: justify;">
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhv084pxyY4iKj9lslQiN2maTt_R7b6ZXtoS9mVJRfVxAZU_Nt9AOW7hwUHKgN4QEU7kzYktfevKhEIjWGqWgv421KLPFtklmzU5s-H5Fv510j-2FVaIDyqdiXgZsElNjRgkhVSxY1cZNaW/s1600/preview2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhv084pxyY4iKj9lslQiN2maTt_R7b6ZXtoS9mVJRfVxAZU_Nt9AOW7hwUHKgN4QEU7kzYktfevKhEIjWGqWgv421KLPFtklmzU5s-H5Fv510j-2FVaIDyqdiXgZsElNjRgkhVSxY1cZNaW/s1600/preview2.png" height="240" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://www.mediafire.com/?dl6xbvant77rd41" target="_blank"><img alt="https://www.mediafire.com/?dl6xbvant77rd41" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOdrbCJ9IoOezYHNIuXMtlk0llSI2I4FWCwW8bI5jzttpAs9o1aJtcMb0uqHetVJlR_pRWqsECQ5fseu_WDxOWBr7a8-6DSiH3R8QXEuTWznBcWGmJOxJy08uPqhpD8wE-VRgRzni8zEQI/s1600/DESCARGA.png" style="background: transparent;" /></a></div>
</div>
catalina ∞http://www.blogger.com/profile/02416643383771291393noreply@blogger.com7tag:blogger.com,1999:blog-6175922248349265681.post-34778282790799164022014-03-22T15:35:00.000-03:002014-03-22T22:26:20.026-03:00Cómo hacer una plantilla: todo sobre los fondos<div style="text-align: justify;">
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0uLfdBQ7MwshfdxDciTlXI3t88Eokwx6pQkaGcQ5T5yJfjFvurfmIy_ZEbr_Cjzq2kFDRMWExQlH062CDtl5TAdQ7ziYYtOQzSyVNLxTOgf5pBkaqVbbV-Yb8-BSnINlMfewZI6_jTv0/s1600/todosobrefondos.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0uLfdBQ7MwshfdxDciTlXI3t88Eokwx6pQkaGcQ5T5yJfjFvurfmIy_ZEbr_Cjzq2kFDRMWExQlH062CDtl5TAdQ7ziYYtOQzSyVNLxTOgf5pBkaqVbbV-Yb8-BSnINlMfewZI6_jTv0/s1600/todosobrefondos.png" height="300" width="500" /></a></div>
</div>
<div style="text-align: justify;">
¡Hola! Vengo con la tercera parte de estos tutoriales... En la primera
parte habíamos visto la estructura básica de nuestra plantilla con cada una
de sus partes. Hoy vamos a ver cómo ponerle un fondo a cada una de esas
partes y los diferentes tipos de fondos que existen.<br />
<a name='more'></a><br />
Primero lo primero, como siempre. Como muchos ya deben saber, el fondo puede ser un color o puede ser una imagen.</div>
<div style="text-align: justify;">
</div>
<div style="text-align: justify;">
<b>+</b> Si queremos que el color de fondo <b>de lo que fuera</b> sea un color debemos agregar dentro de la etiqueta que corresponde lo siguiente:</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
background: #ffffff;<br />
<br />
Y cambiamos el <span style="font-family: Georgia,"Times New Roman",serif;"><i>ffffff</i></span> por el código hexadecimal del color que ustedes quieran. Si no saben dónde pueden conseguir los códigos de los colores, <a href="http://www.colorpicker.com/" target="_blank"><b>esta</b></a> es una página donde pueden encontrarlos. </div>
<div style="text-align: justify;">
<br />
+ Si en cambio queremos que el fondo sea una imagen, lo que debemos agregar es:</div>
<div style="text-align: justify;">
<br />
background: url('<i>link de la imagen</i>');<br />
background-repeat: repeat/repeat-x/repeat-y/no-repeat;<br />
<br />
Notar que <i>background-repeat </i>alude a la repetición del fondo. Si queremos que solamente se repita en el eje X, es decir horizontalmente, escogemos <b>repeat-x</b>; para que solo se repita en sentido vertical, escogemos <b>repeat-y</b> y si queremos que se repita a ambos lados, pondremos <b>repeat</b>. Y si es una imagen que ocupa toda la pantalla y no queremos que se repita, colocaremos <b>no-repeat</b>.<br />
<br />
- También puede ocurrir que quieran que una parte en particular no tenga ningun tipo de fondo; en ese caso lo que se debe colocar es:<br />
<br />
background: transparent; <br />
<br />
Ahora sí, pasemos a ver cómo cambiar el fondo a distintas partes de nuestro blog.<br />
<blockquote class="tr_bq">
<b>Fondo del blog</b> </blockquote>
Para cambiar el fondo de <u>todo</u> tu blog, que en la Mínima se ve blanco, lo que tienes que buscar es <b><span style="font-family: Georgia,"Times New Roman",serif;">body {</span> </b>y donde pone background sale <b>$bgcolor</b>, a eso lo vas a reemplazar por lo que te dije antes (dependiendo si quieres imagen o color). Haciendo esto vas a tener algo así:<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhq4pW21iuHnlAqhKx8KwBR6NSjx4eDVH-NWv1_L2CODd1AwRan-7Hcj2Gr0s3e-qEBGzACdSvw9QNMmS52FhQYV32XomJKX9-fqslllUE9V9ln1SY0v-ssKTDcILIWzeTL77-OKx5rjhY/s1600/1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhq4pW21iuHnlAqhKx8KwBR6NSjx4eDVH-NWv1_L2CODd1AwRan-7Hcj2Gr0s3e-qEBGzACdSvw9QNMmS52FhQYV32XomJKX9-fqslllUE9V9ln1SY0v-ssKTDcILIWzeTL77-OKx5rjhY/s1600/1.png" height="196" width="400" /></a></div>
</div>
<div style="text-align: justify;">
<br />
Como ven, el contenido del blog no tiene fondo entonces, si quieren usar un fondo llamativo como el que se ve en la imagen, tendrán que ponerle fondo al contenido porque sino no va a llegar a leerse. Esencialmente, pueden hacerlo de 2 formas.<br />
<blockquote class="tr_bq">
<b>1. Poniendo fondo al outer-wrapper</b></blockquote>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFRT5AZAULS8ESPB3R9LTXaxP9Z-JKA2G07UTlDq9I7UfCx-0fnHYTutnDIr96-_u4EsnKaeZBHwfjVq7zCOd30kompyJGFXkTlvOu2u73cubhwozNCz_Y_WIeaMfqZy_v3ZO240tKaV8/s1600/3.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFRT5AZAULS8ESPB3R9LTXaxP9Z-JKA2G07UTlDq9I7UfCx-0fnHYTutnDIr96-_u4EsnKaeZBHwfjVq7zCOd30kompyJGFXkTlvOu2u73cubhwozNCz_Y_WIeaMfqZy_v3ZO240tKaV8/s1600/3.png" height="196" width="400" /></a></div>
<br />
+ Buscan <span style="font-family: Georgia,"Times New Roman",serif;"><b>#outer-wrapper</b></span> debajo deberan agregar la opción de fondo ya que no aparece esa propiedad (por eso se ve transparente).<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYkY_jq7dhiFqK0LmlqVQGLtbwgIa7jM7mRnZf9Eb0VNcw5bKkONQ-jzDHSo_9TDil1PhXqcF6_kVLBnC5ISX6qUodMuu0ER_ijBMxS0D57TNylAgwAs5HNmxldHbx6Bqu6UOt72Qx6-g/s1600/2.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYkY_jq7dhiFqK0LmlqVQGLtbwgIa7jM7mRnZf9Eb0VNcw5bKkONQ-jzDHSo_9TDil1PhXqcF6_kVLBnC5ISX6qUodMuu0ER_ijBMxS0D57TNylAgwAs5HNmxldHbx6Bqu6UOt72Qx6-g/s1600/2.png" height="123" width="400" /></a></div>
<blockquote class="tr_bq">
<b>2. Poniendo fondo a las columnas de entradas y sidebar por separado</b></blockquote>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQHiorS334bHnhe_u5YnoHKwQW6jYY4cmVZO4VTojwMq1JLKHsmw1xUi7Y2ooJ3jpR0hyXG5ENdv4I8kC5bLY_3tKFngbcMSrzAn0XuodU5bUSiLhuwl8AvxgYtDTukRlSdlEzky4BRXs/s1600/4.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQHiorS334bHnhe_u5YnoHKwQW6jYY4cmVZO4VTojwMq1JLKHsmw1xUi7Y2ooJ3jpR0hyXG5ENdv4I8kC5bLY_3tKFngbcMSrzAn0XuodU5bUSiLhuwl8AvxgYtDTukRlSdlEzky4BRXs/s1600/4.png" height="157" width="320" /></a></div>
</div>
<div style="text-align: justify;">
+ En este caso, tienes que buscar <span style="font-family: Georgia,"Times New Roman",serif;"><b>#main-wrapper</b></span> y <span style="font-family: Georgia,"Times New Roman",serif;"><b>#sidebar-wrapper</b></span> y agregar el fondo. Pero además debes hacer dos cosas extra (bueno, una es opcional): por un lado, agregarle una propiedad que se llama <i><span style="font-family: Georgia,"Times New Roman",serif;">'padding'</span></i> y que en pocas palabras podría definirse como un margen interno. No importa mucho ahora, solo haganme caso y agreguenlo (que no sea más de 10px):</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<center>
<textarea>padding: 5px;</textarea></center>
<br /></div>
<div style="text-align: justify;">
</div>
<div style="text-align: justify;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiS7RTk0kDwtf_EPCJFcQ8Y4FU_4VRd3SWT1CSoVAXbF8VcggQF8PARm3xODva3P8Y4LWC9z5bP-Riug6TtGMyHVKMB1m6Cdkn_EwUYy12jw5TRCYusLGB2CXg3lMAE4tBry4aFBhILe44/s1600/5.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiS7RTk0kDwtf_EPCJFcQ8Y4FU_4VRd3SWT1CSoVAXbF8VcggQF8PARm3xODva3P8Y4LWC9z5bP-Riug6TtGMyHVKMB1m6Cdkn_EwUYy12jw5TRCYusLGB2CXg3lMAE4tBry4aFBhILe44/s1600/5.png" height="163" width="320" /></a></div>
<div style="text-align: justify;">
<br />
<br />
Por otra parte, como se aprecia en la imagen, el header también se queda sin fondo. Así es que si van a usar una imagen como header, tal vez no necesiten agregarlo pero si quieren simplemente colocar el título de su blog, yo lo recomendaría. Para hacerlo, vamos a buscar <span style="font-family: Georgia,"Times New Roman",serif;"><b>#header-wrapper </b></span>y una vez más, agregamos la opción de fondo.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKoGqsBqusYldgwrscyGEi5GeFFlU_Ua5EbRe6DGVLR5QyBZl74-3tE9dUVRotZQJFmEs93tncEfXtnCxJpFUMSxtWdb4FVoBh7n4uDN1knL7rWllg24__Udcgep1Z6kPqCe45N5Daz34/s1600/7.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKoGqsBqusYldgwrscyGEi5GeFFlU_Ua5EbRe6DGVLR5QyBZl74-3tE9dUVRotZQJFmEs93tncEfXtnCxJpFUMSxtWdb4FVoBh7n4uDN1knL7rWllg24__Udcgep1Z6kPqCe45N5Daz34/s1600/7.png" height="196" width="400" /></a></div>
<br />
<i><span style="font-family: Georgia,"Times New Roman",serif;"><b>*Nota*</b></span></i> Si quieren sacar ese borde que aparece al header, borren la línea dentro de #header-wrapper que pone border: 1px solid $bordercolor; y que sale también un pelín más abajo, dentro de #header.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMZ3xcx0XTW-5QtWH1-RzPU3VkGGDtBbhAFn3HRDGZdcPizow4CtzmywI7YR_mBfnrefg0-zyx8wScBH0aQFeQten_Ga_n9y1hKuo1fWwjhAu1ZKOwG2Axi-XpaSbqzdoIq7Up0wb-6x4/s1600/6.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMZ3xcx0XTW-5QtWH1-RzPU3VkGGDtBbhAFn3HRDGZdcPizow4CtzmywI7YR_mBfnrefg0-zyx8wScBH0aQFeQten_Ga_n9y1hKuo1fWwjhAu1ZKOwG2Axi-XpaSbqzdoIq7Up0wb-6x4/s1600/6.png" height="203" width="400" /></a></div>
<br />
Hasta aquí, así lo tengo yo: <a href="http://dreamingaboutwonderland.blogspot.com.ar/" target="_blank">{ir al blog de pruebas}</a><br />
<br />
Creo que esto da posibilidades de para hacer cosas diferentes... no voy a explicar idea por idea, claramente, porque sería eterno esto, ¿no? Así que bueno hasta aquí todo por hoy, cualquier duda, me dejan un comentario :)<br />
<br />
No se que vendrá en la próxima parte porque todavía ni me he sentado a pensarlo, lo subiré en cuanto pueda aunque no creo que sea en esta semana ya que estoy de exámenes <strike><i>(si, ya tengo examenes y eso que empecé el colegio hace apenas 2 semanas, increíble)</i></strike>. Besos! </div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com10tag:blogger.com,1999:blog-6175922248349265681.post-1704043804633597212014-03-22T11:00:00.003-03:002014-03-22T11:02:57.651-03:00Cómo hacer una plantilla: modificando el ancho<div style="text-align: justify;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD2uJpGKRTvYU_aqV8BLYfbXRsNNlBdKULjI_TamQGpiPnkFvoa3e9DtOqiU3MuEqxIN_gADPNmO2oZgqRrDiazMt9MhAFWUylFjl8T2lr92pyaCXWLcxfGOj76EoQhHLZc3e_jEx6jfI/s1600/modificarancho.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD2uJpGKRTvYU_aqV8BLYfbXRsNNlBdKULjI_TamQGpiPnkFvoa3e9DtOqiU3MuEqxIN_gADPNmO2oZgqRrDiazMt9MhAFWUylFjl8T2lr92pyaCXWLcxfGOj76EoQhHLZc3e_jEx6jfI/s1600/modificarancho.png" height="300" width="500" /></a></div>
<br />
Hola! Segunda entrega de la serie de tutoriales de 'cómo hacer tu propia plantilla'; esta parte es muy cortita porque solamente voy a decirles cómo tienen que hacer para modificar el ancho de la plantilla. Por defecto viene bastante angosta así que probablemente muchos quieran agrandarlo así que rapidamente veamos cómo hacerlo. <b>Como es muy cortita, hoy habrá 2x1 y en la tarde publico una segunda entrada (que ya está lista, así que será publicada si o si!)</b>.</div>
<div style="text-align: justify;">
<br />
<a name='more'></a><br /></div>
<div style="text-align: justify;">
Bueno en primer lugar, hay que aumentar el <b>ancho del outer-wrapper</b>, es decir, no pueden ir directamente a aumentar el tamaño de las entradas proque eso causaría esto, que no queremos:</div>
<div style="text-align: justify;">
<br /></div>
<div class="separator" style="clear: both; text-align: justify;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTg7jgz0mo_KwlG8D_tc4wuc7svIyDRJUvWwlq3ImVq4_NKOAdgMtThEvZ9m0CgvgJ1g8EYrOG7AEgflxxRN8WajhqenyWflxx-ZqeQCo7nGWuISznH_QjFbw89XJcU8C2DJ6icjg9n0k/s1600/Sin+t%C3%ADtulo-1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTg7jgz0mo_KwlG8D_tc4wuc7svIyDRJUvWwlq3ImVq4_NKOAdgMtThEvZ9m0CgvgJ1g8EYrOG7AEgflxxRN8WajhqenyWflxx-ZqeQCo7nGWuISznH_QjFbw89XJcU8C2DJ6icjg9n0k/s1600/Sin+t%C3%ADtulo-1.png" height="240" width="400" /> </a></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
No se si se entiende, pero el sidebar se movería hacia abajo porque sobrepasa el ancho del lugar en el que está contenido. Entonces para evitar errores de este tipo, hay que tener en mente cual es el ancho que queremos asignarle a cada parte y <i>'sumarlas'</i> y ese valor (o mayor, pero nunca menor) va a ser el ancho de nuestro outer-wrapper.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Por ejemplo, si queremos que el ancho de las entradas sea 600px y el del sidebar 300px, el ancho de nuestro outer wrapper debe ser, como mínimo, 900px. Yo recomiendo poner un pelin de más, por las dudas si agregamos margenes, unos 40 o 50px de más pero tampoco exagerar! </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
La propiedad que nos permite modificar el anocho es <b>width</b> <strike>(para las que sepana inglés, todo tendrá sentido jaja)</strike>, por lo tanto, siempre que quieran modifcar el ancho de algo, deberan buscar su <i>'width'</i>.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Ahora sí, ¿cómo modificarlo en la plantilla Mínima? </div>
<div style="text-align: justify;">
<blockquote class="tr_bq">
<b>ATENCIÓN:</b> Para recordar en futuros tutoriales... </blockquote>
</div>
<div style="text-align: justify;">
<span style="font-family: Georgia,"Times New Roman",serif;">Antes que nada, una vez que estamos dentro del editor de HTML del blog, a la izquierda de donde dice<b> <b:skin>...</b:skin></b> (entre las primeras líneas) aparece una flechita negra, hacen clic en ella y luego dentro del cuadro. Después, apretamos CTRL+F para que se abra el buscador <u>dentro del cuadro de HTML</u>; hacer clic en el cuadro de HTML es importante para evitar que se abra el buscador del explorador, ya que de esa forma, no vamos a encontrar lo que busquemos. </span></div>
<div style="text-align: justify;">
</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
¡Recuerden este tip ya que no lo voy a repetir en todos los tutoriales! La idea es que vayamos sumando conocimientos y no que entren unos y empujen a otros fuera de nuestras cabecitas jajajaj.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
+ Buscamos <span style="font-family: Georgia,"Times New Roman",serif;"><i><b>#outer-wrapper </b></i></span>y modifcamos el width por el ancho deseado, teniendo en cuenta lo que expliqué anteriormente. En mi caso agregaría:<br />
<br />
width: 950px; <span style="font-family: Georgia,"Times New Roman",serif;"><i>{600px (entradas) + 300px (sidebar) + 50px extras}</i></span><br />
<br />
<div style="text-align: center;">
<span style="font-family: Georgia,"Times New Roman",serif;">¡Es muy importante que al finalizar cada propiedad escriban el <i><b>';'</b></i> ya que sino no saldrá, o se verá mal!</span></div>
<br />
Inmediatamente debajo encontrarán <b><span style="font-family: Georgia,"Times New Roman",serif;"><i>#main-wrapper</i></span> </b>y <span style="font-family: Georgia,"Times New Roman",serif;"><i><b>#sidebar-wrapper </b></i></span>así que hacen lo propio con esos dos apartados.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
+ Además de esto, debemos modificar el ancho del header que como explique en la primera parte, es tema aparte. Simplemente, debemos buscar <span style="font-family: Georgia,"Times New Roman",serif;"><i><b>#header-wrapper</b></i></span> y modificar el width. Les recomiendo que le pongan el mismo ancho que al #outer-wapper, pero para gustos los colores. Importante aquí es que luego, si utilizan una imagen como header, lo hagan del ancho que ponen aquí.</div>
<br />
<div style="text-align: justify;">
Y bueno, como este tutorial es muy cortito en un ratito publico uno más, que es un poco más largo pero me parecía importante explicar esto. Cualquier duda, ya saben... Besos!</div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com1tag:blogger.com,1999:blog-6175922248349265681.post-89726280435461451662014-03-07T13:05:00.002-03:002014-03-23T11:46:57.248-03:00Estructura básica de una plantilla Blogger<div style="text-align: justify;">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7SR27RuWRa166zwq4hm2MxB7uVBMVx_LyHfnmXVKhj_5_KY1DS10hm7DIumgcswc6OJnX6AsC-7ikNznHqekGO2pptf7Q2Qb63sfa1PnYucDVTDPXyo9XSFGy3zX08x4g0y2G1QFmgGc/s1600/Sin+t%C3%ADtulo-33.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7SR27RuWRa166zwq4hm2MxB7uVBMVx_LyHfnmXVKhj_5_KY1DS10hm7DIumgcswc6OJnX6AsC-7ikNznHqekGO2pptf7Q2Qb63sfa1PnYucDVTDPXyo9XSFGy3zX08x4g0y2G1QFmgGc/s1600/Sin+t%C3%ADtulo-33.png" /></a></div>
<br />
Hola! Hoy vamos a empezar a ver cómo pueden hacer sus propias plantillas; como les había contado, la idea es ayudarlos a entender mejor los códigos HTML y el CSS.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Esta primera entrada es realmente muy básica, y quizás les parezca un poco tonta o demasiado simple pero quiero ir paso a paso, poquito a poco para que todo quede claro. Y en realidad, muchas veces, las cosas más simples son las que más ayudan en los momentos más complicados y uno no se da cuenta porque las cree demasiado tontas para ser útiles.<br />
<a name='more'></a><br />
En fin, comencemos.<br />
<blockquote class="tr_bq">
Presentándoles a su blog </blockquote>
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiA6ttd8_k3sxU4UcXNstIA8NjjEsSpGHZA1qqOtoBJt-A5H4-5o_mUpnD0X33fq3w6Ya39iApBwJ_QEpHS8rQC_E2GGN7AcC6MwTVqQYOuQmJqh_bT_a8UZhFk8fMSXs-ztbU8dfkGNu0w/s1600/estructura.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiA6ttd8_k3sxU4UcXNstIA8NjjEsSpGHZA1qqOtoBJt-A5H4-5o_mUpnD0X33fq3w6Ya39iApBwJ_QEpHS8rQC_E2GGN7AcC6MwTVqQYOuQmJqh_bT_a8UZhFk8fMSXs-ztbU8dfkGNu0w/s1600/estructura.png" height="400" width="266" /></a></div>
<br />
<div style="text-align: justify;">
A grandes rasgos, ese es su blog pelado, sin nada. Todas las plantillas tienen una estructura mas o menos similar a esta. Vamos a ver qué es cada una. </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
En la plantilla Mínima vamos a encontrar '5 secciones': <b>outer-wrapper, header-wrapper, main-wrapper, sidebar-wrapper y footer-wrapper</b>. Cada <i>"wrapper"</i> (que literalmente significa envoltura) es como una caja y como tal, puede contener otras cajas más pequeñas. </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
El <b>outer-wrapper</b> es nuestra caja más grande en el blog (en la imagen, es lo blanco) y dentro de ella estan contenidas el resto de las cajas.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
A su vez, dentro de ella está el <b>content-wrapper</b> (no lo menciono ni lo incluí en la imagen porque no tiene mucha utilidad en la plantilla, simplemente está ahí para delimitar un espacio contenedor) es el que contiene a el main-wrapper y el sidebar-wrapper (excluye el footer-wrapper y header-wrapper). </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
El <b>main-wrapper</b> y el <b>sidebar-wrapper </b>son los que contienen las entradas y los gadgets (o widgets) respectivamente. Por su parte, el <b>footer-wrapper </b>es el pie de página, donde suelen incluirse los créditos o como yo tengo puesto los años online del blog y cosas así. Lo que rodea a todo, puesto en la imagen en azul claro, sería el fondo de todo el blog.<br />
<blockquote class="tr_bq">
Pasemos un poquito al HTML</blockquote>
Lo que les voy a contar es realmente muy básico, el HTML es un mundo mucho más grande que esto que les voy a contar.<br />
<br />
El HTML funciona por etiquetas que se escriben entre signos de <i>< (menor que)</i> y <i>> (mayor que)</i> y las mismas deben ser cerradas, colocando una / (barra) después de abrir el signo 'menor que'; por ejemplo, entonces nos quedaría <b><etiqueta></etiqueta1></b> y en el interior, el contenido que querramos.<br />
<br />
Cada etiqueta es como una caja; cada una de ellas puede contener muchas cosas, incluso otras cajas. Entonces, la etiqueta principal es <b><html></html></b> y dentro de ella irá todo el contenido de nuestro blog; esta etiqueta es como si tuvieramos una caja muy, muy grande donde vamos metiendo cajitas más pequeñas. Esto funciona así para cualquier otra página que este construida con HTML.<br />
<br />
Otras dos etiquetas muy importantes, y que le siguen en jerarquía son <b><body></body></b> y <b><head></head></b>. Dentro la etiqueta <i>'body'</i> va a estar incluido todo el contenido visible de nuestro blog y dentro de <i>'head'</i> estan incluidas aquellas cosas que no es que no vayan a verse pero no directamente. Yo se que esto último es confuso pero no se hagan mucho problema, lo iremos entendiendo.<br />
<br />
Basicamente, lo que viene incluido dentro de 'head' es el <b>CSS</b>, siglas para <b>'Cascading Style Sheets'</b>, lo que traducido al español significa <i>'hoja de estilos'</i> y en pocas las palabras el CSS es lo que le va a dar, valga la redundancia, estilo a nuestro blog, ¿si me explico? Va a lograr que veamos el blog de los colores que queremos, con la estructura que nos gusta, etc. Esto se incluye dentro de la etiqueta <b><style></style></b> (aunque en Blogger tiene otro nombre, que ya veremos). Entonces, por ejemplo, si queremos cambiar el color de fondo de las entradas, o cambiar el tipo de letra del título de los gadgets del sidebar o si queremos redondear las puntas de las imágenes, todo eso lo vamos a definir en la etiqueta correspondiente dentro de <style></style>.<br />
<br />
El HTML, sin el CSS, es plano. Si hicieramos una página HTML y no usaramos CSS todo se vería a blanco y negro, los links en azul y todo estaría desestructurado.</div>
<br />
<div style="text-align: justify;">
Les dejo un video, muy cortito, en el que les voy a mostrar un par de cosas; vamos a ver esto un poco mejor y a llevarlo al HTML del blog, quizás les resulte un poco aburrido porque no van a aprender nada que puedan ir y probar en sus blogs pero como ya les dije, es útil y necesario si realmente quieren aprender.<br />
<br />
Lo que muestro en el blog lo van a ver si instalan la plantilla mínima que ya deje en <a href="http://notasinglesong.blogspot.com.ar/2014/03/descarga-plantilla-minima.html">esta</a> entrada y les recomendé descargar para seguir estos tutoriales.<br />
<br /></div>
<center>
<iframe allowfullscreen="" frameborder="0" height="281" src="//www.youtube.com/embed/OVM8ckXMMZ4" width="500"></iframe></center>
<div style="text-align: center;">
<b>*vean el video en HD*</b></div>
<div style="text-align: justify;">
<br />
Algo que me olvidé de decir en el video, por si no queda del todo claro es que cuando hablo de que el HTML debe <i>'llamar'</i> al CSS lo que estoy haciendo es crear la nueva etiqueta que es lo que se hace como: <b><div class="NOMBRE DE LA ETIQUETA">Aquí iría todo el contenido</div></b>. Y como ven cada una se corresponde con una sección con propiedades (width, backgroun, float, etc.) diferentes.<br />
<br />
Esto es todo por esta entrada <i>(por si les pareció poco, jajaj)</i>. <b>Lo importante de conocer esto es que más adelante lo voy a ir nombrando, les voy a ir enseñando a personalizar cada parte entonces, cuando ustedes tengan un diseño en mente y lo quieran llevar a cabo, ya van a saber dónde putualmente tienen que modificar lo que sea para conseguir aquello que quieran.</b> Diganme si tienen alguna duda, pueden dejar un comentario y les explico con mayor detalle.<br />
<br />
Espero que comenten ^^ Si todo sale bien y me dan los tiempos, el viernes que viene publico la segunda parte; o si llego antes, pero no creo jaja. Besos!</div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com15tag:blogger.com,1999:blog-6175922248349265681.post-79301089012239934712014-03-04T16:23:00.002-03:002014-03-04T17:35:25.288-03:00Nuevos fondos/motivos<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTNYNktnztWya3Ur45thVI_EysXnOpca1YpN-ubUNm23jH_BfY6htDIf0MsR1yDgTur5GUJgYpA5gJBap3yn0Gbq9rrtxYFTfrpT2fxbXnH0j_H8XLjZLD7GTzTDaNlS4zXf1SrOjTYCA/s1600/Sin+t%C3%ADtulo-14.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTNYNktnztWya3Ur45thVI_EysXnOpca1YpN-ubUNm23jH_BfY6htDIf0MsR1yDgTur5GUJgYpA5gJBap3yn0Gbq9rrtxYFTfrpT2fxbXnH0j_H8XLjZLD7GTzTDaNlS4zXf1SrOjTYCA/s1600/Sin+t%C3%ADtulo-14.png" /></a></div>
<br />
<div style="text-align: justify;">
¡Hola! Les dejo estos fondos que también pueden usar como patterns/motivos en el Photoshop. Espero que les gusten y les sean útiles :) Besos miles!<br />
<a name='more'></a></div>
<br />
<center>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2uebDzwyfQ5OPkNZefGiSsuPaJw8mudVOc1_fvJSXaEjW6Rwb9EoFOc0VQXLcdZnQVLx7xTtTPdt6706VerC-Ha2N6l9lDLUbQADlvNl-Bxp_avNpl_YUC32wWaV-8XBRHfRZeG3Xw8w/s1600/backk4.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2uebDzwyfQ5OPkNZefGiSsuPaJw8mudVOc1_fvJSXaEjW6Rwb9EoFOc0VQXLcdZnQVLx7xTtTPdt6706VerC-Ha2N6l9lDLUbQADlvNl-Bxp_avNpl_YUC32wWaV-8XBRHfRZeG3Xw8w/s200/backk4.png" /></a> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7iNwwcz2u2jGuVa3X_tmcD8KJ95uqRAkvyBn27ccdnmMcfbHaVlxfiLbtJPz6bAIi8SmcXt_Cykm7s2QDslBCapYtnPArLiwfh3xUCEQBhGyXACi4FGRjstPP5ThrKFGkkqpXuv9f4-Q/s1600/backk4b.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7iNwwcz2u2jGuVa3X_tmcD8KJ95uqRAkvyBn27ccdnmMcfbHaVlxfiLbtJPz6bAIi8SmcXt_Cykm7s2QDslBCapYtnPArLiwfh3xUCEQBhGyXACi4FGRjstPP5ThrKFGkkqpXuv9f4-Q/s200/backk4b.png" /></a><br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinELUzb10aps7DGki7f7Oj5EtooZwLkMmuDMdSJ4vJSJZhbYUd_bCLxunCbnJ-PzNz2Oh02cnsGRUJpOtYpHz8tLLCqaRAIEwMdxt3oIF8lBa26oiKRlbTFrIdlNH7Hn4GTbNbQWzFS9g/s1600/backk3d.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinELUzb10aps7DGki7f7Oj5EtooZwLkMmuDMdSJ4vJSJZhbYUd_bCLxunCbnJ-PzNz2Oh02cnsGRUJpOtYpHz8tLLCqaRAIEwMdxt3oIF8lBa26oiKRlbTFrIdlNH7Hn4GTbNbQWzFS9g/s200/backk3d.png" /></a> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxKsXKqLXvoEJb3ygedDpLYibKX-1JXeRoj2E8kiGK_5mMiKaKcg5fUETRua4WsrQmOri1B0EwWmmWz-Vw8gwIFt8y4p92-l-WESMjmgwZKcidoCyMOY_ytg2tvTz6fD_c0qbcRwS47NU/s1600/backk3f.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxKsXKqLXvoEJb3ygedDpLYibKX-1JXeRoj2E8kiGK_5mMiKaKcg5fUETRua4WsrQmOri1B0EwWmmWz-Vw8gwIFt8y4p92-l-WESMjmgwZKcidoCyMOY_ytg2tvTz6fD_c0qbcRwS47NU/s200/backk3f.png" /></a></center>
<br />
<br />
<center>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXsKgpRyam91RfPo14PuQBiefs9EgbMQC5nHFbvcLrms-2PUCZOMpqIoauW_0AUY58OEhmgfvTkU6LY4G-jTQHcRjaL_40gpzTkoiYFh2wjEqWYzGA4kkITRO8jfM8l93w3BEnbgOkecw/s1600/backk4d.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXsKgpRyam91RfPo14PuQBiefs9EgbMQC5nHFbvcLrms-2PUCZOMpqIoauW_0AUY58OEhmgfvTkU6LY4G-jTQHcRjaL_40gpzTkoiYFh2wjEqWYzGA4kkITRO8jfM8l93w3BEnbgOkecw/s200/backk4d.png" /></a> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmqdIocEBFXRRzilSeKI-eR81goNN9pUMCQwacz2TW8F3dUYX9rp03bW_w_J9Y3joHNiOI3YdTJ0vozKIUSzOlarhXt7QiXgFMvEuuHUB2AJ6cTLqgaukpvV-gGuTARYY88nvPw82ngMc/s1600/backk4f.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmqdIocEBFXRRzilSeKI-eR81goNN9pUMCQwacz2TW8F3dUYX9rp03bW_w_J9Y3joHNiOI3YdTJ0vozKIUSzOlarhXt7QiXgFMvEuuHUB2AJ6cTLqgaukpvV-gGuTARYY88nvPw82ngMc/s200/backk4f.png" /></a><br /><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiqh7V0DU8n6nj6mn2ZMIQ_g09Ap1ZRVDGKpQNUv4bGLiIWwbQLa8aMNPXOCzU0yFjnKp3FF-_WwvmRgQU7corJeo93uYofmYrGE8H59u7bUMXDGMLC9ZSRyfZq4RUn-bSpd0qDK_ZH58/s1600/backk4e.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiqh7V0DU8n6nj6mn2ZMIQ_g09Ap1ZRVDGKpQNUv4bGLiIWwbQLa8aMNPXOCzU0yFjnKp3FF-_WwvmRgQU7corJeo93uYofmYrGE8H59u7bUMXDGMLC9ZSRyfZq4RUn-bSpd0qDK_ZH58/s200/backk4e.png" /></a> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2gGCY5A-CHZAhvPbSs9Q4_1ZCPDvBkCpvsJUyuu6DZebnCYVQGJvkqIrw6YE2tIQEtrJbUOMaLBB-oIDc3EHiFYnHIPJLd5dw2Gyajhte-mICP9M2pnH_Yzi2pctUE-JP84SooXuWOOk/s1600/backk3.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2gGCY5A-CHZAhvPbSs9Q4_1ZCPDvBkCpvsJUyuu6DZebnCYVQGJvkqIrw6YE2tIQEtrJbUOMaLBB-oIDc3EHiFYnHIPJLd5dw2Gyajhte-mICP9M2pnH_Yzi2pctUE-JP84SooXuWOOk/s200/backk3.png" /></a></center>
<div style="text-align: center;">
¡Todos estos estan hechos por mí!<br />
<br />
También les dejo estos 4 de <i>yapa</i>, pero que no hice yo ^^<br />
<br />
<br /></div>
<center>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzNughyphenhyphenoBh3O7pIuts_rqw_E3tHaL_HdwKiprVSBmpIuyj3Im2nqFHI0v42H-U46sxtSIC08HxMzLIuq2CMPE4WhAduAvHUaZfipie4P0U3z1Zou8GfdBU04glWYp9ASk8OPtvTNYqpl0/s1600/2.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzNughyphenhyphenoBh3O7pIuts_rqw_E3tHaL_HdwKiprVSBmpIuyj3Im2nqFHI0v42H-U46sxtSIC08HxMzLIuq2CMPE4WhAduAvHUaZfipie4P0U3z1Zou8GfdBU04glWYp9ASk8OPtvTNYqpl0/s200/2.png" /></a> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglrz4ek0QAQwa6GL3WGcHSJsMjLrNt-xG-JLVmzyjEh9AdAt7SmbYbkshuT6zvh_rNSFaxjV2kG1moL3Nb4O-j31JeSnBX_vdkEF30f2998KQXMZXugrMYPld3p7CN25V1R3LGdjVAPO8/s1600/2289234.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglrz4ek0QAQwa6GL3WGcHSJsMjLrNt-xG-JLVmzyjEh9AdAt7SmbYbkshuT6zvh_rNSFaxjV2kG1moL3Nb4O-j31JeSnBX_vdkEF30f2998KQXMZXugrMYPld3p7CN25V1R3LGdjVAPO8/s200/2289234.png" /></a><br /><br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoKa__6qdmpvz2Ce-zFToMAiXJldqN-G4yZ0NhP0xXHpYws2Cz4Dcq4k2galH-Wg_GDQTqsbIGAf1fOzILk1fw8M4aQOf9ghqie2pRogNDLPUF2iDDlcRCf70Nz_Bsct_11O4XNGKYLII/s1600/2375777.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoKa__6qdmpvz2Ce-zFToMAiXJldqN-G4yZ0NhP0xXHpYws2Cz4Dcq4k2galH-Wg_GDQTqsbIGAf1fOzILk1fw8M4aQOf9ghqie2pRogNDLPUF2iDDlcRCf70Nz_Bsct_11O4XNGKYLII/s200/2375777.png" /></a> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuP9jaV5ahfpAos1xxkoTEFlnKw_yufS5-jBiMayxKkQiRCNzPVgr8-5FkIphxlYVycxO3dnifCyh-MovnaB2PylyBpE6UOBRR24LjhqX0Z0Eh2K5gGo9K-9bla_0PQI5b_KiNdsmUS7M/s1600/2237379.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuP9jaV5ahfpAos1xxkoTEFlnKw_yufS5-jBiMayxKkQiRCNzPVgr8-5FkIphxlYVycxO3dnifCyh-MovnaB2PylyBpE6UOBRR24LjhqX0Z0Eh2K5gGo9K-9bla_0PQI5b_KiNdsmUS7M/s200/2237379.png" /></a></center>
<br />
<div style="text-align: justify;">
Comenten si les gustaron, si les parecieron espantosos, si quieren que publique más... no se, lo que tengan ganas jajaja Besos!
</div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com10tag:blogger.com,1999:blog-6175922248349265681.post-36840516212314026982014-03-02T13:46:00.001-03:002014-03-02T16:49:55.829-03:00Descarga: plantilla Mínima<div style="text-align: justify;">
</div>
<div style="text-align: justify;">
<div class="separator" style="clear: both; text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVqNITIBiPBgOMH_e2bc38QW0C-2CtHW22UR4jdij2Uyce_xg9HyhKVivl2HW_9pWDsVtZCT-Ki8EEufH2YZEBJYE9yLLKeMJ9BiXs0uo1jwgJ9r71wHZFmTgQJJJ-0SlsRwsNgS-obPg/s1600/Sin+t%C3%ADtulo-7.png" /></div>
<br />
¡Hola! Como les conté en <a href="http://notasinglesong.blogspot.com.ar/2014/02/al-fin-llego-el-nuevo-diseno.html"><b>esta</b></a>
entrada, proximamente estaré haciendo unos tutoriales para hacer sus
propias plantillas; hoy les dejo para que descarguen la plantilla Mínima
(que por otra parte, es la que utilizo ya que siempre lo preguntan) porque será más fácil, tanto para mí como para
ustedes, seguir estos tutoriales teniendo la misma base. De este modo,
nos ahorramos los problemas del tipo <i>"esto no sale en mi plantilla cuando lo busco"</i>, <i>"yo uso la plantilla X, ¿funciona igual?"</i><br />
<br />
<a name='more'></a><br />
<br />
Si piensan que van a seguir los tutoriales, les recomiendo descargarla. Pueden ir explorandola, la verdad es que a mi me encanta esta plantilla porque da muchisimas opciones de personalización. Si ya saben HTML pueden descargarla e ir probándola por su cuenta! Cualquier problema, no duden en preguntar :) Besos!<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://www.mediafire.com/?uia28dgxf7661q3"><img alt="https://www.mediafire.com/?x54m2fuekpnpssk" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiR7wF8tBuwVhl0AzBmpY9H8VneknSxXpVPMT-nFMlj-mgGEeHzx8Yi_vQ7n-5vpkJXxb48Q6SCu8E0E8045OnDA85m74hcNlL8Qux0DaUIT_faYyUS_Uw07Mv09h79w9FXCTp2lbne0S0/s1600/DESCARGA.png" /></a></div>
<div style="text-align: right;">
Créditos a <a href="http://ciudadblogger.com/2012/09/descargar-las-plantillas-de-diseno-de-blogger.html">CiudadBlogger</a> ya que de allí descargué la plantilla.</div>
</div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com4tag:blogger.com,1999:blog-6175922248349265681.post-48229796291955551222014-02-28T11:34:00.001-03:002014-02-28T11:36:13.764-03:00¿Quieres una plantilla 100% personalizada? ¡Juguemos!<div style="text-align: justify;">
¡Hola! Sus comentarios me ayudaron a pensar un poquito y al final me he decidido qué vamos a hacer. Como algunas personas me pidieron que ediciones y estas cosas por favor no, y la verdad yo tampoco tenía muchas ganas de hacerlo de esa forma, pensé en un juego para que de paso nos divirtamos un rato.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiU6SPY_BHvBpT-yBHYm_EFI5HhXfFJUKQSIYfW5oFQQbSiHpjUWXfPgY7qYt8slAL2z39_SXqCShJREs0tbFB1hgX1Ka0eJh-jP3e8b1C6amygDN7iZO4FT6bOJL4-RhEOxIzg_pArSqA/s1600/wonkagoldenticket.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiU6SPY_BHvBpT-yBHYm_EFI5HhXfFJUKQSIYfW5oFQQbSiHpjUWXfPgY7qYt8slAL2z39_SXqCShJREs0tbFB1hgX1Ka0eJh-jP3e8b1C6amygDN7iZO4FT6bOJL4-RhEOxIzg_pArSqA/s1600/wonkagoldenticket.png" /></a></div>
</div>
<div style="text-align: justify;">
<br />
<b>La idea es la siguiente. </b></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Jugaremos durante 2 semanas, en las cuales <u>3 veces a la semana</u> (martes, jueves y sábados) publicaré una entrada con una frase que puede ser de un libro, una peli o una serie y ustedes me tendrán que decir de dónde es la frase y eventualmente, quién dijo dicha frase.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Los que comenten <u>de forma correcta</u> (con esto no solo quiero decir que la frase efectivamente sea de la serie/libro/peli que dicen sino que este BIEN ESCRITA) debajo de la entrada el nombre del libro, serie o película, sumarán 2 puntos. Y si además me dicen quién dijo la frase, tendrán 4 puntos (en total, 2 por la peli y 2 por el personaje). <i>Los comentarios estarán ocultos para que no se anden copiando, ¡eh! Pícaros, seguro que ya lo estaban pensando jajaj.</i></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Cuando hayan pasado las 2 semanas y hayamos jugado con 6 frases diferentes, la/s persona/s que hayan sumado mayor puntaje, se llevarán la plantilla, <i>¿de acuerdo?</i> Será más de 1 ganador sólo en caso de que haya 2 o más personas con el <u>mimso puntaje</u>. </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
<b>Sin embargo, ¡atención!</b> Ya saben que no soy la persona con mayor cantidad de tiempo disponible en este mundo, y como no me quiero comprometer a hacer 40 plantillas diferentes sabiendo que no me va a dar el tiempo para hacerlas en menos de 2 semanas, si llegara a ocurrir que más de 2 personas tienen igual puntaje, iremos a una ronda de desempate. Y en tal caso, ganarán los puntos las 2 primeras personas que respondan de forma correcta.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Y bueno, último pero no menos importante. El único requisito para poder jugar es <b>TENER UN BLOG ACTIVO</b>, es decir, en el que publiques regularmente. Si no lo tienes, pero aún así tienes ganas de jugar <strike>porque estas aburrido</strike>, puedes hacerlo pero avisame cuando dejes el comentario, para que no te ande sumando los puntos.</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
No es necesario que se anoten. Pueden empezar a jugar cuando quieran, aunque obviamente, si juegan en la última frase... no esperen ganar. Pueden emepezar a la siguiente ronda ya que este juego se repetirá periodicamente siempre que disponga de tiempo :) Eventualmente, luego lo cambiaré por otro<i><b>!</b></i></div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
¿Quedó todo claro? Si les quedo alguna duda, es el momento de preguntar<i> right now!</i> Si les parece bien, podemos empezar a jugar la semana que viene! Besos :)<u></u></div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com9tag:blogger.com,1999:blog-6175922248349265681.post-25861264197641462842014-02-26T11:51:00.000-03:002014-02-26T11:51:01.218-03:00Proximamente... ¿concurso?<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggXEW91Jh-fsdylFLGjrMoMkKnWdtSOuLLk6pc0tJCQf_tmVAcd33bEiDVOBphHJHkHlrdwgT0aA19y7u8ZK9P73pKAo3liZKkLmDm9KnGb3SOz2D_vvBxf9aCmbKSrNy9GyCS3TZKABo/s1600/Sin+t%C3%ADtulo-1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggXEW91Jh-fsdylFLGjrMoMkKnWdtSOuLLk6pc0tJCQf_tmVAcd33bEiDVOBphHJHkHlrdwgT0aA19y7u8ZK9P73pKAo3liZKkLmDm9KnGb3SOz2D_vvBxf9aCmbKSrNy9GyCS3TZKABo/s1600/Sin+t%C3%ADtulo-1.png" height="240" width="400" /></a></div>
<br />
<div style="text-align: justify;">
Hola bellas! Y bellos, claro! Estaba yo pensando en que a menudo me piden que suba nuevas plantillas del estilo de <i>True Colours</i> o <i>Cute&Sweet</i> y sí, es cierto que pronto vendrán nuevas pero también estuve pensando en hacer una especie de concurso o sorteo para que uno (o quizás dos) de ustedes se lleven una plantilla personalizada 100% a su gusto, ¿qué les parece?</div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
Si les parece bien, tenemos un problema. Así que necesito de su ayuda. Lo dije hace unos días en Twitter pero nadie me respondió, snif :( Personalmente, pienso que sería más divertido un concurso o un juego a un sorteo, pero no se cómo o de qué hacerlo. ¿Me ayudan dandome ideas para ver cómo lo podemos hacer? Dejando un comentario con alguna ideita que se les ocurra, sería genial :) Si tienen ganas de hacer esto... claro. </div>
<div style="text-align: justify;">
<br /></div>
<div style="text-align: justify;">
En fin, en lo que queda de la semana subiré algun nuevo tutorial, así que atentos. Muchos besos!</div>
catalina ∞http://www.blogger.com/profile/05652783679969899620noreply@blogger.com6