Développer plus vite en personnalisant des raccourcis clavier Webflow

Documentation
June 20, 2022
1 min
Logo Webflow et Flowbase avec un aperçu de la fonctionnalité de raccourcis claviers personnalisés
Points clés de l'article

Développer un projet dans Webflow peut être long. Ajouter de nouveaux div, ajouter un heading, puis un paragraphe, etc. Il y a tant de petites manipulations qui nous prennent un peu de temps, mais qui cumulées allongent le temps de développement.

Aujourd’hui, nous allons voir comment, grâce à l’extension Flowbase, optimiser votre temps de développement dans Webflow grâce aux raccourcis clavier.

Les raccourcis clavier de base de Webflow

Nous avons déjà écrit un article avec une liste d’une dizaine de raccourcis clavier qui vous permettront de créer plus vite sur Webflow.

Dans cette liste, nous parlons notamment des raccourcis pour ajouter des éléments (Ctrl ou Cmd + E) ou encore pour publier (Maj + enter)

Créer ses propres Shortcuts Webflow

L’extension Flowbase est une extension chrome qui aide au développement dans Webflow. Grâce à ce plugin, il est notamment possible d’importer une palette de couleur depuis Figma ou encore de compresser ses images dans Webflow (maintenant possible nativement).

Une nouvelle fonctionnalité permet maintenant de créer ses propres raccourcis clavier. Pour se faire, il faut :

  • Se rendre dans son projet Webflow
  • Cliquer sur l’extension Flowbase
  • Cliquer sur Tool belt
  • Cliquer sur Shortcuts Manager
  • Activer la fonctionnalité Shortcuts
  • Définir vos propres raccourcis clavier

A l’heure actuelle, il existe un nombre de raccourci limité :

  • Ajouter une section
  • Insérer un div block
  • Ajouter un container
  • Insérer un heading
  • Ajouter un paragraphe
  • Insérer un bouton
  • Publier le site / le projet Webflow
  • Ouvrir l’extension Flowbase
raccourcis clavier Webflow personnalisé : Flowbase extension

Vous pouvez cependant définir des touches particulières pour réaliser ces actions.

Dans le futur, la liste des options sera probablement plus longue, mais grâce à cette fonctionnalité, vous pouvez d’ores et déjà améliorer votre productivité de développeur Webflow.

Pour plus de tips, tutos et conseils dans Webflow, vous pouvez retrouver notre blog et notre chaîne YouTube. Si vous souhaitez avoir un site qui génère des leads, vous pouvez voir notre offre de développement Webflow.

Thibaut Legrand
Thibaut Legrand
Technical Solutions Architect & Webflow Expert

Articles qui devraient vous intéresser

A woman speaks on stage at a conference, wearing a headset microphone. Behind her, a large black screen displays the question “What then?” in bold white text.
Evénements
Webflow

Digidop participe à la FLOWconf 2025, le plus grand événement Webflow & marketing d’Europe.

Digidop participe à la FLOWconf 2025, le plus grand événement Webflow & marketing d’Europe.
Aperçu visuel de plusieurs typographies modernes utilisées sur le web en 2025, chacune présentée sur une image de fond inspirante : Editorial New, DM Serif Display, Aeonik, SF Pro Rounded, Rader, Champ, Monument, Canicule, Clash Display, Supply, Agrandir, et d’autres — une composition graphique mettant en avant la diversité typographique.
Documentation
Design

Les 20 meilleures typographies pour un site web moderne et impactant en 2025

Les 20 meilleures typographies pour un site web moderne et impactant en 2025
Mosaic of homepage designs from several Webflow agencies (Digidop, N4, Refokus, Flow Ninja, Tonik, Finsweet, Edgar Allan), showcasing diverse creative approaches and visual identities centered around the Webflow logo.
Storytelling
Webflow

Mon top 7 des meilleures agences Webflow en 2025 (avis d’un fondateur d’agence)

Mon top 7 des meilleures agences Webflow en 2025 (avis d’un fondateur d’agence)

Transformez votre site web en un moteur de croissance.

Nous contacter