Il y a de nombreuses raisons pour lesquelles vous pourriez vouloir utiliser un script de calendrier sur votre site web. La plus courante est la liste et la programmation d’événements. Une autre utilisation serait de fournir un lien pour lister tous les billets de blog ou les événements d’actualité publiés un jour donné. Dans certains cas, vous pouvez simplement rechercher un sélecteur de date et de plage horaire.

En gardant tous ces cas d’utilisation à l’esprit, j’ai créé cette liste de quelques-uns des scripts de calendrier JavaScript les plus populaires disponibles sur CodeCanyon. Ces scripts offrent de nombreuses fonctionnalités pour un prix modique. Et si vous achetez l’un d’eux, vous bénéficiez également de mises à jour gratuites à vie et de six mois d’assistance gratuite pour vous aider à démarrer.

Dans ce billet, je vais partager quelques unes de mes sélections pour les meilleurs scripts et plugins de calendrier JavaScript de 2020.

Simple Events Calendar

Les meilleurs calendrier javascript de 2020

La première chose que vous remarquerez à propos de ce plugin est son design très simple mais attrayant. Tous les jours d’un mois sont affichés en haut avec une petite police pour économiser de l’espace, et la date sélectionnée est affichée avec une police plus grande.

Les événements pour la date sélectionnée sont affichés en bas. Les utilisateurs peuvent trier les événements en fonction de leur heure, de leur titre ou de leur priorité. Tous les jours auxquels un événement est associé sont marqués d’une flèche afin que vous puissiez facilement voir quels jours sont actuellement vides et établir votre calendrier en conséquence.

Vous pouvez créer des événements récurrents avec ce script. Cela signifie que vous pouvez facilement ajouter des événements qui se répètent chaque semaine, chaque mois ou chaque année.

Le script vous donne également accès à certaines méthodes et à des rappels d’événements pour étendre la fonctionnalité du calendrier ou pour vous aider à l’intégrer au reste de votre site web.

Vous pouvez essayer toutes les fonctionnalités du plugin sur la page de démonstration, qui fournit également un guide d’installation rapide.

DZS jQuery Mini Events Calendar

Le plugin DZS jQuery Mini Events Calendar serait le choix idéal pour vous si vous recherchez un script de calendrier en JavaScript qui s’affiche bien sur toutes les tailles d’écran et est doté de nombreuses fonctionnalités.

Les meilleurs calendrier javascript de 2020

Il est facile à mettre en place et est accompagné d’une documentation détaillée pour vous aider en cas de blocage. Il est également très personnalisable et facile à référencer.

Il existe une variété de modes et de skins que vous pouvez utiliser en fonction de vos besoins. Certains événements que vous marquez sur un calendrier seront plus importants que d’autres. Vous pouvez facilement différencier les événements importants des événements réguliers grâce à la balise important. Le plugin affiche les événements importants avec une couleur rouge et les événements réguliers avec une couleur bleue.

Un autre plugin appelé DZS tooltips plugin est déjà intégré à ce script pour offrir une meilleure expérience à l’utilisateur. Les infobulles que vous créez peuvent contenir du HTML, ce qui les rend très puissantes et flexibles. Vous pourrez ajouter n’importe quel type de contenu (même des vidéos) dans les infobulles.

Il existe trois apparences différentes pour ce calendrier, appelées clean, aurora et black. Vous pouvez choisir l’habillage qui convient le mieux à votre thème, et vous avez également la possibilité d’afficher les événements sous forme d’info-bulle ou d’une animation glissante.

Le script peut également fonctionner dans deux autres modes en plus du calendrier d’événements. Le premier mode est un simple sélecteur de date. Le second mode est plus intéressant car il vous permet de sélectionner une date et d’afficher les éléments liés à cette date, par exemple les articles de blog.

N’oubliez pas de consulter la page de démonstration du script. Je suis sûr que vous aimerez les fonctionnalités proposées dans le plugin.

Tiva Events Calendar

Le calendrier d’événements Tiva offre une solution unique et simple pour suivre les différents événements de votre agenda.

Les meilleurs calendrier javascript de 2020

Ce scénario est différent des deux premiers calendriers d’événements. Vous avez peut-être remarqué que les deux calendriers d’événements simples et le calendrier d’événements DZS jQuery ne marquent que la date de l’événement sur le calendrier. Aucune autre information ne vous est fournie au préalable. Cela signifie que vous devez cliquer sur une date pour voir réellement l’événement.

La présentation compacte de ce plugin fonctionne également de manière similaire et n’affiche les événements qu’une fois que vous avez survolé la date. Toutefois, la mise en page complète du plugin affiche également le titre des événements afin que vous n’ayez pas à cliquer sur chaque date pour voir les événements du jour. Cependant, vous pouvez toujours cliquer sur les événements pour obtenir plus de détails à leur sujet.

Une autre caractéristique intéressante du script est que les événements sont codés par couleur. Vous pourrez attribuer différentes couleurs à différents types d’événements, comme les fêtes ou les réunions d’affaires. Il est ainsi plus facile d’obtenir une vue d’ensemble du calendrier d’un seul coup d’œil, là encore sans avoir à cliquer sur chaque date.

La présentation complète et la présentation compacte contiennent toutes deux une vue du calendrier et une vue de la liste. La vue du calendrier vous montre tous les jours du mois comme un calendrier normal. La vue en liste, en revanche, énumère simplement tous les événements du mois. Vous pouvez voir tout cela en action sur la page de démonstration.

Calentim: Date Time Range Picker

Contrairement aux autres plugins de la liste, le Calentim Date Time Range Picker n’est pas du tout un plugin de calendrier d’événements, et se contente d’être un formidable outil de sélection de plages de dates et d’heures.

Les meilleurs calendrier javascript de 2020

Grâce à sa focalisation étroite, le plugin peut se permettre d’offrir de nombreuses fonctionnalités dans ce créneau particulier. L’un des points forts du script est que le sélecteur est très bien adapté aux appareils de toutes tailles d’écran.

Il est convivial pour les mobiles grâce à son design réactif et à l’utilisation de gestes comme le support des diapositives tactiles. Par exemple, il est très facile de passer d’un mois à un an grâce à la conception bien pensée du plugin.

Il est également facile à personnaliser, de sorte que vous pouvez cacher les éléments de l’interface utilisateur et désactiver les fonctions dont vous n’avez pas besoin.

Le plugin supporte 109 langues différentes. Cela signifie en gros que le script est très probablement livré avec une prise en charge intégrée de la langue utilisée par vos clients.

De nombreuses autres fonctionnalités du script sont mentionnées sur la page de démo du plugin. Essayez simplement les exemples de la page. Je suis certain que vous trouverez toutes les fonctionnalités que vous attendez dans un plugin de calendrier de sélection de plages de dates.

Jalendar 2 Calendar Kit

Le kit de calendrier Jalendar 2 est un plugin basé sur jQuery qui offre de nombreuses fonctionnalités différentes. L’un de ses principaux atouts est la facilité de personnalisation. Par exemple, vous pouvez rapidement changer la couleur de fond du calendrier ainsi que la couleur des jours, des semaines ou de l’année. Vous pouvez facilement modifier toutes les valeurs de couleur pour les faire correspondre à votre schéma de couleurs.

Les meilleurs calendrier javascript de 2020

Le nombre total d’événements de chaque mois est indiqué par des bulles de notification, et les dates sont marquées par de petits points de couleur. En cliquant sur une date, on peut voir tous les événements de ce jour-là.

Vous pouvez utiliser le plugin de quatre manières différentes. Vous pouvez l’utiliser comme un calendrier d’événements, un sélecteur de date ou un sélecteur de plage de dates, et la quatrième utilisation du plugin est celle d’un lien de date – cela vous permet d’attribuer différentes dates à différents liens. Cela peut être utile lorsque vous voulez permettre aux utilisateurs d’ouvrir les articles du blog pour un jour particulier.

Une autre caractéristique intéressante de ce script est sa prise en charge de 13 langues différentes. Si vos clients ne connaissent pas l’anglais, vous pouvez choisir parmi 12 autres langues lors de la création du calendrier des événements.

Hubeleke jQuery Events Calendar

Le calendrier des événements de Hubeleke jQuery est, encore une fois, différent de tous les plugins que nous avons examinés jusqu’à présent. Il peut se connecter à votre base de données et récupérer tous les événements de la date sélectionnée pour les afficher sur votre page web.

Les meilleurs calendrier javascript de 2020

Toutes les dates auxquelles un événement est lié sont marquées d’un fond coloré. Un style minimal a été appliqué au calendrier, de sorte qu’il est facile de le personnaliser en fonction de vos propres besoins.

Vous pouvez également ajouter le support de la langue de votre choix en dupliquant simplement les fichiers JavaScript et en traduisant les noms de tous les mois et jours.

Si vous souhaitez étendre les fonctionnalités du plugin, vous pouvez accéder à un certain nombre de propriétés et d’événements. Par exemple, il existe des événements comme onClickMonth et onClickDay qui vous aident à faire quelque chose de spécifique lorsqu’un utilisateur clique sur un mois ou un jour particulier.

Vous devriez consulter la page de démonstration du plugin pour voir comment il fonctionne et vous informer plus en détail sur ses différentes fonctionnalités.

Conclusion

Dans ce billet, j’ai rassemblé les scripts de calendrier JavaScript les plus populaires disponibles sur CodeCanyon. Ils sont tous bons, mais si vous avez besoin d’aide pour faire un choix, voici quelques réflexions.

Si vous cherchez simplement un sélecteur de date et d’heure, le meilleur plugin pour vous serait le Calentim-Date Time Range Picker. Si vous recherchez un plugin qui peut récupérer les événements de votre base de données en arrière-plan, vous devriez acheter le plugin Hubeleke jQuery Events Calendar. Les autres scripts mentionnés dans le post sont un bon choix si vous recherchez un plugin de calendrier d’événements qui offre de nombreuses mises en page et options de personnalisation différentes.


siddhy

Développeur web full stack depuis une 15aine d'année dans une agence web du sud de la France et Geek depuis toujours, l'apprentissage et le partage font parti intégrante de ma philosophie au même titre que l'évolution personnelle et la sagesse bouddhiste.

0 commentaire

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *