Comment installer GKSU sur Ubuntu Bionic 18.04 LTS ?

GKSU est un utilitaire permettant de démarrer une application en mode fenêtre avec les droit administrateurs. Je l’utilise notamment avec un lanceur Xampp qui demande les droits root pour démarrer.
Après une installation fraîche de Bionic dont la mise à jour a été un peu compliquée, impossible de réinstaller cet utilitaire qui n’est désormais plus dans les dépôts. Dans les forums, on explique avec éloquence que les dépendances interdisent son installation.
Morte-couille ! Tout cela ne serait que faribole ? C’est bien ce que semble indiquer cette réponse sur Askubuntu. Évidemment, j’ai testé et la manip a parfaitement fonctionné, c’est sale j’assume, mais je partage quand même.
Continue reading “Comment installer GKSU sur Ubuntu Bionic 18.04 LTS ?”

MARP l'outil de présentation rapide évolue

MARP est un logiciel libre multi plate-formes qui permet la création rapide de présentations exportées en PDF et donc publiables très facilement en ligne ou exposée avec le mode idoine d’ evince ou autre d’Acrobat Reader. Personnellement j’ai définitivement abandonné Impress autant pour mon usage perso dans les TD de PréAO. Ainsi, je peux aborder les bases Markdown, langage de formatage  mis en œuvre par Marp. Un bon début pour faire découvrir à des littéraires le monde obscur de la “programmation”.

Après une période de sommeil, Marp évolue enfin, la dernière préversion 0.0.12 vient de sortir, elle apporte les corrections suivantes :

  • Upgrade Electron and dependent packages
  • Sanitize HTML import to avoid leak local resource
  • fix(slide): add @at-root directive to :root selector (#207)
  • Use yarn for packaging

La première version définitive est programmée pour peu, un nouveau dépôt Github a été créé pour l’occasion.

Démarrer avec MARP :

MARP est un outil à découvrir d’urgence !

Comment animer une image PNG pour une bannière

Le PNG est juste génial, c’est un format d’image libre proposant des fonctionnalités intéressantes comme la transparence, la translucidité, tout ce que propose GIF et même en mieux.

Dans ce tutoriel, je vais aborder les animations des images PNG dans le but de préparer la bannière animée d’un site Web.

Préparation : toutes vos images doivent logiquement disposer de la même dimension pour cela il faut les redimensionner ou les recadrer.

Lorsque c’est fait, rendez-vous sur le site AnimatedPNGs.com cliquez sur Parcourir et transférez vos images. Le delay est fixé à 64ms, il s’agit du temps d’affichage de chaque image. Ce délai est réservé au mini-animation, pour une bannière chaque image doit être affichée quelques secondes, on indiquera un multiple de 1000 par exemple 4000.

2018-03-09_10h18_21
Le délai peut être paramétré différemment pour chaque image :

2018-03-09_10h20_46

Enfin cliquez sur Create Generated Image puis sur Download.
Animatedpng propose d’autres services, la conversion de flash en PNG, de GIF en PNG.
Le code source est visible sur Github : https://github.com/GraFlic/GraFlic
 
 
 

Monétiser votre site avec Snipcart

Snipcart est un gestionnaire de panier prenant en charge le paiement par carte bancaire. L’inscription est gratuite, une commission de 2% est retenue sur chaque opération ce qui est modeste.

C’est une solution est idéale pour monétiser un contenu en ligne tout en évitant les grosses usines comme Prestashop.

Pour ce tutoriel, le CMS support sera l’excellent Zwii en version 8.2.5.  J’irai un peu vite sur certains aspects, le tutoriel ne s’adresse donc pas à de grands débutants.

Continue reading “Monétiser votre site avec Snipcart”

Comment ajouter un effet popup à une miniature dans Zwii CMS

Zwii un CMS maintenu par Rémi Jean son auteur, c’est un CMS en français très simple d’emploi destiné à une gamme d’utilisateur variée, de débutants à chevronnés. Les dernières versions sorties début mars 2018 apportent un lot important d’améliorations.  Une série d’articles regroupant ces astuces seront publiés sous cette catégorie.

Pour débuter, les images avec un effet popup, l’idée est de créer  un effet d’affichage lors du clic sur une miniature.
Pour les besoins de la démonstration, j’ai utilisé deux images, une taille réelle (200 pixels de large est un maximum) et une autre en miniature.
Cette démo est basée sur la version 8.2.5 dont l’éditeur de texte par défaut est TINYmce.
Une fois le CMS installé, en FTP, éditez  init.js dans core/vendor/tinymce, recherchez

templates: [
que vous remplacez par :
templates: [
        {
          title:"Image Lightbox",
          url:baseUrl+"core/vendor/tinymce/templates/lightbox.html",
          description:"Une image qui s'ouvre dans une lightbox."
        },

Sauvegardez le fichier.
Dans le dossier Templates, y copiez les fichiers lightbox.html et image_vide.png contenus dans cette archive.
C’est prêt, il n’y a plus qu’à utiliser le plugin, une vidéo valant mieux qu’une longue explication :
[youtube https://www.youtube.com/watch?v=WmgREqKg0Io&w=560&h=315]

Il est aussi possible de se passer de la miniature en réduisant la taille de l’image servant de miniature…

 
 
 
 
 
 

J'ai testé HUGO le CMS statique sans vraiment apprécier

Il existe sur le Net des pépites, de petits outils méconnus qui facilitent la vie et qui permettent de sortir des sentiers battus en variant un usage, c’est par exemple le cas de MARP qui génère des présentations très rapidement. Dans le monde des CMS, j’ai testé HUGO, un CMS statique hyper léger.

Continue reading “J'ai testé HUGO le CMS statique sans vraiment apprécier”

Comment modifier le thème dans MARP

Créer un nouveau thème sous MARP, est en réalité très compliqué et parfaitement inaccessible au commun des mortels, en aucun cas je ne peux imaginer demander à mes étudiants de suivre la procédure décrite dans ce slide.

La première raison est que ce ne sont pas des informaticiens, enfin cela irait à l’encontre de l’intérêt principal de cet outil, à savoir la rapidité et l’efficacité.

Fort heureusement, il existe une solution qui n’est pas vraiment développée dans le guide technique du logiciel et qui passe par l’insertion de styles dans la zone d’édition.

Voici un exemple de ce qui peut être fait :

<style>
.slide {
 background-color: black;
 font: 40px arial, sans-serif;
 }
.slide a {
 color: indigo;
 }
.slide h1 {
 color: fuchsia !important;
 text-align: center;
 }
.slide h2 {
 color: darkviolet;
 }
.slide p {
 color: darkorchid;
 }
</style>

Quelques explications :
. slide s’applique aux paramètres des diapositives, ici on a appliqué une police Arial de taille 40px et un arrière plan noir.
. slide a modifie la couleur des liens.
. slide h1 modifie les titres de niveau 1 (#)  !important  permet de passer outre le style défini par le thème.
.slide p applique une couleur aux paragraphes.
Pour mettre en œuvre ces styles, il  faut utiliser le style par défaut et non Gaïa.
Ces commandes s’insèrent en haut de la zone d’édition, cependant il est possible de créer un fichier externe appelé par cette commande :

<link rel="stylesheet" type="text/css" href="style.css">

Enjoy !

How to change the theme in MARP

In reality it is very complicated, in any case inaccessible to ordinary people, do not I see myself explaining to students the procedure described in this link.
Quite simply because they are not computer scientists and secondly, the interest of using MARP is precisely to be efficient, effective and fast.
On the other hand, as the description indicates, you can easily add styles at the beginning of the slideshow. And then it becomes accessible…
Here is a very short example of what can be done :

<style>
.slide {
 background-color: black;
 font: 40px arial, sans-serif;
 }
.slide a {
 color: indigo;
 }
.slide h1 {
 color: fuchsia !important;
 text-align: center;
 }
.slide h2 {
 color: darkviolet;
 }
.slide p {
 color: darkorchid;
 }
</style>

A few explanations:
. slide is about slide related settings
. slide a modifies the links
. slide h1 the titles of level 1 (#)! important clears the parameter setting set by the theme
You need to  use default theme and not Gaia to make it work.
There are two ways to do this, either integrate an external file with a link:

<link rel="stylesheet" type="text/css" href="style.css">

or include the style at the top of the page but it’s less clean.
Enjoy !

Comment faire fonctionner MARP sur Ubuntu Zesty Zapus

MARP est un générateur de diaporama basé sur Markdown, il a déjà été présenté sur ce blog, tutoriel compris.

MARP ne s’installe pas, que ce soit sous Win, Macos ou Linux, c’est un logiciel portable qui s’exécute après décompactage de l’archive.

Sauf que sous Ubuntu, il y a un problème de dépendance et que l’appli ne fonctionne pas. Dans un terminal, il suffit de cette commande pour régler le problème…

sudo apt-get install libgconf-2-4

Enjoy !