Urbanbike

Index |
ou détaillée | Fil RSS | ATOM

À quoi sert Web Capture Template dans Draftsapp

macOS et iOS

dans drafts | écrire

Gaffe ! : très (trop) long billet qui n’intéressera qu’une ou deux personnes (ou personne)…

J’ai évoqué récemment l’extension Obsidian Web Clipper proposée par Obsidian pour Safari (…lire Collecter des pages de la toile…) et Web Capture Template propre à Drafts.
J’avais conclu par ce billet par un… « je pense revenir aux seuls extraits capturés avec Web Capture Template de Drafts…! »
C’est fait même si j’ai apprécié les fonctions sophistiquées de Obsidian Web Clipper.

Retour à Drafts et sa fonction Web Capture Template…

Avertissement : j’aime explorer d’autres outils, solutions.
C’est en mettant les doigts dans le balisage markdown que j’ai carrément opté pour ce dernier malgré mon très lourd passé avec Word, FrameMaker et InDesign.

Je reviens donc sur la collecte sur le web de textes via Drafts même si ce n’est pas la première fois1 que je l’évoque.
(rappel : je suis vieux et je radote !)…

Pourquoi…? La rusticité apparente de Drafts s’avère irremplaçable de simplicité à l’usage et convient à mes besoins modestes…!

Un seul modèle

Revenons sur le modèle du Web Capture Template dans Drafts.
Un seul — contrairement à Obsidian — mais qui se déploie illico comme tous les éléments de Drafts (des scripts aux barres additionnelles…) sur iOS et macOS.

Inutile de faire les mêmes réglages sur tous les écrans où Drafts est utilisé (…si je corrige un élément sur mon iPhone, il est répercuté sur iPad et MacBook)…

Pour préparer mes billets Nazbrokology2 (entre autres), la capture automatique des éléments d’une page internet est disponible : à moi de les disposer dans ce modèle selon mes besoins/envies et dans l’ordre souhaité (c’est du texte que vous pouvez agencer et baliser en markdown selon vos désidératas)…

  • La date de la capture (dans le format que je souhaite)
  • Du titre de l’article
  • De l’URL (…que je peux associer avec le titre, CQFD)
  • Un extrait (de taille variable, à moi de couper/concaténer ultérieurement)
  • Une première mise en forme par le biais du balisage markdown qui s’appuie sur le HTML de la sélection de texte capturée.
  • Sans oublier un tag pour regrouper automatiquement ces entrées dans un Workspace dédié dans Drafts

reduc-450

J’ai bricolé mon modèle ainsi (…avec un mini changement cosmétique en utilisant une balise markdown de niveau 3 par rapport à ce précédent billet)

Créer une page cible

Comme je suis de plus en plus paresseux (et au lieu de réaliser un Merge des infos collectées individuellement pour assembler au final mes pages un nouveau Paul-Eu-Gazette), je crée une entrée dans Drafts

C’est elle qui va servir de réceptacle, de cible pour recevoir les captures des pages Web au fur et à mesure de mes lectures.

Pour illustrer mon propos, j’ajoute un titre (…d’une originalité folle, je vous l’accorde…!) en haut du document…
## Paul-Eu-Gazette
Histoire de l’identifier.

Passer à la collecte sous macOS…

Une série de copies d’écran sous iOS conclut ce billet…

Sous macOS, dans Safari et au fil de mes lectures — et/ou en utilisant en amont News Explorer et mes (trop) nombreux fils RSS —, je passe de site en site, du lemonde.fr, courrierinternational.com à mediapart.fr, etc.

En parcourant ces pages, articles, billets, je tombe sur une information qui m’interpelle et que je souhaite collecter…

Je sélectionne la partie du texte que je souhaite retenir, conserver… Puis, la page web dans Safari avec le texte sélectionné à l’écran, via le menu Partage (l’icône carrée avec une flèche vers le haut), j’appelle… Drafts (je n’illustre pas cette étape basique) dans la liste déroulante…

reduc-450

Drafts affiche une fenêtre survolant Safari avec tous les éléments définis de mon modèle (voir plus haut…!), dont ma sélection de texte basculée en markdown…

Sauvegarder la sélection ou l’ajouter…?!

En pied de cette fenêtre créée par Drafts, une série d’options.

À droite, Cancel, Copy, Open et Save qui peut créer une nouvelle page qui ira se glisser dans Drafts… Et, en dessous, une flèche qui pointe vers le bas, retenez là…!)…
À gauche trois infos un poil dispersées…

  • Le rappel du style de la page (ici, du markdown)
  • Le type d’action qui sera employé : Save as New Draft (la capture sera enregistrée comme un nouveau document)
  • Où…? Dans Inbox ou Archive…

Pas de panique, c’est très logique…!!

  1. Si vous souhaitez créer simplement une nouvelle page, Drafts vous propose de la classer dans les dernières infos (Inbox) ou de la glisser dans Archives (pour mémoire)… Appuyez alors sur Save
  2. Or l’objectif est d’ajouter le contenu affiché de la fenêtre dans une page existante (…celle que j’ai nommée… Paul-Eu-Gazette)

C’est ici où la toute petite icône flèche qui pointe vers le bas (celle sous le bouton Save) est clé…!! On appuie dessus…

reduc-450

La fenêtre en survol au-dessus de la page Web (qui attend patiemment le temps nécessaire, pas d’angoisse…) s’est agrandie vers le bas…!
Et affiche la liste d’entrées de Drafts…

reduc-450

Charge à vous de retrouver la page souhaitée… Je cherche le titre de ma page de collecte en faisant défiler les entrées affichées et la sélectionne…

reduc-450

C’est le moment de lire les indications de la fenêtre flottante qui affichent de nouvelles informations pratiques. Elles confirment que…

  • J’ai bien sélectionné une page cible nommée Paul-Eu-Gazette…
  • Que Drafts vous propose d’ajouter le contenu de la fenêtre au début de la page cible (Start of) ou à la suite (End of) comme je le souhaite…
  • Et Save s’est mué en Append (ajouter/joindre…)

reduc-450

En résumé : la page cible (qui va recevoir l’info) est affichée dans la fenêtre, l’option End of activé, plus qu’à appuyer sur … Append…!

Drafts ferme la fenêtre et vous pouvez continuer votre collecte de news dans Safari…
Chaque nouvel extrait va s’ajouter à la fin de la page cible

reduc-450

Et, à chaque fois, Drafts appliquera le modèle de la Web Capture Template à la sélection de texte, c’est à dire : date, titre et URL, CQFD. Comme ce modèle est balisé en markdown, la mise en forme des infos est rigoureusement identique…

C’est pourquoi j’insiste : n’hésitez pas à perdre du temps, tester, modifier les balises markdown pour trouver le modèle de mise en forme que vous souhaitez… De facto, vous ne perdez pas de temps, vous allez en gagner si vous êtes bien organisé, pensez mise en pages automatisée.

Je reconnais que l’interface de Drafts est assez déroutant, rustique mais monstrueusement logique…! Je l’apprécie car elle ne propose rien de purement cosmétique, c’est simplement efficace…!

Et sous iOS…?

Mêmes opérations mais l’interface est nettement plus agréable et condensée (à mon sens)…

reduc-450

Sélection du texte dans la page…

reduc-450

Appel de Web Capture Template de Drafts…

reduc-450

Possibilité de sauvegarder individuellement…

reduc-450

Ou choix d’une page cible (voire d’en créer une). Je précise que lors des opérations suivantes, Drafts vous proposera la même disposition par défaut… [Edit] Il vous faudra impérativement sélectionner à nouveau la page cible mais elle est affichée en première position dans le menu…

reduc-450

Avant ou après ?
End of, CQFD (et la page cible s’affiche à côté) Et ce réglage sera également conservé pour les prochaines captures

reduc-450

Hop…! Dans Drafts la dernière capture est bien en fin de document…
Au suivant…!

Attention : le balisage markdown interprété du HTML est parfois à corriger mais c’est minime…

Voilà, à vous de jouer…!


  1. En 2021… Un seul outil… Drafts | mode d’emploi | 1. En 2016… Usages | Append sur Drafts ou lister dans Copied ? ↩︎

  2. Ces Paul-Eu-Gazette, une réflexion de 2006 qui s’est concrétisée en 2021…! ↩︎

le 02/03/2025 à 08:30 | .(JavaScript doit être activé pour visualiser cette adresse email) à JChris d'Urbanbike | #

Widgets, iPhone, listes et Draftsapp

À portée de doigts…

dans drafts | écrire

[…] Liste des entrées à propos de Drafts […]

Attention, billet long (trop…!)

Contexte : les quelques personnes qui fréquentent ce blog sont assurément saoulées de lire des billets sur Drafts mais je n’ai pas trouvé mieux pour mon quotidien, tant sur iPhone et iPad que sur MacBook.

L’un des multiples points forts de Drafts réside dans ses nombreuses instructions, balises, tags dont on peut user et abuser…

Récemment, j’ai redécouvert — avec un ou deux trains de retard — que la gestion des Widgets s’était encore améliorée.

Je l’avais évoquée il y’a quelques mois ici…!

Étant au calme ces dernières semaines (…ça ne va pas durer…!), j’en ai profité pour revisiter mes outils dont ce blog ou mon profil mastodon.

Des listes et des cases à cocher…

J’avais réinstallé l’an passé Things qui reste une application épatante mais bien trop sophistiquée pour mes activités. J’ai également testé longuement Rappels (l’app d’Apple), une autre application système bien foutue…

Sauf que mes besoins sont basiques, tristement basiques : contrairement à Léon Muffle, je n’ai pas dix boites à gérer simultanément, un état profond à saccager. Juste besoin de dresser une liste de courses et une autre de trucs à réaliser un de ces quatre…

iOS 18 permet de superposer dans une même pile plusieurs widgets.

Comme Drafts est l’application que j’emploie quasiment pour tout, j’ai pris le parti sur mon iPhone d’exploiter mieux les widgets et d’opter ici pour la taille plus imposante sur mon fidèle iPhone 15 Max (et virer, au passage, quelques apps qui s’avèrent désormais inutiles).

En résumé : j’ai tâtonné, essayé plusieurs solutions puis, en rédigeant les premières lignes de ce billet, je me suis décidé à aller au bout de mon idée et, de facto, recomposer mes deux piles de Widgets…!

reduc-450

Dans un premier temps, j’ai conservé ma grille d’actions (ci-dessus) mais me suis décidé à octroyer nettement plus de place à mes listes sur un autre écran du iPhone…

reduc-450

Ce qui précède correspond à la liste qui suit quand elle est ouverte dans Drafts.

Car, à l’usage, il s’avère que c’est très pratique qu’elle apparaisse même réduite dans un widget…

reduc-450

Comme l’on peut superposer dans une pile plusieurs Widgets, j’ai également ajouté mon pense-bête des courses à effectuer… La taille intermédiaire de Widget était juste : là, je respire…

reduc-450

La liste originale dans Drafts avec ses 244 articles (je l’ai écrit, c’est une liste de courses pense-bête : je la déroule pour noter ce qui est à reprendre…!)…

reduc-450

Pour les distinguer, j’emploie des thèmes differents, l’accès aux réglages de chaque widget se fait via ce menu…

reduc-450

Via… Modifier Drafts…

reduc-450

On accède alors à quelques réglages clés qui vont du choix de la page de référence ; est-il nécessaire d’afficher le titre ; d’afficher toutes les tâches ; d’employer la bascule jour/nuit pour changer l’affichage (oui dans mon cas) ; et deux dernières options (l’un est masquée) pour le choix du thème jour et du thème nuit…
Vous avez noté que l’on peut choisir la taille du texte dans ce widget (trois options)

J’en étais à ce stade quand j’ai pris la décision d’ajouter dans cette pile de grands widgets lié à Drafts ma grille (cf. première copie d’écran)…

reduc-450

Un widget grille spécifique à Drafts et de 16 cases, CQFD…

reduc-450

Reste à rétribuer à chaque case une action via la recherche…
À déplacer ensuite verticalement les actions pour les répartir/organiser selon nos besoins…

reduc-450

Puis à choisir les thèmes souhaités (et même employer la couleur de l’icône associée à chaque action)…

reduc-450

Premier jet…

Je passe d’un widget à un autre par un glissement du doigt sur l’écran…

reduc-450

…dans la fenêtre de la pile…

reduc-450

Après un dernier ajustement (…dans le choix des thèmes) et un ultime déplacement d’une action dans la grille, j’ai supprimé ma grille initiale de 8 actions (celle de la première copie d’écran de ce billet…).

La pile initiale est désormais dédiée au informations météo…! Ici avec l’excellent Looks Like Rain…

reduc-450

C’est tout…!

Nb : les Widgets de Drafts recèlent de fonctions puissantes que j’aborderais (ou pas…) une autre fois…!

[Edit] Pour finir, j’ai ajouté un dernier Widget dans cette pile. Il me permet dans un Workspace dédié (ici Puzzle pour collecter quelques extraits d’articles) de simplement lister les dernières entrées, histoire de vérifier si je n’ai pas oublié une info dans le cadre des …Paul-Eu-Gazette (…inutile d’ajouter que, dans la dystopie ambiante, les infos les plus givrées se succèdent…)

reduc-450

Cette option permet de visualiser les nouveaux drafts… Mais en appuyant sur une ligne, j’accède instantanément au brouillon en question…

le 11/02/2025 à 21:40 | .(JavaScript doit être activé pour visualiser cette adresse email) à JChris d'Urbanbike | #

Smartphone et prise de notes

Drafts : un point c’est tout !

dans drafts | écrire | usages

[Billet corrigé et réédité…!] Court1 billet (au début…) écrit à l’arrache pour exposer pourquoi je suis devenu …un iPhonographe (…dixit Laurent Chemla qui nous invite à actualiser des mots anciens dont… Phonographe !)

Prise de notes…?

C’est quasiment l’une des principales fonctions — avec la prise de vues — de mon smartphone…

Si notre fils est un inconditionnel des Post’it, ma compagne d’Apple Notes, si notre fille se fie principalement à sa mémoire (hypermnésie), ce n’est pas mon cas…
J’emploie Drafts sur mon iPhone… un point c’est tout !

Comme ce dernier est mon principal compagnon, j’ai opté depuis plus d’une décennie pour cette app2. J’ai utilisé un grand nombre d’apps, de l’épatant Day One (…toujours en service et que je devrais évoquer à nouveau) à Ulysses en passant par ia Writer et Obsidian.
Je ne cite que les apps encore sur mon écran…

Comme mon iPhone est toujours à portée de ma main, je le dégaine pour capturer une scène, répondre à un message, régler mes courses, écouter un podcast en marchant.
Ou écrire une note.

En effet, depuis iOS 18, Drafts (mais aussi Apple Notes, etc.) m’offre un accès à mes documents depuis l’écran verrouillé.

Illustration…

Ça nécessite de faire un tour dans les entrailles d’iOS pour rendre l’accès instantané…!
Déjà atteindre le mode concentration3 en usage au quotidien —

reduc-450

  • puis remplacer un ou deux widgets de l’écran verrouillé par ceux de Drafts… Ci-dessous, le choix des actions (ou pages) à ouvrir : un appui permet de faire défiler leur liste…!!

reduc-450

reduc-450

  • on peut conserver l’arrière-plan de l’icône ou disposer d’un fond transparents (mon choix…!)…

reduc-450

En résumé… si la météo reste un élément essentiel, j’ai remplacé deux widgets4 par deux boutons liés à Drafts : l’ouverture du dernier document consulté et la création d’une nouvelle note horodatée.

Interface caméléon

Avertissement : je ne vais pas (!!) rédiger une description élogieuse de ce traitement de texte markdown, évoquer à nouveau ses épatantes barres additionnelles entièrement personnalisables, synchronisées de surcroît entre iPhone, iPad et Macintosh, etc.

Je reviens juste à l’objet du billet : la prise de notes immédiate sans perte de temps.

En effet… de quoi ai-je réellement besoin au quotidien ?

  • D’accéder instantanément à la note en cours (comme cette ébauche de billet)
  • De créer une nouvelle note horodatée et taguée (comprendre : disposant de mots clés pour la ranger et retrouver)

Utiliser l’une ou l’autre action lance de facto Drafts et, une fois ce dernier à l’écran, je peux l’utiliser sans restriction…

Toutes les copies d’écrans ad hoc ont été déplacées à la fin de ce qui était encore un bref billet (ourafffff…!) hier…!

Sur le document affiché sur l’iPhone, l’écran dispose de nombreuses options souvent négligées5 appelées par un simple appui prolongé sur les icônes.

Chaque icône dispose d’un panel d’options qui multiplient d’autres manières de procéder !

Ce foisonnement d’options redondantes peut intriguer — …voire inquiéter6…! — mais, paradoxalement, c’est l’une des grandes richesses de Drafts en comparaison d’autres traitements de texte où l’emplacement d’une action est définie par l’équipe de développeurs.

Quand on emploie Drafts dans ses trois environnements possibles : mon usage sur iPhone (écran en mode portrait) est différent de celui sur mon iPad Mini (écran en mode paysage) ou encore sur Mac (où l’on peut aisément recourir aux équivalents clavier), ça change la donne.

Bref, pour conclure (et revenir à mon sujet) : Drafts est le meilleur outil à mes yeux pour la prise de notes ou la rédaction d’un billet !
Oui, je suis de parti pris…!

Illustrations…

Je me suis décidé à regrouper les autres copies d’écran (sic !) à la fin pour vous inciter à explorer l’interface de Drafts !

reduc-450

  • Ces deux premières copies d’écran montrent ce qu’était ce billet dans Drafts avant mon opération chamboule tout…! Avec les notes de bas de page regroupées… Lire Footnotes markdown : imbriquées ou non ?

reduc-450

  • Si je fais glisser mon doigt de droite à gauche, j’affiche un panneau des scripts (exports vers Day One, Mastodon, Ulysses dans mon cas…). Mais explorons le contenu des icônes disposées en haut en en bas (comprendre …quand le clavier est masqué, disparaît…!)

reduc-450

reduc-450

reduc-450

  • Pas inintéressant d’afficher tous les tags (que j’ai créés)… Ou de visualiser le mode plan du document markdown affiché…

reduc-450

  • d’accéder aux options de recherche : actions/scripts, mot clés dans le texte. Ou recherche/remplacement…?

reduc-450

  • En bas d’écran, Drafts vous propose d’autres actions qui parfois chevauchent les précédentes… J’apprécie de pouvoir accéder à la même action par diverses voies…

reduc-450

  • Celle-ci est particulièrement astucieuse car elle permet d’afficher sur l’écran verrouillé une note de référence, un pense-bête, un document en cours…! Je vais y revenir à la fin de ce billet…!

reduc-450

  • Cette autre icône permet d’accéder à la structure du document, aux paragraphes et de modifier leur positionnement par simple déplacement du doigt sur l’écran (ou via les flèches)… Illustration…!

reduc-450

reduc-450

  • Par sécurité dans Drafts, les liens ne sont pas actifs dans le corps du texte mais cette icône permet soit de les rendre actifs, soit de les lister …et d’y accéder…

reduc-450

  • Ici, accès au comptage du nombre de signes, basculement vers une interface sombre, etc.

reduc-450

  • Rappel : certaines fonctionnalités ne sont disponibles qu’en mode Pro …dont l’accès au catalogue largement garni de scripts et actions, thèmes, barres additionnelles spécialisées réalisées par d’autres utilisateurs…

reduc-450

  • Et quid du panneau de gauche…? Si je fais glisser mon doigt de gauche à droite, j’affiche le panneau de mes documents triés comme le souhaite (ici du plus récent au plus ancien) et par tags… Deux copies d’écan à la suite pour illustrer : panneau en cours, panneau puzzle, tout ceci à votre discretion…

reduc-450

  • Si je fais glisser une seconde fois mon doigt de gauche à droite, j’accède alors à la liste des tags et peux choisir de n’afficher que ceux répondant à mes choix…

reduc-450

reduc-450

Bref, sans naviguer dans des menus et sous-menus, Drafts nous offre un accès instantané à des fonctionnalités qui me sont indispensables (…plus j’avance dans ce billet, plus l’idée de pondre un mini mode d’emploi me titille…!!)

Il me semble que j’ai évoqué naguère dans urbanbike ces deux dernières options de part et d’autre du clavier…

  • Accès au panneau des scripts (panneau de droite).
  • Accès aux diverses (innombrables chez moi…!) barres additionnelles…

reduc-450

Pour finir, même si déjà abordés dans le billet… Ajout de fonctionnalités inattendues ou dans iPhone, iOS 18 et centre de contrôle, les widgets…

reduc-450

  • Deux types existent (et dans divers formats)

reduc-450

Je reviens sur la note sur écran verrouillé…
L’icône en bas à droite est bien activée…

reduc-450

  • Les premières lignes du document apparaissent… Un appui et ce dernier s’ouvre intégralement dans Drafts…

reduc-450

  • D’ailleurs, autant l’utiliser comme rappel d’un truc à faire ce matin après publication de ce billet…!

reduc-450

Voilà une bonne partie des raisons qui expliquent pourquoi j’emploie Drafts depuis 12 ans…
App dont j’ai suivi le développement régulier, les diverses versions et même le changement d’architecture (sans aucune perte de données) et je me doute que Greg ne va pas s’arrêter en si bon chemin…!

J’ai failli oublier de renseigner le lien vers le site de Drafts : getdrafts.com…

Bonne exploration…


  1. Heu, non ! Comme à mon habitude, j’ai un chouïa dérivé… ↩︎

  2. Un nouvel utilisateur de Drafts écrit… It’s like a “Swiss Army knife” for note-taking, c’est bien vu… Je viens de vérifier : juin 2012 pour ma part… ↩︎

  3. Lire Mode concentration et widgets photo, Et le 15 Max Pro débarqua… | 2, iPhone 15 Max Pro …toujours à l’écran… ↩︎

  4. Précédemment, l’indice UV (qui n’est plus de saison) et l’accès à une app photo supplémentaire. ↩︎

  5. il faut explorer patiemment puis faire siennes celles qui nous semblent les plus efficaces pour nos usages, mettre Drafts à nos doigts avec ses nombreuses voies d’accès aux mêmes fonctions ! Chaque utilisateur de Drafts est unique ne fusse que par les actions embarquées et méticuleusement choisies, les barres additionnelles (…il faut que je nettoie les miennes car j’ai tendance à tester, accumuler et ne pas supprimer !), le thème choisi avec la couleur de fond de page et des boutons, la typographie, le format de balisage, etc. ↩︎

  6. Non, ce n’est pas une usine à gaz mais un mécano que vous pouvez adapter à vos besoins (si, si…!)… ↩︎

le 03/12/2024 à 10:30 | .(JavaScript doit être activé pour visualiser cette adresse email) à JChris d'Urbanbike | #