Page 1 sur 2

Comment modifier le FramaKiosk ?

Le FramaKiosk est la première interface de la FramaKey. Elle est un peu plus longue a modifier que le FramaLauncher (voir Comment modifier le FramaLauncher ?).
Tutoriel réalisé à partir de la FramaKey 1.5.0.1

1. Ajout d'une nouvelle application

Pour illustrer cet exemple on a choisi de rajouter à la Framakey l'application PortableAudacity.

1. Téléchargez PortableAudacity sur le site officiel de Portable Softs et des applications portables présentent dans la Framakey : http://fredericcombe.free.fr
Rubrique Applications Portables Francophones puis PortableAudacity, et enfin il suffit de cliquer sur la disquette bleue pour télécharger le logiciel.

2. Décompressez le dossier archivé PortableAudacity-1.3.0-beta-fr-rc1.zip ; ouvrez le ; copiez PortableAudacity et collez le dans le répertoire Apps de votre Framakey.

Voilà : vous venez de rajouter une application à votre Framakey !!!

2. Ajout de l'icône d'Audacity

Les icônes dans le FramaKiosk sont au format PNG et de taille 48x48 pixels. La PNG Factory est une bibliothèque d'icônes au format PNG et vous permettra de trouver la plupart du temps des images à votre convenance. Tapez audacity ou son ou musique ou ce que vous voudrez dans la zone de recherche et faites votre choix. Notre icône d'exemple s'appelle audacity.png.

1. Une fois téléchargée il vous faut mettre l'image à la bonne taille (48x48 pixels) tout en conservant la transparence. Gimp le fait très bien. Vous pouvez alors appliquer des filtres si l'image s'est pixellisée ou si la netteté a été flouée par le redimensionnement.

2. Enregistrez votre image dans VotreClé:\Framakey\FramaKiosk\FramaKioskPages\img\audacity.png

3. Création du fichier LCH

Le fichier LCH permet de lancer le logiciel. On le nomme généralement du nom du logiciel. Le notre s'appellera donc audacity.lch.
Allez dans VotreClé:\Framakey\FramaKiosk\FramaKioskPages\lch\

1. Ouvrez PortableSciTE et collez y ce code (provenant du fichier miranda.lch présent dans toutes les FramaKey 1.5.x.x) :

Code: Tout sélectionner: [Launch] ExecuteFile=${cwd}\..\..\..\Apps\PortableMiranda\PortableMiranda.exe

2. Modifiez le en :

Code: Tout sélectionner: [Launch] ExecuteFile=${cwd}\..\..\..\Apps\PortableAudacity\PortableAudacity.exe

3. Enregistrez votre travail sous audacity.lch

4. Modification de la page index.html

Allez à VotreClé:\Framakey\FramaKiosk\FramaKioskPages\ et ouvrez le fichier index.html avec SciTE. Descendez dans corps de page et copiez le code suivant (présent dans toutes les FramaKey 1.5.x.x) :

Code: Tout sélectionner: <tr> <td style="width: 54px; text-align: center;"><a href="lch/miranda.lch" title="Messagerie Instantanée (MSN/Yahoo! Messenger/AIM/ICQ/IRC"><img src="img/miranda.png" width="48px" height="48px" alt="Miranda" /></a></td> <td style="width: 179px; text-align: left;"><h2><a href="infos.html#[[Miranda]]" title="Messagerie Instantanée (MSN/Yahoo! Messenger/AIM/ICQ/IRC">Miranda</a></h2><p>Messagerie Instantanée</p></td>

Maintenant collez le après la dernière balise </tr> et avant la balise </body>
Ensuite il faut le modifier de telle façon qu'il lance Audacity. On procédera dans le sens de lecture.

1. <a href="lch/miranda.lch" title="Messagerie Instantanée (MSN/Yahoo! Messenger/AIM/ICQ/IRC">
Modifiez le nom du fichier LCH en lch/audacity.lch et la description (Messagerie Instantannée (MSN/........)) par la description que vous souhaitez (il faut impérativement conserver les guillemets).

2. <img src="img/miranda.png" width="48px" height="48px" alt="Miranda" />
Modifiez le nom de l'icône en img/audacity.png et le nom du logiciel en Audacity.

3. <a href="infos.html#[[Miranda]]" title="Messagerie Instantanée (MSN/Yahoo! Messenger/AIM/ICQ/IRC">Miranda</a>
Remplacez infos.html#[[Miranda]] par lch/audacity.lch et modifiez ou supprimez une fois de plus la description. Ensuite changez le nom du logiciel en Audacity.

4. <p>Messagerie Instantanée</p>
Ca c'est le sous-titre. Modifiez le en <p>Edition audio</p>.

5. Enregistrez votre travail. A la prochaine ouverture du FramaKiosk l'icône d'Audacity sera apparue.

5. Encore quelques mots

Les icônes sont alignées par 2 dans le FramaKiosk. Pour ajouter une autre icône à côté de celle que vous venez de créer, placez ce code en dessous :

Code: Tout sélectionner: <td style="width: 104px;"></td> <td style="width: 54px; text-align: center;"><a href="lch/vlc.lch" title="Lancer VLC"><img src="img/aktion.png" width="48px" height="48px" alt="VLC" /></a></td> <td style="width: 179px; text-align: left;"><h2><a href="infos.html#VideoLAN" title="Informations sur VLC">VLC</a></h2><p>Lecteur vidéo</p></td> </tr>

Modifiez le de la même manière que précédemment sans toucher à <td style="width: 104px;"></td>. La balise </tr> ferme la ligne.

Utilisation des png de PNG Factory

Aucune utilisation à des fins commerciales n'est autorisée par les auteurs sauf indications contraires, que ce soit de façon directe ou indirecte.
Sont donc à proscrire :

- L'utilisation des images au sein d'interface logiciel

c'est pas embêtant ?

Suite du tutoriel ici : http://forum.framasoft.org/viewtopic.ph ... 433#106433

Merci encore à detruc pour son tuto (acceptes tu de le placer sous licence GFDL ou CC by-sa afin qu'on puisse le reprendre sur le site FramaKey ?)

@pyg : Ca ne me dérange pas du tout (je suis pas trop calé en licences). J'ai écrit ces tutos (au fait : bravo pour la suite !!! j'ai toujours utilisé une méthode beaucoup plus compliquée) dans le but qu'ils soient utiles et utilisés. Tu en fait ce que tu veux (précise juste l'auteur si ça te dérange pas stp).

Comme je l'ai déjà dit dans Customiser le FramaLauncher si vous voulez que j'en écrive d'autres il n'ya pas de problèmes.

Pour la licence (tout bien réfléchi et après avoir lu des traductions :wink:

) je pencherais pour la GFDL. L'optimal se serait de regrouper tous les tutos sous la même licence, non ? Et de les incrémenter dans la FramaKey dans une rubrique aide ou qqchose dans le genre. Enfin... c'est mon opinion. Après c'est à l'équipe de voir.

acepack a écrit:Utilisation des png de PNG Factory

Aucune utilisation à des fins commerciales n'est autorisée par les auteurs sauf indications contraires, que ce soit de façon directe ou indirecte.
Sont donc à proscrire :

- L'utilisation des images au sein d'interface logiciel

c'est pas embêtant ?

Je ne crois pas. Tant que tu ne redisdribues pas la FramaKey, en tous cas. On reste bien dans le cadre de "l'utilisation personelle" nan ? Après il y d'autres endroits pour trouver des icônes. C'est toi qui voit, selon tes besoins.

Merci pour ces tutos,
Je suis tout à fait d'avis qu'ils soient par suite copiés sur le site framakey.org, et inclus dans le FramaKiosk de la version 1.5.2 (pas la 1.5.1, qui sera la version finale après la release candidate actuelle).
Qu'en pensez-vous ?

Salut sarkos

Pour l'intégration sur FramaKey.org et dans une FramaKey, on est en train dans discuter avec pyg (2 posts plus haut) !!!

Oui, j'ai vu :wink:

Bonjours,

J'ai quelques problèmes avec l'étape 2. Ajout de l'icône d'Audacity

J'ai eu de la difficulté pour trouver comment changer la taille en 48x48 pour Sunbird, voici la méthode pour les néophytes de Gimp :

Bon mon problème reste que je n'ai pas trouvé comment mettre la transparence

je suis bloqué à (si quelqu'un peut m'aider)

Serait-il possible de mettre les icones déjà modifiés en 48 x 48 avec format invisible dans les applications individuelles?

Si vous voulez améliorer votre tutoriel, il faudrait aussi mettre un lien vers le téléchargement de PortableGimp et expliquer comment faire les modifications de A à Z avec Gimp. Sinon, je n'ai rien à dire sur cette aide qui m'a été très utile.

Merci à l'équipe FramaKey

Bonjour

Je n'ai pas donné de méthode particulière avec Gimp pour que chacun reste libre d'utiliser son logiciel préféré. Je vais réparer ici cette erreur en donnant 2 méthodes (PortableGimp ou PortablePaint.NET).

PortableGimp

D'abord il faut le télécharger ici : http://www.framakey.org rubrique Applications Individuelles.

Pour redimensionner l'image :

- Ouvrez Gimp (un panneau avec des outils s'affiche)
- Ouvrez l'image
- Allez dans l'onglet Image
- Choisir Échelle et taille de l'image
- Modifiez la largeur et la hauteur à 48 pixels
- Cliquez sur Échelle
- Sauvegardez

Pour appliquer la transparence :

!!! La transparence est déjà appliqué si vous voyez un quadrillage gris et blanc (ou gris plus clair) derrière l'image (pour les néophytes et ceux qui auraient oublié).

- Ouvrez Gimp (si nécessaire) puis l'image
- Dans le panneau d'outils (celui qui est hors du cadre de l'image) sélectionnez l'outil Baguette magique.
- Cliquez avec la baguette sur le fond de l'image.
- Déplacez les pixels sélectionnez : le quadrillage apparaît.
- Vous avez appliqué la transparence !!!
- Sauvegardez.

PortablePaint.NET

D'abord il faut le télécharger ici : http://www.framakey.org rubrique Applications Individuelles.

Pour redimensionner l'image :

- Ouvrez Paint.NET
- Ouvrez l'image (on peut aussi l'ouvrir par glisser-déposer)
- Allez dans l'onglet Image
- Choisir Redimensionner
- Modifiez la largeur et la hauteur à 48 pixels (si vous cochez Conserver les proportions, ne changez que la largeur ::> la hauteur se reconfigurera automatiquement)
- Cliquez sur OK
- Sauvegardez

Pour appliquer la transparence :

!!! La transparence est déjà appliqué si vous voyez un quadrillage gris et blanc (ou gris plus clair) derrière l'image (pour les néophytes et ceux qui auraient oublié).

- Ouvrez Paint.NET (si nécessaire) puis l'image
- Dans le panneau d'outils sélectionnez l'outil Baguette magique.
- Cliquez avec la baguette sur le fond de l'image.
- Déplacez les pixels sélectionnez : le quadrillage apparaît.
- Vous avez appliqué la transparence !!!
- Sauvegardez.

En espérant avoir été clair,
detruc

Page 1 sur 21, 2 Suivant[Tutoriel] Customiser FramaKiosk

Qui est en ligne ?

Se connecter

Page 1 sur 21, 2 Suivant[Tutoriel] Customiser FramaKiosk

Qui est en ligne ?