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
Me encanta tu skin Gentle Sea, y amo la sencillez del avatar, pero mi pregunta es si se puede cambiar el tamaño del avatar a 200x450 y como hacerlo.
Te mando un abrazo eres genial
¡Holiis! Awwww muchas gracias por tus palabras, me alegra muchísimo que te guste el skin❤ Si se puede cambiar, pero es un poco complicado, intentaré explicarlo por partecitas porque hay varias clases que se deben modificar.
Primero tenemos que cambiar dos zonas - el avatar que sale en los temas y el que sale en el perfil de usuario - así que voy con la primera:
!! Probablemente esta respuesta me salga muy larga
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í deberías tener 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 te recomiendo que coloques 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!
El avatar en el 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 te recomiendo colocar más campos para que se vea bonito *-*, como esta última cajita tiene overflow, aparecerá la barrita si hay más campos.
Lo siento que este "mini-tuto" haya quedado tan largo, pero espero se entienda y te funcione, cualquier cosita por aquí ando❤
Holiiiii, estoy utilizando tu skin Gentle Sea y me preguntaba como poner las opciones de mensajes y post hechos por el personaje dentro del perfil simple, el de /u1. ¡Gracias!
¡Holis!❤ Para agregar esos links al perfil tenemos que meternos con el template, y volver a colocar las etiquetas que usa foroactivo para buscar esos links.
Ahora el template del perfil lo vas a buscar en Panel de Administración » Visualización » Plantillas » Perfil » profile_view_body, y vas a buscar la línea donde dice:
<!-- BEGIN profile_field -->
Justo debajo de eso vas a pegar lo que está en este pastebin (no lo pongo directo acá por las comillas que tumblr cambia), luego registras, publicas los cambios ¡y listo! :3
