Se trata de una serie de páginas que hemos englobado dentro de otra a modo de índice y que hemos denominado Herramientas Online. Actualmente podéis ver el enlace en la parte de abajo a la izquierda del blog.
De momento no hay muchas, pero a medida que vaya visitando los sitios que normalmente utilizo, no dudéis que allí irán a parar. Para mí será una buena chuleta y espero que para vosotros también lo sea.
Hay un par de enlaces que van a otras tantas utilidades marca de la casa y hechas en JavaScript en parte por necesidad y en parte por divertimento, pero pensé que con unos pocos ajustes de estilo quizás servirían para otros y ahí están.
Si se me ocurre hacer algunas más las iré incorporando en el mismo apartado, pero de momento son sólo dos...
HTML a texto plano
Esta es una de las cosas que más echaba de menos.
Publicar código tiene la complicación de que si lo pegas tal cual en cualquier entrada, el navegador interpreta las etiquetas HTML y no se visualiza nada. Al contrario, incluso puede desbarajustar todo el aspecto del blog dependiendo del código que sea.
Es casi lo mismo que ocurre cuando en un comentario queréis explicar qué hicistéis con vuestro blog, pegando en el casillero el código HTML que usasteis. La diferencia es que en este último caso lo que ocurre es que el código desaparece del comentario. Medidas de seguridad de Blogger... supongo.
Pero la solución es bastante sencilla, ya que es suficiente con eliminar los símbolos < y > y el navegador lo interpreta como texto normal. Pero claro, esto a veces lleva a confusión, así que casi mejor sustituimos esos símbolos por entidades que imprimen esos caracteres pero que no son realmente ellos. Sólo es para que se vean.
En el caso de los dos mencionados, las entidades correspondientes son < y >, así que el script lo único que hace es sustituir los símbolos por las entidades. Se pega allí, se convierte, se copia la traducción dónde corresponda y asunto resuelto.
Algunas veces lo que estorban son las comillas, así que hay un segundo casillero para realizar esta tarea. Si se quieren simultanear ambas sólo hay que pasar por uno y después por el otro.
Espero que a partir de ahora ya no tengáis problemas. Cuando queráis pegar código en un comentario sólo tenéis que pasar primero por el conversor y listo.
Colores RGB a Hexadecimal y viceversa
Este conversor es quizás menos necesario, pero alguna vez también me hubiera venido bien tener uno a mano.
Lo que hace este conversor es simplemente transformar los códigos de colores hexadecimales (por ejemplo #ff00ff) a sus equivalentes en formato RGB (255,0,255).
Aquí no hay ningún secreto para los que controlen un poco los sistemas de numeración. El script lo único que hace es separar de dos en dos los números hexadecimales (ff-00-ff) y pasarlos a sus homólogos en base decimal (255-0-255).
También hace el camino contrario permitiéndonos conocer el código hexadecimal de un color en formato RGB y adicionalmente muestra el color tecleado ¿A qué es muy mono?
Lo más habitual es usar sólo hexadecimal para los colores, pero en alguna ocasión nos viene bien aplicar transparencia y ahí lo más fácil es usar RGB. La propiedad sería algo así:
color: rgba(255,125,0,.5);
Los tres primeros valores representan respectivamente la proporción de rojo, verde y azul en el resultado final, siendo 0 ninguno y 255 el valor máximo (#FF).
Y el cuarto parámetro es el interesante, pues es el que indica el nivel de transparencia. Puede tomar cualquier valor entre 0 y 1 ambos inclusive, siendo 0 totalmente transparente y 1 totalmente opaco. En el ejemplo figura un .5 o lo que es lo mismo, trasparencia al 50%.
¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.
Y muchos más artículos interesantes si nos sigues en...
Muy buena la entrada Oloman lo tendré muy en cuenta.
ResponderEliminarSaludos
Genial :) nada como un poco de Javascript para hacer las cosas más fáciles para los demás.
ResponderEliminarUn detalle en el primero (para escapar también las &): Antes de
ht=ht.replace(/</g,'<')
pon
ht = ht.replace(/&/g, '&');
Porque si no hay muchos caracteres que no se convertirán ;)
Perdón, cambia '&' por '&'
EliminarPensé incluir la sustitución de &, pero al final lo descarté porque por lo general no hace falta. Lo mismo me pasó con las comillas pero ahí decidí hacerlo de manera adicional para quién quisiera ¿en qué tipo de caracteres estás pensando cuando dices que "no se convertirán"?
EliminarMe refiero a que si tú quieres poner literalmente la entidad (&) (o cualquier otra), no la convertirás y quedará su representación gráfica. Por ejemplo. Si tú quieres poner la frase:
EliminarPara poner el símbolo < en un comentario tienes que escribir <
Saldría:
Para poner el símbolo < en un comentario tienes que escribir <
(es un ejemplo muy tonto, seguro que hay mejores, pero vale ;) )
Vale, ahora entiendo. La verdad es que a nosotros sí que nos da la lata eso, pero cómo a la mayoría de gente no pues tampoco quise complicar la cosa. Me vale con que sirva para que puedan pegar código en los comentarios, aunque quizás incorpore un día que tenga un rato eso que dices. Gracias por la observación.
EliminarHoy tuve la necesidad y finalmente he decidido incorporarlo aunque sólo me sirva a mí ;)
EliminarHola de nuevo Oloman.
ResponderEliminarMi pregunta no tiene que ver con este post pero si con uno que publicaste hace poco tiempo.
Mira, hace unos dias coloque en mi blog el efecto banda en los gadgets de la sidebar. Tras mucho tocar los valores que tu tenias en el codigo, pude adaptarlo para que se viera en mi blog. El tema es que me gustaria que el ancho de la banda ocupara simplemente el ancho del gadget y no el de toda la columna lateral. He variado todos los valores y consigo darle el ancho del gadget pero no consigo que los triangulos que hacen el efecto banda aparezcan de ninguna de las maneras.
A ver si me pudieras echar una mano.
Muchas gracias.
Un abrazo.
Pero... si le das el ancho del gadget quedará raro. Necesitarías añadirle un borde interior que ahora no tienes para que simulara salir desde ahí o mejor dicho, que los extremos se pliegan hacia atrás de algo ¿no?
EliminarQuizás no te entendí bien lo que quieres. Si es ese el caso mejor haces una captura y "dibujas" en ella lo que quieres.
No te preocupes Oloman, ya lo he resuelto. Como tu bien dices, le he añadido ese borde interior del que hablas pero ahora si al gadget en si. Antes lo tenia a lo que era el ancho de la columna lateral y se veia una banda demasiado grande.
ResponderEliminarAsi es como me ha quedado:
https://dl.dropbox.com/u/15277672/BANDA%20PLEGADA.jpg
Muchas gracias por tu atencion amigo.
Un abrazo.
Ah, perfecto. Ya lo vi pero pensaba que todavía querías "enmarcar" más. Por eso te decía que no quedaría bien :)
EliminarNo hay de qué...
Ola:
ResponderEliminarMe han dicho en el blog Ciudad blogger que viniera a este blog a preguntar mi duda aber si tu me puedes ayudar:
Mira en mi blog tengo una seccion donde tengo una tabla de google docs la seccion es esta:
http://tuttostriker.blogspot.com/p/merkastriker.html
Y lo que queria saber es como crear un filtro de busqueda para cada columna o un buscador para la tabla.
Muchas gracias
Hola. No soy especialista siquiera en lo que escribo, pero aquí encontré una ayuda sobre lo que preguntas: Cómo filtrar los datos en Google Docs
EliminarA ver si te sirve.
Ola perdona que te moleste de nuevo
EliminarPero e mirado lo que me dijiste y yo lo que quiero es como un buscador o filtro que la gente en la pagina del blog busque por ejemplo los jugadores que empiezen por Ma y le aparezan todos no se si me explico bien
Gracias
Perfectamente, pero no sé cómo hacerlo, por eso te remití a esa entrada que indicaba cómo filtrar datos. Supongo que la dificultad está en que ese filtrado se pueda hacer desde el blog. Eso es seguro lo más difícil... para mí al menos.
EliminarMe gustaría presentarles una herraminta para convertir colores que acabo de publicar.
ResponderEliminarPermite convertir un color RGB / Hexadecimal / HSL, o HSB y también descargar esquemas de color pregenerados sencillos en JSON.
Pueden verla en http://rgb.to
Un saludo:
CC
OK. Suelo borrar los enlaces "propagandísticos", pero dejaré el tuyo porque me parece útil ;)
Eliminar