#affichage

[michaelschreiner]

Affiches

[walker-diaries]

[arnaudberroy]

Affiche Journée portes ouvertes de l'Abbaye de Lagrasse

[oreilletendue]

Une société bilingue ?

Depuis quelques décennies, un métro roule à Montréal. L’Oreille tendue l’utilise fréquemment. Il arrive que des pannes nuisent au service. Comment connaître leur existence ? En suivant la Société de transport de Montréal (la STM) sur Twitter (que certains appellent X). Cela peut être utile. Pourtant, il y a un problème, et de taille. La STM envoie tous ses messages en double, l’un en français,…

[peekaboorpg]

omg j'ai enfin dompté forumactif messenger pour qu'il fasse ce que je voulais + j'ai réussi à faire un affichage différent pour la zone des téléphones sans passer par le mode blog qui marchait pas avec messenger du coup

[sweetdecoseo2023]

Trouvez Des Consoles Fonctionnelles Et Élégantes Chez Sweetdeco

Découvrez chez Sweetdeco des tables consoles qui allient praticité et élégance, idéales pour Affichage De La Console, Style De Console, Rangement Des Consoles, Tables Consoles, Meubles Consoles et Décor De Console.

[backdropsourcefr]

PHOTOMATON À ÉCRAN VERT CHROMA KEY

Un photomaton Chroma Key est un type de photomaton qui utilise la technologie d'écran vert pour superposer des images sur un fond. Cela permet d'utiliser une grande variété d'arrière-plans, y compris ceux qui ne sont pas possibles avec les cabines photo traditionnelles.

[jawnressources]

Appliquer le dark mode à une bannière

Il est d'utilité commune désormais d'utiliser un dark mode sur nos forums afin de rendre l'accessibilité la plus complète possible au maximum d'utilisateurices. Cependant un souci se pose souvent; c'est celui de la bannière. Une fois installé dans le panneau d'administration, il est difficile de savoir comment faire en sorte qu'elle change lorsqu'on clique sur le bouton de dark mode. Les couleurs; c'est souvent très bien expliqué mais la bannière, je n'ai personnellement pas trouvé de tuto' explicatif de comment faire. C'est pour ça que nous sommes là aujourd'hui ! Avec quelques petites modifications de template et de rajout de CSS, nous allons apprendre à mettre en place une bannière en deux "couches" afin qu'elle change au click du dark mode.

Il va falloir tout d'abord comprendre comment nous allons procéder. Nous allons tout simplement supprimer la balise dans notre template principal qui correspond à la bannière et en "recréer" une toute nouvelle. Ça semble compliqué de premier abord, mais pas du tout !

Dans votre template "overall_header" (Panneau d'administration > Affichage > Template > Général), vous avez cette ligne là :

<a href="{U_INDEX}" id="logo"><img loading="lazy" src="{LOGO}" alt="{L_INDEX}"/></a>

Cette ligne correspond à la bannière que vous allez entrer dans votre panneau d'administration au niveau des images, et qui est cliquable en renvoyant à l'accueil. Donc si on la supprime, allez-vous me dire, comment avoir une bannière qui s'affiche correctement et qui est ensuite cliquable ? Et bien, on va tout simplement simuler cet effet avec deux couches; un peu comme les calques sur Photoshop. Le premier calque correspondra à notre bannière qui va changer au dark mode et la seconde couche sera une bannière "invisible" à la même taille que l'on va poser par dessus, et qui sera elle, cliquable. C'est donc en décortiquant cet effet pour le reproduire en deux étapes simples que l'on va pouvoir avoir une bannière qui change avec le dark mode.

Alors avant de continuer, il faut que vous ayez d'ores et déjà installé un dark mode (celui de @code-lab, EDISON, est très bien, très bien expliqué et très pratique !) afin d'avoir dans notre CSS le root correspondant au mode de base de notre forum et le "data:root", correspondant aux valeurs du dark mode.

Commençons donc par installer les deux couches de bannière. À la place de votre valeur supprimée qui correspond à la bannière de base de Forumactif, vous allez rajouter ceci à la place :

<div class="dark_bann"></div>                                    <div class="dark_bann_sup"><a href="/"><img src="https://2img.net/i.ibb.co/BTqHhnX/prdbirthday3.png"/></a></div>

Ici, vous pouvez voir que la première div est vide et que la seconde contient une bannière invisible. Votre affichage de forum après avoir enregistré le template sera tout vide en haut de la page d'accueil et c'est parfaitement normal ! On ne panique pas, et on va installer le CSS pour rendre tout ça un peu plus joli.

La première étape est d'aller créer une nouvelle valeur dans le root correspondant à l'image de la bannière de base que vous voulez afficher; comme celle que vous aviez installé dans votre panneau d'admin. Exemple :

:root {   --imgbann:url(VOTREURLD'IMAGEICI); }

Une fois ceci fait, vous allez copier coller cette même valeur dans le dark:root (qui correspond à ce que le dark mode va aller remplacer), mais en changeant l'URL par la bannière en dark mode. Exemple :

[data-color-scheme="dark"]:root {   --imgbann:url(VOTREURLDELABANNDARK); }

D'accord, c'est bien mignon mais rien ne change quand on clique sur le dark mode, oskour ! Pas de panique, c'est parfaitement normal. On vient simplement de configurer le changement d'image au click du bouton de dark mode. Maintenant, il va falloir appliquer cette même image par le CSS dans la bannière dont la div était vide. Et oui, elle servait à ça ! Retournez donc dans votre CSS, et rajouter ceci :

.dark_bann {   width: 800px;   height: 500px;   overflow: hidden;   background-image: var(--imgbann);   background-size: 100%;   background-position: 50% 50%; }

Ici, nous avons donné une largeur de 800px à notre bannière, une hauteur de 500; on a imprimé en image de fond notre bannière de base; on lui a appliqué une taille de 100% pour que ça prenne bien toute la place disponible et on l'a centré totalement. Et là, magie, notre bannière s'affiche bien et change au click du dark mode !

Cependant il reste un souci, notre bannière invisible cliquable apparaît en-dessous de notre "vraie" bannière qui elle n'est pas cliquable. Nous allons donc ajouter à notre CSS :

.dark_bann_sup {   overflow: hidden;   width: 1005px;   height: 500px;   margin-top: -500px; } .dark_bann_sup img {   width:100%; }

Ici, on a donné la même taille à la bannière invisible (vous pouvez essayer de lui mettre un background d'une couleur bien voyante comme le rouge pour bien la voir) et on l'a "remonté" pour qu'elle se superpose à notre vraie bannière. Et là, tout est parfait ! On peut bien la cliquer comme une bannière "normale", et la couche inférieure est notre bannière qui change au dark mode.

Voilà voilà, j'espère que ce tuto pourra aider qui que ça intéressera et que ça ne sera pas trop difficile à utiliser !

[equipe]

Notes de mise à jour

🌟 Nouveautés

La fonction Communautés est maintenant disponible pour tous les utilisateurs [tumblr] ! 🎅

À la manière de ce que proposent déjà les blogs, il est désormais possible de cliquer sur le tag d'un billet publié dans une communauté afin de ne consulter que les billets associés à ce dernier.

Des indications compatibles avec les lecteurs d'écran ont été ajoutées aux boutons de réactions présents dans les billets des communautés.

🛠️ Correctifs

Correction d'un bug qui ne convertissait que les 5 premières mentions d'un billet en lien.

Correction d'une anomalie qui pouvait maintenir affichées simultanément plusieurs bulles d'aides associées aux réactions dans les billets des communautés.

Correction d'un problème dans l'application Android qui pouvait masquer la partie Notes derrière le clavier virtuel lors de la modération d'un contenu dans une communauté. Il est à présent possible de naviguer dans l'écran pour atteindre la section Notes.

Correction des bulles d'aide associées aux réactions qui pouvaient voir leur affichage se prolonger en dehors de l'écran en fonction des proportions de ce dernier.

Correction d'un bug qui pouvait empêcher la modification d'un moyen de paiement précédemment enregistré.

Correction d'une anomalie qui pouvait empêcher l'acquisition de thèmes premium chez certains utilisateurs.

Correction d'un problème qui pouvait empêcher l'ajout de crédits de thèmes premium suite à leur achat.

🚧 En cours

Dans la fonction Communautés, l'affichage du lecteur vidéo en dehors du fil de billets a été désactivé car il ne fonctionnait pas de manière appropriée. Nos équipes planchent sur un correctif.

🌱 Prochainement

Pas de nouvelle fonctionnalité à annoncer cette semaine.

Vous rencontrez un problème ? Consultez les problèmes connus ou écrivez-nous (en anglais) et nous reviendrons vers vous aussi vite que possible.

Vous souhaitez nous faire part de vos commentaires ? Rendez-nous visite sur le blog Work in Progress et participez aux discussions de la Communauté (en anglais). 

Vous désirez soutenir financièrement Tumblr ? Laissez-vous tenter par un abonnement Premium et jetez un œil à notre badge Mécène Tumblr directement sur��TumblrMart.

[michaelschreiner]

Plakatwand

[walker-diaries]

[the-paintrist]

Léon Choubrac - Alcazar d'Hiver - 1882

Léon Choubrac (17 November 1847 – 5 April 1885), who sometimes signed his drawings with Hope, was a French poster designer and illustrator based in Paris.

With his younger brother Alfred Choubrac, Léon was trained as a classical artist with the painters Charles Doërr and Isidore Pils at the École des Beaux Arts. The Choubrac brothers came very soon to the poster, practicing since 1875 the modern treatment of colors and typography, associated with images thanks to chromolithography.

In the early 1870s, the Choubrac brothers and Jules Chéret (known as "the father of the modern poster") reduced the cost of colour lithography introducing technical advances. Additionally, in 1881 restrictions on bill-posting (affichage) were lifted and eased state control of the media in France. In 1884, the Paris city council started to rent out surfaces belonging to the municipality, paving the way for a rapid increase in the production and distribution of advertising posters. Posters with clear colours and dashing images appeared all over town during the vibrant spirit of the Belle Époque.

Léon Choubrac drew some posters that higher authorities seized or torn down, amongst others one that showed a woman tortured in the presence of the Pope. Another poster, The secret loves of Pius IX, showed the portrait of Pope Pius IX below a series of portraits with heads of young women. The censor made him add a beard to the head of the Pope to disguise it. The poster nevertheless caused a scandal and was torn down by order of the French Minister of the Interior François Allain-Targé.

Léon and Alfred created the Ateliers Choubrac. As an illustrator, he sometimes collaborated with his brother in Gil Blas or the satirical weekly Le Courrier français, among others. Choubrac illustrated several works by Emile Zola. Although Leon died young (1885), his brother Alfred went on to produce an impressive number of posters for Parisian entertainers, theatres, businesses and various commercial products.

The poster collector Ernest Maindron, who wrote the first essay about the illustrated poster in the Gazette des Beaux-Arts in 1884, and later published the first book on the subject (Les Affiches Illustrees) in 1886, mentioned the Choubrac brothers, along with and Chéret, among the pioneers of the illustrated poster.

[aeroplvne]

TIPS : Optimisation de votre design

Je vois beaucoup de forums prometteurs ouvrir dernièrement, où la hype se build énormément jusqu’au jour du lancement. Malheureusement, les bases des designs ne sont souvent pas solides, ce qui impacte directement la communauté qu’ils auraient pu recevoir. Quelques tips de ma part pour qu’un design reste simple tout en étant efficace, et surtout fonctionnel ;

Harmonie des couleurs ; Difficile d’accrocher à un design lorsque les contrastes des couleurs font violence. Dans un premier temps, il est évident qu’il faut toujours prévoir les couleurs du design en fonction de son header (ou inversement). La palette de couleurs doit rester cohérente et harmonieuse, ce qui n’est souvent pas le plus simple à créer. Si vous ne sentez pas l’inspiration venir, vous pouvez tout à fait utiliser l’outil pipette de photoshop pour récupérer quelques couleurs du header à disposition, ou bien utiliser des plateformes comme Coolors, qui génèrent des palettes prédéfinies en fonction de vos attentes. Lors des dernières années, il a aussi été remarqué que les designs aux couleurs douces ont tendance à attirer plus de monde que les saturées. Concernant le choix de la couleur des paragraphes, veillez à ce que celle-ci soient assez contrastée, tout en ne jurant pas avec le design. Par exemple, si vous avez un fond blanc, ne mettez jamais un noir à 100%, cela pourrait alourdir le design. Un gris foncé fera parfaitement l’affaire, et adoucira le tout.

Lisibilité des textes et choix polices ; Beaucoup de designer vous diront une chose ; ne jamais mélanger différentes familles de polices, comme les Sherif (polices à empattement ; ex. Times) ou Sans Sherif (polices sans empattement ; ex. Arial). Cela dit, il y a évidemment quelques variables à prendre en considération. Si vous choisissez d’utiliser une police Sherif pour vos titres, les paragraphes devront toujours utiliser eux une police Sans Sherif : la raison est simple, ceux-ci sont souvent plus petits, et une police à empattement aura tendance à alourdir votre design. De plus, cela le rendra très certainement “vieillot” ou alors le tirera vers un univers légèrement plus fantastique.

Il est évident que les polices ne devront pas être trop petites de façon à privilégier l’accessibilité, je ne vais pas m’étendre sur le sujet, j’ai vu certains threads passer sur le sujet qui regroupent déjà beaucoup de ressources.

Optimisation des images ; C’est surtout ce point là qui m’a fait penser qu’il fallait que je fasse ces tips. Vous ne savez pas à quel point, pour les utilisateurs d’écrans rétina, il peut-être douloureux de tomber sur des designs prometteurs, mais dont les dimensions ne correspondent plus aux normes du web de nos jours. Forumactif est une plateforme vieillissante et dont les limitations se font de plus en plus ressentir, cependant il y a toujours des moyens simples de les contourner. Un écran rétina a ses pixels multiplié par deux, c’est pour cette raison que de nos jours les avatars sont passés du 200*320 au 400*640 de façon à ce que ceux-ci restent parfaitement nets pour tous les utilisateurs. Dans cette optique, les designs des forums doivent également être adaptés, et de ce fait, votre header devrait faire deux fois la taille de ce que vous aviez prévu pour votre forum. Si celui ci a un affichage de 800px de largeur, alors en développement sur Photoshop, vous devrez le créer en 1600px. Ensuite, un simple code dans le css pour le réduire à 800px lui permettra d’atteindre sa pleine qualité pour tous les utilisateurs. Dans le cas contraire, les utilisateurs d’écran rétina verront votre design flou et pixelisé, et ne seront donc logiquement pas invités à s’inscrire.

Optimisation du codage ; Là encore, certaines nouveautés échappent encore aux créateurs, ce qui les empêche malheureusement d’avoir un forum facilement adaptable, créant une perte de temps et de fonctionnalités. Le codage est une zone assez vaste qui est propre à chacun, je ne pense par exemple pas qu’il y est une bonne ou mauvaise façon de coder à partir du moment où le résultat obtenu est fonctionnel. Cependant, j’insisterai surtout au niveau des couleurs, sur le fait d’utiliser impérativement des variables ( var(--x) ) à la place des couleurs fixes (#000000 par exemple). Une variable vous permet lors des changements de design, de cibler toutes les parties utilisant la même couleur, en même temps. Par exemple, votre premier design avait un même bleu quelque part, noté à la variable "c1", le prochain design demande du rouge, eh bien vous aurez juste à changer une seule fois la couleur de cette variable "c1", plutôt que d’avoir à chercher le code du bleu dans chacune des parties où il est utilisé. Gain de temps incroyable ! J’appuie sur le fait qu’il est jamais trop tard pour coder de cette manière !!! Votre forum peut être créé depuis 10 ans et adopter aujourd’hui ce changement, ça ne vous demandera normalement pas énormément de temps à adapter le tout.

Certains forum manquent également de place dans leur CSS, il est alors tout à fait possible d’ajouter une seconde page (je dirais même fortement conseillé) hors forumactif. Vous pouvez utiliser des logiciels gratuits comme Brackets pour coder du css, puis l’enregistrer en xx.css ; suite à cela, l’héberger sur Google Drive ou bien DropBox, et l’ajouter en lien extérieur via la balise <link href=“nomdelapage.css" rel="stylesheet"> dans le template “Haut du Forum”. (Vous trouverez facilement d’autres balises link au début de cette page, mettez cette balise à la suite et hop.

Version sombre (please) ; Avec l’utilisation des variables, vous aurez également la possibilité d’installer très facilement une version sombre sur votre forum. Je ne répèterai jamais assez l’importance de celle-ci. Lorsqu’il est 23h, que les yeux sont fatigués mais que l’inspiration est là, passer le forum en version sombre est un réel bénéfice pour tout le monde. Petit tutoriel simple et efficace créé par bigbadwolf pour une installation réussie par ici ; https://comptoirdesrolistes.tumblr.com/post/650710791464583168/bigbadwxlf-tuto-dark-light-mode-pour-passer Voilà voilà, j’espère que ce message (plus long que prévu aha) saura guider ceux qui s’y connaissent parfois moins en la matière ! J’oublie probablement pas mal de choses à vrai dire, mais je crois que le principal concernant l’optimisation est là ! Bonne journée à tous !

[lil-miss]

If I ever feel the need to go insane again and start French posting about galaxy girls, I’m going to tag it « affichage l'extraterrestre lesbienne. » Because that is the best way that I could translate lesbian alien posting and it also (technically) translates to “display the lesbian alien” which makes it sound like I’m putting Zim in a little glass case and showing her off like a fancy little art installation.

[peekaboorpg]

Peek a Boo ! v.4.3

La nouvelle version de PaB est sortie à l'instant et je vous présente avec fierté ce nouveau design, ainsi que plein d'ajouts de fonctionnalités !! ✨

— https://peekaboo-rpg.forumactif.com/ —

Les nouveautés ↓

Un slideshow automatique pour les news

Une balise pour les TWs qui s'accompagne d'un bouton montrer/cacher les tws, il s'affiche automatiquement sur les posts qui contiennent la balise

Forumactif Messenger adapté à PaB, couplé à un affichage SMS dans la zone Téléphones

Bottin des avatars avec une barre de recherche et des filtres automatisés

Affichage des badges en slideshow et avec des infobulles pour les décrire

Ajout d'un champ « Rythme de rp » où les membres peuvent choisir un nombre entre 0 et 99 km/h, qui s'accompagne d'un petit cadran de vitesse qui s'update en fonction de la valeur du champ

Guide du nouveau rpgiste ! pour aider les personnes qui débutent en rp

Guide de l'inclusivité et de la représentation ! pour aider à créer des personnages plus inclusifs et respecteux

Voir la liste de tous les ajouts

[sweetdecoseo2023]

Libérez Votre Style : Concevez Votre Espace De Rêve Avec La Console Sweetdeco | Sweetdéco

Découvrez comment l'exquise collection de consoles de Sweetdeco peut rehausser votre espace, offrant le mélange parfait de fonctionnalité et d'esthétique. Explorez Affichage De La Console, Style De Console, Rangement Des Consoles, Tables Consoles, Meubles Consoles et Décor De Console pour créer votre sanctuaire idéal.