jQuery UI ThemeRoller


Introduction à ThemeRoller

ThemeRoller est une application Web qui fournit une interface intuitive pour concevoir et télécharger des thèmes personnalisés avec jQuery UI. Vous pouvez visiter jQuery UI ThemeRoller pour la personnalisation du thème.

jQuery UI ThemeRoller est conçu et développé par Filament Group, Inc à Boston.

9.png

Interface ThemeRoller

L'interface ThemeRoller est divisée en différents panneaux. Chaque panneau contient les paramètres globaux de la police et du rayon des coins, le style du conteneur de widgets et les états interactifs cliquables de. éléments et divers styles de superpositions et d’ombres. Ces panneaux permettent de configurer diverses propriétés CSS telles que la taille de la police, la couleur, l'épaisseur, la couleur et la texture d'arrière-plan, la couleur de la bordure, la couleur du texte, la couleur de l'icône, le rayon des coins, etc.

Galerie de thèmes (Galerie) : Thèmes préconçus

Le thème ThemeRoller peut être consulté via l'URL du lien permanent, qui contient des thèmes préconçus parmi lesquels choisir. La Galerie est accessible via la barre d'onglets située en haut de l'interface de l'application. Depuis la Galerie, vous pouvez prévisualiser et télécharger des thèmes, et même sélectionner un thème et passer à l'onglet « Roll Your Own » pour effectuer des ajustements.

Téléchargez le thème

Après avoir conçu le thème, vous pouvez télécharger le thème à utiliser dans votre projet. ThemeRoller a un bouton "Télécharger le thème" en haut, qui peut générer un package zip contenant tous les fichiers liés au thème. Les images téléchargées sont générées selon vos spécifications et enregistrées sous forme de fichiers PNG de haute qualité.

Votre thème contiendra des images et du CSS qui constitueront une version personnalisée du framework CSS jQuery UI, y compris les images et le CSS de tous les plugins.

Suivez le thème téléchargé dans votre projet

Une fois le thème téléchargé, après l'avoir décompressé, vous verrez un dossier appelé themes. Ce dossier contient le CSS et les images requis par le thème. Copiez le dossier du thème dans votre projet et liez le fichier themes/all.css dans la page.

Créez un composant personnalisé "ThemeRoller-Ready"

10.png

ThemeRoller génère une version personnalisée du framework CSS jQuery UI pour développer votre propre composant jQuery prêt pour ThemeRoller . Les classes générées via ce framework sont conçues pour fournir des conditions de conception d'interface utilisateur communes, notamment des états, des icônes et diverses classes auxiliaires.

Pour plus d'informations sur le développement du framework CSS jQuery UI, consultez la Documentation de l'API Theming.

Lien ThemeRoller