#426 Le 25/03/2019, à 00:28
- Coeur Noir
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Oui enfin nam tu es juge et partie puisque dolys c'est toi non ?
ZdNet m'interroge, c'est loin d'être une source fiable, ou disons neutre, concernant Ubuntu.
À la rigueur je préférerais omg!ubuntu dans ce cas mais c'est anglophone ( et pas neutre non plus mais au moins enthousiaste ) : un équivalent dans le paysage francophone ?
On pourrait peut-être y mettre les liens vers les forums d'entraide ( francophone ) des logiciels phares d'Ubuntu : FireFox, ThunderBird, LibreOffice, Gimp et autres ?
Les illustrations de ces liens dans le volet me paraissent toujours énormes, que ce soit sur desktop ou mobile : elles sont quasi plus grandes que les illustrations des variantes dans la page, alors que ces liens sont « secondaires ».
Dernière modification par Coeur Noir (Le 25/03/2019, à 18:39)
Débuter ⋅ Doc ⋅ Bien rédiger ⋅ Retour commande ⋅ Insérer image | illustrations & captures d'écran < ⋅ >
Hors ligne
#427 Le 25/03/2019, à 00:29
- Coeur Noir
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
C'est où la page maintenant? Sur github on ne peut pas visualiser.
Le lien vers la page est dans la signature des messages de TouLibre.
Débuter ⋅ Doc ⋅ Bien rédiger ⋅ Retour commande ⋅ Insérer image | illustrations & captures d'écran < ⋅ >
Hors ligne
#428 Le 25/03/2019, à 00:47
- melixgaro
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Merci Coeur Noir
Qu'un site tiers se retrouve sur la page d'accueil d'un gros site comme ubuntu-fr n'est pas anodin. En tant que visiteur, ça m'envoie un signal comme quoi c'est une source de qualité. Qui décide que tel ou tel site est listé ? Selon quels critères ? À qui s'adresser pour que son site y soit également ? C'est donc aussi une histoire d'égalité de traitement. Perso je trouve que ça n'a rien à y faire. Je pense plutôt à une page secondaire, du style 'Liens utiles' ou 'Autres sources d'information'.
Linux depuis ~2007. Xubuntu seulement.
Hors ligne
#429 Le 25/03/2019, à 11:25
- Aldian
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Salut, et bravo pour le travail accompli ce week-end. Je vais répondre à certaines questions:
1) Logo Ubuntu en haut à gauche sous forme de texte plutôt que d'image:
Dans la doc ça marche comme ça (à peu de choses près):
<span class="navbar-brand">
<span class="uf uf-cof" id="dw__accueil" style="font-size: 35px;"></span>
<span id="dw__title" style="margin-top:-5px">Wiki ubuntu-fr<span id="dw__tagline">La Documentation francophone</span></span>
</span>
La magie réside dans la classe "uf-cof" qui indique à fontawesome qu'il faut placer le logo Ubuntu à cet endroit. Le reste c'est des balises classiques et un zeste de classes bootsrap3, pas indispensables
2) Les liens externes:
S'ils étaient déjà présents sur l'ancienne page d'accueil, OK. Si tu en as ajouté de nouveaux, il faut nous l'indiquer car ça doit être validé par le CA de l'association.
3) Les images de liens externes:
Je ne comprends toujours pas le pourquoi de mettre une image pour juste du texte. J'ai essayé d'aller dans ton sens en proposant une image alternative, mais si tu me dis que tu souhaites réduire la taille de l'image, autant ne pas mettre d'image du tout! Par exemple pour Indeed, ce qui suit fera très bien l'affaire:
<a href="https://www.indeed.fr/Emplois-ubuntu" target="https://www.indeed.fr/Emplois-ubuntu" class="image">
<span style="color: blue;font-size: xx-large;">Indeed.fr</span><br>
Retrouvez des centaines d'offres d'emplois Ubuntu et postulez en ligne (lien externe)
</a>
Et s'il faut rajouter quelques effets supplémentaires d'ombrage ou de police spéciale, ça se fait très facilement en CSS moderne.
4) La recherche:
Pas besoin de faire appel à un administrateur, en effet, dans un souci d'homogénéisation, toutes les composantes du site utilisent la recherche du forum. Tout ce que tu as à faire c'est de spécifier ce qui suit dans ta balise <form>:
action="//forum.ubuntu-fr.org/search_ubuntufr.php" accept-charset="utf-8"
En plus de ça il faut dans le champs d'input de texte spécifier name="q", et pour l'input de la dropdown list:
<select name="tsearch">
<option value="wiki" selected="selected">Documentation</option>
<option value="forum">Forum</option>
</select>
En respectant bien le name et les value de chaque option. Et normalement ça suffit.
J'espère que ça t'aidera à avancer
Dernière modification par Aldian (Le 25/03/2019, à 11:41)
Hors ligne
#430 Le 25/03/2019, à 11:52
- melixgaro
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Salut,
2) Les liens externes:
S'ils étaient déjà présents sur l'ancienne page d'accueil, OK. Si tu en as ajouté de nouveaux, il faut nous l'indiquer car ça doit être validé par le CA de l'association.
Je crois qu'il n'y en a aucun sur la page actuelle (à part pour la boutique enventelibre).
Linux depuis ~2007. Xubuntu seulement.
Hors ligne
#431 Le 25/03/2019, à 14:22
- fabux
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Salut,
ça le fait peut-être que chez moi mais si je switch de couleur (merci pour la lune ! c'est vrai que noir c'était trop noir ) et que je reviens sur soleil, c'est le menu qui s'ouvre et pas le mode light (sur cette page en tout cas https://steeve-legal.github.io/ubuntu-p … il-projet/ )
D'ailleurs sur cette page pas de favicon.
Pour les liens externes, je n'en vois aucun de présent sur l'actuel.
Amha ils sont dispensables mais ce n'est que mon avis et comme l'a indiqué Aldian a "négocier" avec le CA.
May linux be with you
Comment poster un message.
Je me présente dans la doc
Hors ligne
#432 Le 25/03/2019, à 22:22
- Toulibre
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Bonsoir, alors on discute pendant que je bosse ?
@ldnpub(Rodolphe), merci beaucoup !
@Coeur Noir, merci pour les sliders, celui de Stackoverflow semble super sauf que je ne vois pas comment ajouter les images, je vais l'étudier. Puis pour l'idée d'ajouter Gimp et autres c'est une bonne idée.
@melixgaro, merci également, je vais laisser pour le moment le slogan "Leader en tout points" ça en jette.
@Aldian, j'ai suivi tout tes conseils excepté l'icône,ça ne veut pas fonctionner , les ajouts supplémentaires sont : Ubuntu blog (news but in English) , Almanet de Dolys (mine d'infos avec explicatifs en images et en Français) , zdnet (peut faire péter mais pour remplacer avec autre chose de votre choix) , indeed (c'est sympa des emplois dans le monde du libre!)
@fabux, merci, le switch fonctionne bien chez moi de lune à soleil,les autres aussi
Sinon j'espère qu'il vous plaît le nouveau slider, pas de contrôles donc il faut lire, c'est à vitesse lente, J'ai improvisé en mixant les textes et le images, du coup quelques modifs dans le 1er paragraphe. J'essaierais le slider proposé par Coeur Noir bientôt.
#433 Le 26/03/2019, à 10:35
- Aldian
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Je vais voir si je peux trouver du temps pour les autres points, mais déjà concernant la recherche, ton copier-coller est un peu trop littéral
<form class="form-wrapper cf" id="search-form" action="action="//forum.ubuntu-fr.org/search_ubuntufr.php"" accept-charset="utf-8" method="post">
Il y a un action="action= qui traine.
NB: Concernant les ajouts supplémentaires, il n'y a pas que ça, je vois par exemple un lien vers un forum Mate qui n'a a priori rien à voir avec l'association (et qui ne nous font même pas l'honneur de mettre un lien vers nous alors qu'ils proposent les forums gentoo et debian)
Dernière modification par Aldian (Le 26/03/2019, à 12:57)
Hors ligne
#434 Le 26/03/2019, à 18:25
- Toulibre
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Bonjour, j'ai revu ces points, merci.
il y a un nouveau super slider, passé du temps dessus, le souci est que je ne peux pas tester sur smartphone en local à part examiner l'élément avec firefox et passer en pseudo écrans simulés. Pensant que tout va pour le mieux je transfère sur github et là c'est l'horreur, responsive qui disait.. nan..
Je verrais ça demain avec un autre ou le précédent, pffff ..
#435 Le 26/03/2019, à 19:40
- PPdM
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Super sympa ton idée
La critique est facile, mais l'art est difficile !
L'humanité étant ce qu'elle est, la liberté ne sera jamais un acquit, mais toujours un droit à défendre !
Pour résoudre un problème commence par poser les bonnes questions, la bonne solution en découlera
Hors ligne
#436 Le 26/03/2019, à 20:12
- Toulibre
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
@PPdM, merci , finalement je ne pouvais pas laisser dans un tel état avant d'aller me coucher,m'aurais filé le cauchemar. Le slider était sympa mais j'ai ré-instoré le précédent qui lui (même si j'ai fais des pieds des mains pour le centrer sans y parvenir) est au moins responsive. L'idée est toujours présente malgré tout et je tenterais une nouvelle fois de mettre un autre carrousel centré si possible.
J'en ai testé 4 ou 5 aujourd'hui qui n'allaient pas vraiment.
#437 Le 26/03/2019, à 20:21
- Toulibre
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
@Aldian, le code html de la barre de recherche:
<!-- Barre de recherche -->
<form class="form-wrapper cf" id="search-form" action="//forum.ubuntu-fr.org/search_ubuntufr.php" accept-charset="utf-8" method="post">
<input type="search" id="tsearch" name="q" placeholder="Rechercher dans" value="" />
<select name="tsearch">
<option value="forum">Forum</option>
<option value="wiki">Documentation</option>
</select>
</form>
#438 Le 26/03/2019, à 21:55
- Toulibre
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
#439 Le 27/03/2019, à 14:30
- Aldian
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
@Aldian, le code html de la barre de recherche:
<!-- Barre de recherche --><form class="form-wrapper cf" id="search-form" action="//forum.ubuntu-fr.org/search_ubuntufr.php" accept-charset="utf-8" method="post"> <input type="search" id="tsearch" name="q" placeholder="Rechercher dans" value="" /> <select name="tsearch"> <option value="forum">Forum</option> <option value="wiki">Documentation</option> </select> </form>
Semble avoir un souci, ça renvoie :
http://free-pictures-hosting.org/upload/thumb/2019-03-26-20-20-38-492363-Sans-titre.png
Dans ton code il faut remplacer method="post" par method="get"
Hors ligne
#440 Le 27/03/2019, à 18:27
- Toulibre
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
@Aldian, Nickel maintenant la barre de recherche fonctionne merci
#441 Le 29/03/2019, à 12:19
- Aldian
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
@Aldian, j'ai suivi tout tes conseils excepté l'icône,ça ne veut pas fonctionner
Alors j'ai trouvé 20 min ce matin pour regarder le comment du pourquoi, et en fait il semblerait que ça vienne de tes fichiers de font (déclarés dans le fichier CSS de fontawesome). Pour rentrer dans les détails technique, voici le CoF (Circle of Friends), qui est le caractère que nous voulons afficher: https://fontawesome.com/icons/ubuntu?style=brands
Si on regarde son code hexadécimal, il s'agit de "F7DF". Si maintenant on va voir dans ton fichier CSS https://steeve-legal.github.io/ubuntu-p … me.min.css et qu'on fait une recherche dans le fichier, on ne trouve pas la chaine de caractères en question.
Une autre manière de voir le problème consiste à télécharger le fichier .woff que tu utilises: https://steeve-legal.github.io/ubuntu-p … ff?v=4.7.0 Si maintenant on va sur https://fontdrop.info/ et qu'on sélectionne le fichier téléchargé, ça permet d'afficher tous les caractères spéciaux qu'il contient. Et de se rendre compte visuellement que le CoF n'y est pas.
Le truc à tester ensuite, c'est ajouter dans tes feuilles de style le lien suivant:
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
Ensuite on ajoute quelque part dans la page, par exemple à coté de l'image actuelle du logo, le code suivant:
<i class="fab fa-ubuntu"></i>
Et on regarde si quelque chose s'affiche, dans mon cas, en hackant un peu ta page via F12, j'obtiens ceci:
Je t'invite à faire un test pour voir si déjà tu arrives à reproduire la démarche d'insertion du CoF dans la page. Et dans un deuxième temps, on verra comment faire pour faire les choses proprement et avoir le rendu désiré
Hors ligne
#442 Le 29/03/2019, à 19:18
- Toulibre
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Avant tout je ne suis pas fan des liens google (proposés auparavant pour les polices ubuntu) ou celui pour fontawesome, cela crée un problème au niveau de la sécurité et donc expose le site. J'ai inclus le code dans le fichier font-awesome.min.css qui est ainsi fait :
.fa-ubuntu:before{content:"\f7df"}.
Après avoir inclus l'icône "fab fa-ubuntu" dans le menu cela donne ceci
En mettant à jour les fichiers fontawesome (le code ubuntu y est cette fois-ci) et même en les liant ces css au fichier html même résultat, un petit carré avec le code apparaît.
Et en copié collé du code que tu as donné précédemment #429 rien n'apparaît
Ce qui attise ma curiosité du comment est ce possible que cela fonctionne sur le wiki et pas ici ..
Sinon le code actuel du logo dans le menu (en rapport avec la capture écran) :
<header class="major">
<span class="navbar-logo-ubuntu-fr">
<span class="fab fa-ubuntu fa-3x" style="color: white;"></span>
</header>
Ça donne ceci
C'est avec le lien https non sécurisé celui-ci
Dernière modification par Toulibre (Le 29/03/2019, à 19:20)
#443 Le 31/03/2019, à 16:23
- Toulibre
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Bonjour , je n'ai pas trouvé pour le logo (positionner les écritures à droite) alors j'en ai édité un nouveau plus ressemblant avec inskape.
Et j'ai finalement réussi à centrer le carrousel .
#444 Le 01/04/2019, à 11:07
- Aldian
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Pour mon #429 il faut l'oublier, erreur d'interprétation de ma part, je vais y revenir...
A part ça, j'ai l'impression que tu as édité ton fichier CSS pour y rajouter la correspondance entre la classe "fa-ubuntu" et le code hexadécimal "F7DF", mais que tu as oublié de mettre à jour les fichiers du répertoire "assets/fonts/" (et/ou la version à appeler depuis ton fichier CSS qui est restée "?v=4.7.0".
Pour rappel, les fichiers .eot, .ttf, woff, .woff2 contiennent des représentations SVG de l'ensemble des caractères spéciaux qu'on désire afficher, tandis que le fichier CSS fontawesome permet de leur attribuer à chacun une classe. Si tu veux inclure le logo Ubuntu, il faut mettre à jour les deux.
Je ne t'avais pas donné toutes ces explications parce que j'aime bien partir du principe qu'avant de se préoccuper de la sécurité et des autres problématiques transverses, on commence par essayer de "faire marcher". Du coup ce que je souhaitais, c'est que tu essaye en utilisant le lien google, qui contient tout en un, les classes CSS et les bons fichiers .woff, et si ça avait marché correctement on aurait ensuite regardé comment faire pour tout rapatrier en local et éviter de devoir passer par un lien google.
Hors ligne
#445 Le 01/04/2019, à 11:19
- Aldian
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Concernant la manière dont c'est fait dans la doc, j'ai réétudié le problème un peu plus en détail ce matin. On a eu le même problème que toi et on s'est dit que pour optimiser la bande passante le plus simple était d'inclure le caractère du CoF à part. Il a donc son fichier CSS dédié: https://doc.ubuntu-fr.org/lib/tpl/boots … .fonts.css
Le plus simple est peut-être que tu récupères ce fichier et que tu l'ajoutes à ta page. Note que le fichier fait référence à 8 fichiers de font:
Ubuntu_400.eot?#iefix
Ubuntu_400.woff
Ubuntu_400.woff2
'Ubuntu_400.svg#Ubuntu
Et ainsi de suite avec les mêmes fichiers mais en _700 (les premiers servant pour l'affichage normal et les suivants pour l'affichage en gras). Tu peux les récupérer depuis le même répertoire, par exemple pour télécharger Ubuntu_400.woff: https://doc.ubuntu-fr.org/lib/tpl/boots … u_400.woff
Une fois les 8 fichiers en place (plus le fichier CSS), peut être que le code du #429 fonctionnera (ou en tout cas je serai à même de faire mes propres tests et de te guider vers une solution fonctionnelle)
Hors ligne
#446 Le 01/04/2019, à 15:03
- Toulibre
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Bonjour , autant pour moi je n'ai pas précisé que j'avais fait la maneuvre en local, plus rapide à tester avant de le mettre sur github,j'ai quand même refait suite à ton dernier message pour être sûr.
Donc j'ai téléchargé la totale sur le site Fontawesome ici : (les 700 n'y sont pas)
https://fontawesome.com/how-to-use/on-t … e-yourself
Puis ajouté le dernier font-awesome.min.css et les fichiers dans le dossier "fonts" comme ceci :
Ajouté à tous les fichiers css les fonts face puis c'est aussi relié à la police ubuntu dans le fichier html comme ceci :
En y regardant de plus près il y avait également le fichier _icon.scss à mettre à jour,c'est donc fait.
Le résultat est toujours le même comme ceci:
Ça m'inquiète un peu
#447 Le 01/04/2019, à 17:02
- Aldian
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Ce serait quand même plus simple si tu pushais ton travail, pour que je puisse t'aider. Je comprends que tu ne veuilles pas polluer ton master, mais tu as pensé à créer une branche de travail relative à cette problématique?
Ce que je peux te dire sur la base de tous les screenshots, c'est que visiblement il y a un problème dans tes @font-face du 2e screenshot: il manque le "fonts/" en début d'URI pour les Ubuntu
Hors ligne
#448 Le 01/04/2019, à 19:15
- Toulibre
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Euh est ce que tu signifiais comme ceci ?
/* Ubuntu Fonts */
@font-face {
font-family: 'ubuntu-r-webfont';
src: url('fonts/ubuntu-r-webfont.eot');
src: url('fonts/ubuntu-r-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/ubuntu-r-webfont.woff') format('woff'),
url('fonts/ubuntu-r-webfont.ttf') format('truetype'),
url('fonts/ubuntu-r-webfont.svg#Ubuntu-r') format('svg');
font-weight: normal;
font-style: normal;
Oui désolé de travailler en local, je commence à manquer de temps ma saison reprend, mais si ça fonctionne je prendrais le moment pour pousser tout ça sur github.
C'est Lundi mais j'essaierais un peu tout les soirs et au pire je mettrais le lien en https fontawesome vu que celui-ci fonctionne.
il est pas joli mon icône ?
Edit : en Attendant que je trouve peut être la soluce en local je viens de mettre le lien fontawesome et l'icône dans le fichier html sur github, resterais à compléter pour le texte, merci pour toute l'aide que tu as apporté
Dernière modification par Toulibre (Le 01/04/2019, à 19:39)
#449 Le 02/04/2019, à 10:28
- Aldian
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
Oui, en fait ce que je veux dire c'est que ton CSS doit être cohérent avec la structure de tes assets. Si tu mets ton fichier CSS dans '/assets/css/monfichier.css' et tes fonts dans '/assets/fonts/' (par exemple). => Il faut que lorsque tu référence une font depuis ton CSS tu passe le bon chemin d'accès relatif dans le CSS. Dans l'exemple que je viens de donner ça serait un truc du genre '../fonts/monFichierDeFont.woff'
Ensuite concernant l'ajout du texte, voici par exemple ce que tu pourrais faire:
<span class="navbar-logo-ubuntu-fr">
<span class="fab fa-ubuntu fa-3x" style="color: white;"></span>
<span style="display: block;float: right;color: white;margin-left: 5px;margin-top: -3px;">La Communauté<br>Francophone</span>
</span>
Hors ligne
#450 Le 02/04/2019, à 13:37
- Toulibre
Re : Proposition de refonte de la page d'accueil ubuntu-fr.org
J'ai inclut en supplément et en local les fichiers fontawesome dans le css comme suit :
/* Début FontAwesome*/
@font-face {
font-family: 'Font Awesome 5 Free';
font-style: normal;
font-weight: normal;
src: url('assets/fonts/fontawesome-webfont.woff'); format('woff'),
src: url('assets/fonts/fontawesome-webfont.woff2'); format('woff'), }
@font-face {
font-family: 'Font Awesome 5 Brands';
font-style: normal;
font-weight: normal;
src: url('assets/fonts/fa-brands-400.eot');
src: url('assets/fonts/fa-brands-400.eot?#iefix') format('embedded-opentype'), url('assets/fonts/fa-brands-400.woff2') format('woff2'), url('assets/fonts/fa-brands-400.woff') format('woff'), url('assets/fonts/fa-brands-400.ttf') format('truetype'), url('assets/fonts/fa-brands-400.svg#fontawesome') format('svg'); }
@font-face {
font-family: 'Font Awesome 5 Free';
font-style: normal;
font-weight: 400;
src: url('assets/fonts/fa-regular-400.eot');
src: url('assets/fonts/fa-regular-400.eot?#iefix') format('embedded-opentype'), url('assets/fonts/fa-regular-400.woff2') format('woff2'), url('assets/fonts/fa-regular-400.woff') format('woff'), url('assets/fonts/fa-regular-400.ttf') format('truetype'), url('assets/fonts/fa-regular-400.svg#fontawesome') format('svg'); }
@font-face {
font-family: 'Font Awesome 5 Free';
font-style: normal;
font-weight: 900;
src: url('assets/fonts/fa-solid-900.eot');
src: url('assets/fonts/fa-solid-900.eot?#iefix') format('embedded-opentype'), url('assets/fonts/fa-solid-900.woff2') format('woff2'), url('assets/fonts/fa-solid-900.woff') format('woff'), url('assets/fonts/fa-solid-900.ttf') format('truetype'), url('assets/fonts/fa-solid-900.svg#fontawesome') format('svg'); }
/* Fin FontAwesome*/
Rien à faire cela ne fonctionne toujours pas (pour le logo), j'abandonne l'idée en local.
Sinon pour les chemins que tu as indiqué c'est bon je pense.
Merci pour le code , je viens de le mettre sur github