Deseo que estés increíblemente genial. Me animo a molestarte con la intención de preguntarte algo, ¿cómo logras las transparencias en tus skin? ¿Y como las usas en las áreas de post? Uso tu skin gratuito por cierto que es bellísimo, pero vi que en uno de comisión que hiciste tienes estos efectos. He visto tutoriales y leído alguna asistencia, pero en ninguna entiendo y tu siempre tienes paciencia de santo.
Eres genial.
Holiis❤ Disculpa la tardanza en responder!
Muchas gracias por tus palabritas anon <3 Me hace muy feliz que te guste y estés disfrutando el skin!! :3
Con las transparencias es fácil! Solo en vez de usar colores hex, uso rgba con los que puedes jugar con la transparencia/opacidad.
Explicando la diferencia entre ambos sería algo así:
#8db2c6 Este sería un color azul pastel en hexadecimal, con opacidad 1, es decir no tiene ningun tipo de transparencias, es el color totalmente sólido.
rgba(141,178,198) Este sería el mismo color azul pastel pero en rgba sin modificar nada de la opacidad, por lo que sería totalmente sólido.
Y ahora utilizando la maravilla que es el rgba, se puede colocar al 50% de opacidad/transparencia colocando solo un 0.5 al final, quedando algo así: rgba(141,178,198,0.5)
Ese 0.5, puede tener valores desde 0 hasta 1, siendo el 0 totalmente transparente, y 1 el color sólido.
Yo utilizo los colores hex para todo, porque son mucho más cómodos, y solo uso los rbga especificamente cuando quiero una transparencia. Pero sin problema se podrían usar todos los colores expresados en rgba teniendo en cuenta lo de la opacidad.
Para que puedas ver un ejemplo de como se vería usándolo en un code como tal, puedes ver este baúl que hice hace un tiempito, donde hay una de las variables que es rgba (--bulcolor1rgb: rgb(0,0,0,0.7);) y es la que le da una transparencia del 70% a todo el code.
Y para nada es molestia, siempre que pueda ayudar por aquí ando❤Cualquier cosa que no hayas entendido mi explicación o necesites ayudita, mándame otro ask o un mensaje privado :3
¡Holis a todos!❤
Vengo por aquí para traer un mini-tutorial para cambiar el tamaño del avatar en mi skin gratis “Gentle Sea”, esto debido a que me han llegado mensajitos por discord y por ask pidiéndome que les explique como hacerlo, y al ser un skin de uso libre prefiero hacerlo por aquí para que pueda llegar a todo aquel que lo use y quiera personalizarlo un poquito más :3
NOTAS ANTES DE EMPEZAR:
☪ Colocaré aquí la respuesta del ask para cambiar el avatar de tamaño (haciéndolo más largo) para que esté todo en un mismo post.
☪ El skin estará dividido en dos partes: La primera para modificar el alto y la segunda para modificar el ancho, así si quieren hacer una cosa o la otra esta separado - Y si quieren hacer los dos solo hay que combinarlos :3 -
☪ Los cambios se hicieron para pasar de 200px a 250px y de 300px a 450px, pero igual intenté poner más o menos los porcentajes que se usaron para cambiar de tamaño y facilmente se puede utilizar para hacer otros tamaños.
☪ Es el primer tuto que subo, así que avisénme por ask si hay algo que no se entienda - para poder compartirlo con todos :3 -
¡Ahora si empezamos!
PARTE 1: Modficación del largo del avatar.
☪ Largo de avatar en temas:
Inicialmente la cajita del avatar en los temas se adapta automáticamente al largo que tenga la imagen, pero eso no pasa con la caja que contiene los campos, por lo que tenemos que ir al CSS a ajustarlo (si lo copiaste tal cual del que está en el pastebin debería ser la línea 1057), y ahí tendras esto:
Ahora lo que queremos cambiar ahí es el height, que pasará de 290px a 440px (10px menos que el tamaño del avatar para quede bonito y centrado), y eso en teoría sería todo, si recomiendo que coloquen más campos ahí para que no se vea vacío - creo que podrían entrar 2 campos más. ¡Y eso sería todo con el avatar en los temas!
☪ Largo de avatar en perfil de usuario:
En el avatar del perfil de usuario si hay que modificar más cositas, porque está diseñado para ser una caja completa - para que quede todo centrado -. Ahora vamos a la línea 1148, donde tenemos esto:
Y cambiamos nuevamente el height, de 350px a 500px (50px más al tamaño del avatar), ahora vamos por el contenedor de los campos en la línea 1183:
.gsperfilcont2 {
width: 680px;
height: 370px;
}
Donde cambiaremos el height de 370px a 520px (70px más al tamaño del avatar), vamos luego a la línea 1212, donde pasamos el height de 250px a 400px (50px menos al tamaño del avatar)
¡Y eso sería todo! Nuevamente recomiendo colocar más campos para que se vea bonito *-*, como esta última cajita tiene overflow, aparecerá la barrita si hay más campos.
PARTE 2: Modficación del ancho del avatar.
☪ Ancho de avatar en temas:
Lo importante aquí son dos cosas, se tienen dos maneras de ampliar el ancho, la primera y más complicada es extender el tamaño del wrap y comenzar a ajustar cada una de las páginas - lo que haría una modificación casi que del skin completo - y la segunda opción que es mucho más fácil pero disminuye el espacio que tenemos para escribir.
La que explicaré en este caso es la segunda por que es mucho más fácil de explicar y las modificaciones son muy pocas - solo que con el width y no el height -, vamos a eso entonces:
NOTA: No recomiendo que el ancho del avatar sea mayor a 250px si no se va a modificar el tamaño del skin, y para eso si se debería tener un poco más de experiencia con el CSS.
Igual como explique más arriba la cajita del avatar en los temas se adapta automáticamente al ancho que tenga la imagen, pero eso no pasa con todas las demás cajitas que lo contienen. Así que vamos primero a la línea 1009, y tendremos esto:
Ahí cambiaremos el width de 230px a 270px (20px más que el tamaño que queremos del avatar - pero como dije cada vez que se aumente el ancho estamos perdiendo espacio para escribir), además debemos cambiar el margin: 0 auto; por margin: 0 -10px; para que podamos tener un poquiito más de espacio.
Ahora vamos por la caja deonde está el nombre y el grupo, en la línea 1015, tenemos:
Ahí cambiaremos el height: 190px a 240px (10px menos que el tamaño del avatar para quede bonito y centrado). Aquí si vamos a tener que modificar el tamaño de los campos, así que vamos a la línea 1078:
Crearemos una línea nueva y pondremos width: 72%; ¡Y listo!
☪ Ancho de avatar en perfil de usuario:
En la línea 1148px, cambiaremos el width de 950px a 940px - esto para que ambas cajitas queden más juntas y alineadas con el título.
Así que modificaremos el width 200px a 250px. La zona que está por debajo también va a cambiar por lo que en la línea 1172, cambiaremos también el width de 200px a 250px.
Por último, en la línea 1183, cambiaremos el width de 680px a 650px.
.gsperfilcont2 {
width: 680px;
height: 370px;
}
¡Y ahora si hemos terminado! Disculpen que haya sido tan largo, pero espero se entienda, y como dije arriba cualquier duda estoy a un ask de distancia :3
Holi ♥ Vengo con un par de dudas con respecto al skin Gentle Sea. Entré con la cuenta de invitado porque estaba curioseando como se veía la zona de mps y todo eso, fue entonces que me percaté que la opción de "ver tus mensajes" no aparece. ¿Cómo se podría habilitar? Y luego otra duda sería, si en el navbar solo quiero que aparezcan los iconos sin las letras ¿como lo editaría? Perdón por tan poco, soy bastante torpe y no quiero destrozar nada jajajaja ¡Saludos, y gracias por tu trabajo! ♥
¡Holis!❤ Para que aparezca la opción de “ver tus mensajes” - yo siempre lo quito por que no lo uso xd - vas a ir al CSS (si lo copias tal cual del que está en el pastebin debería ser la línea 178), y ahí vas a tener esto:
Ahí vas a agregar: font-size: 0px; ¡y listo! Si quieres ajustar el tamaño de los iconos, más abajito te van a salir las propiedades de cada uno, ahi puedes modicar el font-size: 10px; por el tamaño que quieras :3
¡Saludos, y muchas gracias a ti por usar mi skin!❤
Buenos días/tardes/noches, me disculpo por el submit pero no me entraba todo en un ask e ignoro si hay una forma más óptima de mandar el mensaje porque no acostumbro a usar Tumblr </3
Vengo a decir que me enamoré a primera vista de tu skin Gentle Sea y la forma sencilla pero efectiva en que has dejado todo explicadísimo en simples pasos que hasta alguien con cero conocimientos de CSS y Java (como yo) puede seguir sin problemas. Voy a intentar usarla para un proyecto que tengo en mente :3 y venía aquí porque quería hacer dos preguntitas (aparte de agradecerte de todo corazón por tu maravilloso trabajo, claro).
Primero, quería saber si podría toquetear un poco las tablillas del foro para crear, además de las administrativas, una ficha, tablilla para posts, cronologías y demás. Por supuesto, esto estaría aclarado en el apartado de créditos del foro, junto con los créditos del skin <3
Mi otra pregunta es si existe alguna forma de hacer que las descripciones de los foros tuvieran solo la imagen (es decir, quitarle los links y/o el texto) únicamente en algunos de los subforos.
Por ejemplo en los subforos de la zona on-rol, ya que me gustaría que tuvieran solo una imagen, pero creo que si intento modificar los valores en el CSS cambiaría el de todos los foros y no solo los de esa categoría (y quisiera seguir manteniendo los links en los apartados administrativos para acceso rápido a la normativa y demás).
Lamento las molestias que pueda haber causado, y una vez más gracias de corazón por el skin, que es precioso <3
---
Holiis!❤ Aaainss de verdad muchisimas muchisimas gracias por usar mi skin, me alegra mucho que te guste y que mi explicación sea lo suficientemente buena para que todo se entienda :3
Con lo de las tablillas, ¡por supuesto que puedes! No hay ningún problema, editálas a tu gusto para que queden acorde a lo que quieres armar en tu forito :3
Si, exacto, es mejor en esos casos no tocar el CSS porque se cambiaría toodo, por eso es mejor ir directamente con el HTML, es decir, la descripción de cada uno de los subforos.
Para hacerlo debes quitar los divs en las descripciones que se llaman ".gsconttext" y ".gscontlink" junto con todo en su interior, con eso quitarías las cajitas que engloban el texto y los links, y solo colocarías esto:
Disculpa que tengo que colocarlo en imagen pero mi tumblr no me deja copiar codes y no sé porqué :c
Eso lo que hace es editar la cajita de la imagen para hacerla más grande y que ocupe todo el tamaño del subforo, por lo que la descripción de esos subforos debería quedarte algo así:
Y con eso debería quedar todo en orden!
Cualquier cosita o que no quede como gustas solo avísame por ask o por priv, y te ayudo a resolverlo :3
No te preocupes no hay problema, yo súper feliz de poder ayudar❤
Muchisimas gracias de nuevo por usar mi skin <3
¡Hola, hola! Reenvio el mismo ask porque tontamente primero lo mandé a El almacén, lo siento ^^' Me encantan tus tablitas y estoy por usar la #17 "Catch You, Catch Me", pero me preguntaba si en vez de los íconos de la parte inferior izquierda, sería posible que pusiera otra imagen, de ser así, ¿qué es lo que tengo que cambiar para hacerlo? De antemano muchas gracias y entenderé si no es posible c:
Hooliss anon!❤ Me alegra mucho que te gusten mis tablillas :3
Para quitar los iconos debes editar directamente el style, porque esa tablilla tiene el css alojado en DropBox, te digo como hacerlo...
Vas a buscar la zona del code donde sale esto:
Y vas a modificarlo por esto, no coloco el code como tal, porque Tumblr no me deja copiar eso :c
Si quisieras quitar también el cuadrito que está debajo de la frase y colocarle una imagen sería algo similar, solo que buscarías ahora el div que se llama "Kei7" y colocarías esto:
Y así estaría listo!! :3
Cualquier duda o si a lo mejor mi explicación es medio enredada xd, puedes enviarme otro ask sin problemas!
Hola lindura, ¿cómo estás? Solo quería avisarte que me gustaría saber el precio de un pack de tablillas, por favor. ¿En dónde puedo ver el precio de tus comisiones?
¡Hooolis!❤️ Hay un botoncito en la navbar de mi theme que te lleva a ellas, igual este es el link: Comisiones MystiqueWorkshop :3
Bella Mystique, quiero decirte que me he hecho todos los tutoriales que subiste sobre tu skin gratuita y el resultado ha sido satisfactorio porque no tengo idea de cómo hacerlos ni montarlos, pero es que leerte me fue tan sencillo XD. Me encanta el perfil del skin, pero quiero saber si existe una forma sencilla de colocarle en el perfil del mensaje alguna pequeña imagen. Mil gracias por existir <3
Hoolis❤️ Awww me alegra mucho que mis explicaciones sean lo suficientemente buenas para que pudieras armar tu forito y personalizar un poco más el skin <3
Con lo de la imagen de perfil…ps fácil fácil no se me ocurre una forma :c Obligatoriamente se tiene que usar algo de JS y modificación de templates. Y aumentaría la dificultad dependiendo de la zona en la que se quiera.
Pero creo que no todo está perdido!😅 Voy a intentar armar un tutorial lo más explicado posible para colocar una imagen pequeña que quede en el header de los temas, creo que ahí es la zona más fácil en donde puedo colocar la imagen para que se vea bien y no sea tan difícil de explicar!! Espero que a finales de la semana que viene pueda traerte el tuto! :3
Bonita Mystique, primero decirte que me encantan tus codes y soy fan de tu trabajo tanto así que, estoy usando los oacks de Powerpuff Girls y Black Swan y me topé con algo... No tienen scroll relaciones y cronología y seria bastante practico que los tuvieran.
Me encantaría preguntarte cómo se colocan, de sobra decir que no tengo mucha idea de codes porque no quiero hacerte lidiar xD.
Te envío un fuerte saludo y abrazo esperando estés super bien <3
Hooolis!❤ Muchísimas gracias por tus palabras, me alegra mucho que te gusten y que las disfrutes :3
Ahora con las tablillas, inicialmente las pensé para que estuvieran sin scroll jejej, iba a explicar poco a poco como hacerlas, pero después me fije que habian zonas que iban a quedar muy juntas y necesitaba editar unas cositas más y me iba a hacer un lío explicando (?), así que las arreglé y aquí están las nuevas versiones:
- Relaciones Black Swan
- Cronología Black Swan
- Relaciones PPG "Bubbles"
Espero las disfrutes! Y muchas gracias❤
