#forumactif skin

[rossresources]

Arcane: New Skin

forumeiros - foroactivo - forumactif

[EN] New skin, Harry Potter themed. My favourite part is the background with animated stars, which is better seen in the forum header. Besides that, the skin has a minimalist and darker style, easy to read and adaptable for different resolutions. Thank you to the Arcane admins, who contacted me to make the skin for their new forum and they were always so lovely with me, it was a pleasure to work with them! 💜

[PT] Nova skin, no tema de Harry Potter. A minha parte favorita é o fundo com estrelas animadas, que se vê melhor no banner. De resto, a skin segue um estilo mais minimalista e escuro, fácil de ler e adaptável a diferentes resoluções. Obrigada às admins do Arcane, que me contactaram para fazer a skin para o novo fórum e que foram sempre muito amáveis comigo, foi um prazer trabalhar com elas! 💜

Visitem o fórum no seguinte link: https://arcane.forumeiros.com/

[mikazuki-commandes]

SKIN Viewpoint + Profil JDR

Petite expérimentation inspirée de D&D, je cherchais à voir de quelle façon je pouvais mettre dans le profil des dons et les statistiques de joueurs de manière épurée et lisible !

[anita-codes]

Skin simple — Stardust (gratuita)

Feliz año nuevo 2024!!!! ✨✨✨ Sinceramente espero que todos hayan disfrutado de un buen cierre de año, en compañía de sus seres queridos y se hayan hartado hasta el cansancio todas las galletas y ponche de la mesa. Que este nuevo año nos traiga a todos abundancia de bendiciones, salud y gratas sorpresas a nuestras vidas.

Tras tomarme un tiempo de inactividad en este bonito espacio, principalmente motivado por el cuidado de mi salud mental y una carga excesiva de responsabilidades en mi vida cotidiana, estoy decidida a volver a enfocar mi energía y entusiasmo en los proyectos que una vez inicié con gran ilusión. Por esta razón, una de mis metas para este año es volver a retomar y culminar dichos proyectos postergados.

Gracias a todos aquellos que me brindaron su apoyo y comprensión durante este receso, y a los que me siguen y comparten mi trabajo.

Y pues, nada, impulsada por las fechas festivas (y una reciente adicción a vocaloid) se me ocurrió romper el hielo con una skin sencilla ( phpbb3 ) que pueden usar de base para sus propias skins.

Preview en vivo: https://star-dust.foroactivo.com/

❥ Características

Navbar personalizado: Avatar de la cuenta + Bienvenida, frase + Navegación.

Tablón de anuncios: Imagen decorativa + Frase 1 + Caja de texto + Staff + Frase decorativa 2 + Últimos temas + Links rápidos.

Categorías y descripción de subforos.

Estadísticas, afiliados en el footer.

Listado de temas, perfil en los temas.

Paginado de búsquedas (mensajes y temas).

Mensajería privada.

Perfil simple (/u1).

❥ Instalación

Tutorial y Códigos: https://star-dust.foroactivo.com/f1-instalacion-y-codigos

Cuenta para invitados: Elliot S. Wrigty | Contraseña: skinstardust2024

[jawnressources]

— second skin complet bientôt en vente ~

[entourage-themes]

KALEIDOSCOPE SKIN ✦ (1/5)

EN ✦ Kaleidoscope: A dark skin with all of the essentials included. Some of its special features include: Full profile page for your RPG character (/u1), templates, forum variations, and more. Please, read the detailed list of features on this link: ◊ 📌 Detailed features list, screenshots and pricing.

[moracodes]

Days Gone - Rework

En los últimos días, he tenido el placer de ser contactado por el staff de Days Gone para proporcionar apoyo a algunos errores que su foro estaba tratando debido a su skin. Después de muchas discusiones, decidimos rehacer completamente el skin y crear una nueva basado en el anterior (tened en cuenta que intentamos contactar con la diseñadora original pero no lo conseguimos, pero sus créditos permanecen intactos).

Aquí tenéis un vídeo del resultado final de la skin. Hay algo que me gusta mucho y que lamentablemente no pude mostrarte: Un botón que activa una versión responsive para los usuarios de móviles que prefieran aprovechar esta comodidad.

Me gustaría agradecer al staff su afecto y confianza: @decayinggracerpg sois todos tan dulces

[code-lab]

WHAT REMAINS

Si contente de pouvoir vous présenter mon dernier travail sur What Remains !

@frenchandfurious m'a fait confiance une nouvelle fois de plus et cette fois pour réaliser le code ET le design.

Ca a été un sacré projet pour moi, dans lequel j'affirme vraiment mon style (oui parce que jusqu'à maintenant j'étais persuadée de ne pas en avoir mdr). J'ai pris énormément de risque en choix de design tout en gardant une structure relativement... commune. C'était assez étrange de naviguer entre ces deux lignes.

Le forum utilise le Blank Theme (obvs) et vous retrouvez tout les crédits détaillés dans ce post.

Conception et réalisation

J'ai essayé de documenter le plus d'étape de la conception donc je vais faire plusieurs poste pour parler de mes inspirations et de mes réflexions.

C'est notamment passé par une énorme phase de maquettage :

(ne vous fiez pas à la quantité, c'est plus le bordel d'autre chose)

Et surtout d'essayer de tenir une vrai charte graphique pour faire quelque chose d'un peu cohérant. Bon, c'est loin d'être parfait mais c'est des étapes que j'aime bien prendre le temps de faire. Ca me permet de continuer à bidouiller même quand je suis pas inspirée, ranger mes idées.

Voilà, voilà ! je risque de beaucoup poster dessus ces prochains jours (déso d'avance pour le spam)

[kaecodes]

HI, so long time no talk! I haven't gone anywhere, I just had some personal financial troubles that were resolved via...lots of overtime! I am a physicist by day, so that meant I became one by night for a couple months. But I remained coding, designing, & sketching things in my scant moments.

More importantly, I've been doing a lot of reading & observing of the Jcink RPC & I am really gutted by the lack of free resources I've seen become manifest. As a result, I've been percolating some easy design methods I could use to fast track totally free skins to give out as bi-monthly as I can manage in the near future.

Because I'm not one to stick to an aesthetic or design style so much as following a settled philosophy of coding, each of my skins will be entirely unique (no reused assets besides utility scripts, perhaps fonts, etc) but will all be;

Designed to be entirely responsive, with fallback & default setups for Custom Fields, image appearance or omission, etc.

Designed to load in a second & half or under, universally.

Neatened to be readable, cascade-organized, & fully notated with CSS & HTML notes to explain important components, how they work, & how to edit them.

Provided with a dark, light, & middle theme colour option as well as High Contrast option.

Provided with Staff, Member & Character profile & miniprofiles.

Provided with a full Custom BBCode suite of site templates to match the skin.

Based on the UI/UX design of a game with striking visuals that can be used for similar genres.

Now, this is a tall order, but I really want to flex my muscle & try to give folks something to be optimistic over in a landscape of drama-blog wastelanded distress. I want to put out something productive & positive, to make the community better & bring us together a bit <3 As a result, I'm going to need a little help from you all. I need to figure out which "Inspos" to work off of first based on desire for them, to fill the starving niches from most important to "least" so to speak. For the next few weeks, I'll post some polls & would be endlessly grateful if you all paid it forward by boosting but also voting on the games whose vibes you want to see MOST PRESSINGLY manifested as skins in the Jcink RPC.

I will, also, eventually port each one to Forumactivo, so for my Forumactivo folks, please let me know when you get specific polls so I can prioritize converting those skins for you! You deserve just as much love!

Of course, if there's a specific game you want to see feel free to comment on this post & I'll make sure to put it in the first poll, but for now that's all. The first list of inspo options will come out later today or tomorrow, Stay tuned & stay awesome, may the Dance keep you all absolutely blessed!

[ohdaylight]

Can you keep a secret ? no ? me neither.

Un petit kit d'avatars & header créé pour le projet @oneliferpg (allez le suivre s'il vous plaît ! j'ai tellement hâte qu'il ouvre). Je suis partie sur des tons printaniers mais relativement froid pour ce thème et j'aime beaucoup le côté "Lavender Haze".

[missrichardson-rp]

[akeidoverse]

Naruto RPG Akatsuki

Aproximadamente um ano atrás, eu tive a oportunidade de colaborar na criação de um layout inovador e dinâmico para o fórum "Naruto RPG Akatsuki", um projeto apaixonante que combinou minha expertise com a do talentoso Igor Gonçalves. No coração deste projeto estava o desafio de capturar a essência vibrante e aventureira do universo Naruto, um desafio que abraçamos com entusiasmo.

Igor Gonçalves, um profissional criativo e dotado de uma sensibilidade artística única, assumiu a liderança no aspecto visual do projeto. Ele foi a força motriz por trás da seleção e integração de imagens e vídeos impactantes, criando uma experiência visual imersiva que refletia perfeitamente o espírito do anime Naruto. Seu trabalho pode ser explorado mais a fundo através de seu portfólio online: Link do Portfólio de Igor Gonçalves.

Minha contribuição foi no desenvolvimento da infraestrutura funcional do fórum. Isso incluiu a meticulosa criação de templates e a implementação de códigos que assegurassem uma navegação fluída e intuitiva, permitindo aos usuários uma interação sem esforço e agradável com o conteúdo. Para um vislumbre mais aprofundado do meu trabalho, convido-o a visitar: Link do Portfólio de Akeido. Além disso, o fórum Naruto RPG Akatsuki não é uma entidade estática; ele respira e evolui constantemente.

Regularmente, o fórum se transforma para celebrar eventos especiais, adotando layouts temáticos que enriquecem ainda mais a experiência dos usuários. Essas mudanças são um testemunho do nosso compromisso em manter o fórum dinâmico, envolvente e sempre alinhado com o espírito vibrante do mundo de Naruto. Para experimentar de primeira mão este trabalho de arte digital em constante evolução, visite o fórum pelo seguinte link: Naruto RPG Akatsuki. Lá, você terá a chance de mergulhar em um mundo onde a arte visual e a funcionalidade se unem para criar uma experiência única de fórum online.

Responsáveis pelo design:

Igor Gonçalves - https://linktr.ee/igorgoncalvesds

Akeido - https://linktr.ee/akeido

[apolocodes]

Hacer un skin solo con CSS parte 5

¿Ha llegado finalmente un nuevo tutorial?

Así es mis queridos olimpicos es momento de continuar haciendo un skin con solo CSS. ¿El tema de hoy? LAS CATEGORÍAS.

Retomando la línea de mis tutoriales anteriores hoy les traigo las categorías, a esta sección la dividiré en dos contenidos: 1. Cómo crear categorías y sus opciones. 2. Editar con css la zona.

¿Tienes ya tu café, té, chocolate o cerveza? Entonces empecemos.

#1 ¿Cómo crear categorías y qué opciones tiene?

• Panel de Administración - General - Categorías y foros

Aquí en el mismo renglón del título del foro encontrarán un + en verde. ¿Lo ven? Está medio escondido así que no se preocupen si no lo localizan a la primera. Una vez lo tengas podrás crear una categoría y señalar si quieres un foro.

¿Cuál es la diferencia entre categoría y foro?

La categoría ordena y agrupa los foros. Es el enorme título que suelen llevar arriba. En cambio los foros son los sitios destinados a crear temas y los que permiten la interacción con el usuario.

Una vez has elegido entre foro y categoría crearemos una categoría con foro.

Tenemos las opciones de poner una imagen, una descripción o ambos. Nosotros haremos las tres cosas así pueden aprender.

• Foro con imagen: En este caso yo elegiré un tamaño de 465x120px peeeroo... pueden elegir lo que quieran, les recomiendo que no sea más ancha que el wrap ni demasiado larga porque podría ser demasiado pesado para el foro y además podría quedar muy mal si se sale, lo pueden poner en la descripción o en la dirección de la imagen en este caso lo pondré en la primera.

• Foro con texto: Les recomiendo poner en inicio uno largo para que no tengan imprevistos. En esta parte Sí les diría que añadan un simple html que quede así:

• Foro con texto e imagen: Podemos ponerlo todo en la descripción ó poner la imagen en Dirección de la imagen y en descripción añadir

Para la explicación con hover:

ó para la explicación sin hover

.Recomiendo la segunda opción si quieres que el texto quede fijo o la primera si deseas ponerle un hover.

#2 Editar todo con css

Con esta base comenzaremos a codear el css. 1) ul.topiclist.forums : Esta zona abarca la totalidad de los foros en esa categoría. Aquí definiré un color, un borde abajo que marque el final, un borde que redondee la parte de abajo y cuanto espacio (margen) habrá entre categorías:

ul.topiclist.forums{    background: var(--oscuro);    border-bottom: 2px solid var(--acento1);    margin-bottom: 10px;    border-radius: 0px 0px 12px 12px; }

2) li.row : Esto abarca cada una de los subforos individuales, en este caso le pondremos un fondo, un borde abajo, y un margen, pero pueden probar lo que gusten.

li.row { border-bottom: 3px dotted var(--acento2);    margin: 5px;    background: var(--fondo); }

3) dd.dterm : Honestamente muchas veces en los skins me he salteado adrede esta zona, en otros no, el código de esta parte aplica a la zona del título de la categoría, el icono del costado y la descripción del foro, en esta oportunidad para mostrarles le pondré algunas cosas como un ancho y un padding.

dd.dterm { padding: 5px;    width: 62%!important; }

4) a.forumtitle : Es la zona del título del foro ¡Es hermoso andarlo editando! Les diría que jueguen mucho y se diviertan haciéndolo con cualquier idea que se les ocurrá en este caso añadiré los siguientes atributos.

a.forumtitle {    display: block;    text-align: center;    background: linear-gradient(45deg,var(--acento1),var(--acento2));    font-family: April Fatface;    text-transform: uppercase;    color: white;    font-size: 18px;    text-shadow: 1px 1px black;    letter-spacing: 1px;    width: 101%; }

5. Nuestra imagen se encuentra en dd.dterm img aquí pondremos algunas cosas, en mi caso difiniré el tamaño de imagen para que todas sean iguales, también pueden jugar con los blend-mode o ponerle simplemente bordes.

dd.dterm img {    border: 5px solid var(--oscuro);    outline: 1px solid var(--acento1);    margin-top: -5px;    width: 465px; height: 120px; }

6. Nuestro texto bueno aquí usamos un poco de html por lo que nuestra clase sería:.nuestrotextocate ¿Qué le pondremos? El tamaño (width, height, padding), el tipo de fuente y su color (font-size, font-family, color), la forma (display, overflow), bordes y decorados (border, outline). Recuerden que las cosas que les dejo realizadas son simplemente de muestra.

.nuestrotextocate {    width: 455px;    text-align: justify;    color: #ccc;    font-size: 13px;    height: 120px;    display: block;    font-family: 'Montserrat', sans-serif;    overflow: auto;    border: 5px solid var(--oscuro);    outline: 1px solid var(--acento1);    padding: 5px; }

7. Cómo se habrán dado cuenta nosotros hicimos dos tipos de texto así que ahora usaremos el que está junto a una imagen... y aquí viene la hora de jugar mucho.

Les dejaré algunas opciones: → Hacer que el texto este sobre la imagen (cambia el color del background por transparent o uno con la opacidad bajada):

.nuestrotextocate2 {    background: #58c3664d;    height: 110px;    display: block;    position: absolute;    width: 455px;    margin-left: 5px;    padding: 5px;    text-align: justify;    font-size: 12px;    overflow: auto; }

→ Hacer que el texto este a un costado de la imagen (juega con el margen-left para ponerlo del lado que desees), recuerda que puedes ponerle el color de background que quieras:

.nuestrotextocate2 {    background: #58c3664d;    height: 110px;    display: block;    position: absolute;    width: 216px;    margin-left: 5px;    padding: 5px;    text-align: justify;    font-size: 12px;    overflow: auto; }

→ Hacer que el texto aparezca vía hover ¡UY UY UY SE COMPLICA LA COSA! Bueno no desesperen esta parte puede ser más compleja pero intentaré explicarlo lo mejor posible.

¿Recuerdan que les había dado esta opción? :

Lorem impusi...

Bueno con esto usaremos dos partes en el css la primera se llamará .nuestrotextocate1 y la segunda .nuestrotextocate1:hover

Les explicaré el más simple (en mi humilde opinión), lo primero será ponerle altura, ancho, color de fondo, display: block; la posición: absolute y opacity: 0; con esto estaremos realizando una cajita (que no la podremos ver porque le pusimos 0 de opacidad), además hay que añadir las propiedades de fuente y las transiciones (esto nos dirá el tiempo que tarda en realizarse el efecto). Les debería quedar algo así:

.nuestrotextocate1 { background: var(--acento2);    position: absolute;    height: 110px;    display: block;    margin-left: 3px;    padding: 5px;    width: 455px;    text-align: justify;    color: #ccc;    overflow: auto;    opacity: 0;    -webkit-transition: all 0.4s ease-in-out 0s;    -moz-transition: all 0.4s ease-in-out 0s;    transition: all 0.4s ease-in-out 0s; }

Luego hay que añadir la palabra :hover y la opacidad: 1, nos quedaría así:

.nuestrotextocate1:hover {opacity: 1;}

Llegamos al último tramo del tutorial ¡Se hizo gigante! Ahora tenemos que acomodar los números del costado y el último tema.

dd.topics : Es para editar la zona que nos dice la cantidad de temas.

dd.posts : Es el sitio de la cantidad de post.

Yo pondré ambos con el mismo código para ahorrar líneas de css

dd.topics, dd.posts {    width: 17%;    display: inline-block;    background: linear-gradient(45deg,var(--acento1),var(--acento2));    margin: 5px;    text-align: center;    color: #ccc; }

Bueno aquí pondré algo extra en el panel de administración iré a "Índice - Estructura y Jerarquía:  Mostrar los avatares en la columna "Últimos mensajes" Sí" con eso nos mostrará el avatar del último usuario en responder (no es necesario añadirlo).

dd.lastpost {   background: linear-gradient(45deg,var(--acento1),var(--acento2));    margin: 5px;    width: 35%;    height: 103px;    font-size: 17px;    color: #ccc; }

La parte de la imagen:

.lastpost-avatar img {    width: 65px;    height: 90px;    border-radius: 5px;    -moz-border-radius: 5px;    -webkit-border-radius: 5px; }

¡Y ahora sí se ha acabado! Nos vemos en el siguiente :D

[mikazuki-commandes]

Commission FATE LAST NIGHT

inspirations notables: works from Pharaoh Leap https://codepen.io/pharaohleap/full/qBKypxK Marta Gawin https://www.behance.net/gallery/173277607/Virtual-Heritage?tracking_source=curated_galleries_ui-ux Igor Vensko (choix de polices - Font choices) https://www.behance.net/gallery/147114137/Luxury-Travel-Agency-Luxtripsco

Art : https://www.artstation.com/awanqi

Sur la base du BLANK THEME Un GRAND MERCI à Genius Panda pour ses ressources mises en libre service et à Monomer pour son plugin WOMBAT.

[anita-codes]

Advanced skin — New York City - 20$ (DARK VERSION)

New York City es una skin avanzada de venta múltiple. La compra de la skin viene con una pequeña guía de personalización y respaldo de los códigos al momento de hacer la instalación. ♡

Si estas interesado, escríbeme al discord anacodes y haber leído mis políticas de comisiones y reglas de skin compartidas antes.

Caracteristicas

Wrap 1000px.

Menú personalizado que incluye el avatar y nombre del usuario mas la leyenda del foro.

Header tipo tablón que incluye: nombre del foro, mini descripción mas 10 links destacados, frases e imagenes extras/decorativas, espacio para tres miembros del staff, últimos temas estáticos, caja para 3 anuncios con fecha destacada, un espacio para el "personaje favorito", un espacio de busquedas con 9 imagenes (40x40) y un espacio de texto para fecha, frase y clima.

Zona del indice (categorias y subforos, estadisticas).

Interior de subforos (listado de temas, perfil en temas).

Miembros.

Mensajeria privada.

Afiliados footer.

Perfil simple (u/1), paginado de busquedas (temas y mensajes).

Avatar 250x350px. Icono 90x90px. Imagen para las relaciones 70x70px en el perfil simple.

Colores de acuerdo al grupo de la cuenta en el rango.

El pack de tablillas se vende por separado, este incluye: genérica, registro y movimiento administrativos.

¡Haz click aquí para ver su versión clara y click aquí para ver su pack de tablillas!

[jawnressources]

Après plus de trois ans sans mise à jour (oui oui depuis 2021), après des essais infructueux et des suppressions de design entiers, voici ENFIN la mise à jour totale et complète d'Epsilon ! La preuve que l'inspiration met parfois des mois, voire des années à arriver; mais qu'il ne faut pas lâcher l'affaire pour autant. POUR VOIR LA MISE À JOUR ET TOUTES LES NOUVEAUTÉS, C'EST PAR ICI !

[entourage-themes]

DemonCyborg

Finalmente pude terminar la actualización de esta skin de One Punch Man, quería hacer algo muy sencillo pero funcional y bonito, ¡espero que les guste! ♡

Incluye:

Tablón de anuncios

2 estilos de subforos

Avatar 250x250 (con adicional de 300x500)

8 campos de perfil + Inventario

Página de Mensajería

Edición de imágenes y paleta de colores según tu temática

3 tablillas (Administrativa y Registro, Moderación, Ficha)

sᴋɪɴ ᴘᴏʀ ᴄᴜᴘᴏs (3/5) Costo: $60 USD

Puedes ver el skin dando click en este enlace. Para más información pueden escribirme vía Discord .mrross

Nota: Este skin es exclusiva para Foroactivo, Forumotion o Forumactif. Para una mejor visualización recomendamos usar Google Chrome. Recuerda leer nuestros términos y condiciones.

ᴇɴɢʟɪsʜ ᴠᴇʀs.

I was finally able to finish updating this One Punch Man skin, I wanted to make something very simple but functional and beautiful, I hope you like it! ♡

Includes:

Bulletin board

2 styles of subforums

Avatar 250x250 (with additional image 300x500)

8 profile fields + Inventory

Private Messages Page

Edits of images and color palette according to your theme

3 post sheets (Administrative and Registration, Moderation, Character File)

sᴋɪɴ ᴘᴇʀ sʟᴏᴛs (3/5) Cost: $60USD

You can see the skin by clicking on this link. For more information you can write to me via Discord .mrross

Notes: This skin is exclusive for Foroactivo, Forumotion or Forumactif. For a better visualization we recommend Google Chrome. Remember to read our terms and conditions.