Helix3 un Framework de template révolutionnaire pour Joomla!

Le Framework Helix, proposé par l'équipe Joomshaper est désormais disponible dans sa version 3 !

Framework Helix 3

Comme vous pourrez le voir, le design par défaut de Helix3 a été mis à jour. La feuille de style a été condensée et complètement ré-écrite avec une attention particulière sur la flexibilité pour le responsive design mobile. Helix propose également de nouvelles fonctionnalités.

Vous souhaitez voir ce qu'il en est ? Vous pouvez vous rendre sur le site de démo. Si vous souhaitez tester vous même, vous pouvez télécharger gratuitement le framework via ce lien.

Une fois sur la page de téléchargement, vous pourrez choisir entre :

  • Quickstart Pack : Une installation de Joomla!, plus le template Helix, plus des données d'exemple (en anglais)
  • Template : Le template Helix seul à installer sur un site Joomla!

Helix en français

Helix est disponible en anglais, une fois que vous l'avez installé, vous pouvez télécharger puis installer les pack de langue ci-dessous afin de pouvoir l'utiliser en français.

Ce pack qui a été réalisé par Yann Gomiero s'installe comme n'importe quelle extension Joomla!.

Note, si vous utiliser le pack Quickstart, vous devrez préalablement installer les pack de langue Fr de Joomla! (via la gestion des langues), puis ensuite le pack de langue Helix pour pouvoir utiliser votre administration en français.

Pour les utilisateurs installant Helix pour la première fois sur un site Joomla!, une chose agréable est que tous les paramètres avancés sont déjà présents. C'est un Framework de templates complet pour Joomla 3. Tout ce dont vous avez besoin pour débuter rapidement un nouveau projet Joomla! est inclus. Parfait pour utiliser tel quel ou comme une base de développement. Il est dessiné afin que vous puissiez travailler rapidement, en utilisant les technologies actuelles et les différents work-flows, sans rencontrer de bugs comme en comportent certains frameworks.

Regardons ce qu'il en est :

Nouveau Frontend

Helix 3 propose un template Frontend entièrement re-dessiné, qui est désormais élégant et plus moderne.

Helix 3 en Frontend

Helix 3 en Frontend

Formats de Post

C'est une partie du framework de templates mais cela est “caché” dans chaque onglet de paramètres d'article.

Helix paramètre d'article

Blog option - Helix

Cela vous offre quelques formats de posts populaires qui vous permettent d'ajouter facilement des médias comme des vidéos, des galeries d'images, des médias audio, des liens, des citations ou des "boites d'informations de statuts", à l’intérieur d'un article. Cet objet sera publié avant le titre de l'article. Vous ne pouvez en utiliser qu'un seul. Par défaut, la vue "standard" est utilisée.

Font Icons dans les éléments de menu

Avez-vous déjà souhaité améliorer la navigation de votre site web en ajoutant des icônes dans vos éléments de menu ? Pour cela, vous devez éditer le CSS ou utiliser la fonctionnalité native de Joomla! (qui comme nous le savons n'est pas parfaite). Grâce à la dernière version de Helix3, vous n'avez plus à faire cela.
L'utilisation d'icônes dans vos éléments de menu est une alternative intéressante qui favorise une identification visuelle rapide, et il est même possible d'envisager des icônes seules, sans les accompagner de texte. Une technique intéressante actuelle est l'utilisation de Font Icons (Font Awesome v4.3). Cela permet une intégration totale du menu dans un web responsive design grâce à l'évolutivité et la personnalisation des vecteurs d'icônes. Combien ? Helix3 propose le pack complet de 519 icônes.

La boutique

formation-video-joomla-3Formation vidéo Joomla!
Découvrez Joomla! 3 avec 40 tutoriels vidéos pour débutant. Apprennez à construire votre site web, de sa création à sa mise en ligne sans oublier sa maintenance.
Ces 40 tutoriels vidéo représentent une durée totale de plus de 6 heures.

Générateur de MegaMenu Helix

Une fois qu'un élément de menu est enregistré et activé, éditez-le de nouveau. Vous devriez remarquer un nouveau paramètre avancé Helix MegaMenu. A partir d'ici, vous pouvez sélectionner un module et l'insérer dans l'élément de menu comme un sous élément.

MegaMenu Helix

MegaMenu Helix

En utilisant Manage Layout, vous pouvez sélectionner le layout que vous souhaitez utiliser.

Option de titre de page

Désormais, vous pouvez utiliser une couleur de background et une image différente pour chaque élément de menu. Ce paramètre est accessible depuis l'onglet "Helix Page Title". N'hésitez pas et personnalisez vos éléments.

Background sur élément de menu

Background sur élément de menu

Bootstrap 3.2

Helix a été mis à jour vers Bootstrap 3.2.2. Nous utilisons Bootstrap nativement dans Helix3 car c'est le framework le plus populaire HTML, CSS et JS pour développer des projets responsive pour le web. Il est aujourd'hui compatible avec tous les navigateurs modernes et utilisable avec n'importe quel téléphone, tablette ou ordinateur de bureau grâce aux media queries CSS.

Header Fixe

Un clic dans les paramètres du template Helix et vous pouvez utiliser un header fixe sur l'ensemble du site web. Le contenu de votre header restera affiché en permanence même lorsque vous scrollerez dans le bas de la page. En général, cet emplacement permet de publier des éléments de navigation, ce qui peut améliorer l'Expérience Utilisateur de votre site web.

Header fixe

Header fixe

Logo Mobile

Cette fonctionnalité qui était très demandée est utile lorsque votre logo est trop gros pour être affiché sur les écrans de téléphone portable. Désormais, vous pouvez utiliser une image alternative plus petite seulement sur les petits écrans, et vous pouvez choisir différents écrans Retina.

Helix mobile logo

Logo pour mobile avec Helix

Paramètres Background

Il est facilement possible de paramétrer les background (couleur, image, repeat, taille et position) directement depuis les paramètres du template.

Background image avec Helix

Background image avec Helix

Amélioration des Google Fonts

Afin que l'utilisation de Google Font soit plus simple, Helix propose une fonctionnalité "Update Font List". Cela vous permet de rafraîchir la liste des Font disponibles via Google. Donc si jamais il y en a des nouvelles, ce bouton vous permettra de rapidement faire la mise à jour en un clic, et de les ajouter automatiquement au Framework Helix3.

Les Subsets (comme le Latin étendu ou le Vietnamien) ne sont également pas des problèmes - choisissez simplement le caractère que vous souhaitez utiliser, si bien sûr il est disponible dans la liste des Font sélectionnées. Tous les paramètres sont placés dans les paramètres du template, donc vous avez désormais un moyen simple et efficace pour utiliser les Google Font de votre choix sur votre site web en quelques clics de souris.

Google fonts helix

Google Font depuis l'administration Helix

Google a mi sà disposition une large collection de fonts basées sur le web depuis quelques années. Une autre fonctionnalité proposée par Helix est "Live Font Preview" dans une liste de plus de 670 Fonts disponibles. Intégrer de nouvelles et uniques font sur votre site Joomla! peut améliorer l'apparence et augmenter le côté sérieux de votre site web.

Prévisualisation des Font Helix

Prévisualisation des Fonts via l'administration Helix

Modification du Layout Manager

Pas seulement nouveau, mais également amélioré. Le principal changement est certainement l'option "Enregistrer une copie" qui simplifie la création de plusieurs Layouts construits en utilisant cet outil. Désormais, lorsque vous souhaiterez dupliquer un template, vous pouvez choisir un layout précédemment enregistré.

Tous les paramètres sont également désormais présentés afin de facilement être repérés.

Layout manager helix3

Gestionnaire de Layout Helix

Nouveau type d'élément de Menu

Helix propose un nouveau type d'élément de menu - Off-Canvas menu, qui peut mixer avec le MegaMenu. Le menu Off-Canvas est positionné en dehors de la zone de contenu se déplie lorsqu'il est activé. Cela a le même avantage qu'un menu déroulant en étant plus agréable. Utile si vous souhaitez proposer une apparence moderne.

Menu off-canvas

Menu Off-Canvas

Le Menu Off-Canvas est utilisé par défaut sur les mobiles et les écrans tactiles et propose une navigation très agréable à vos utilisateurs.

Amélioration du Custom Code

Vous n'avez désormais plus à utiliser des plugins additionnels pour par exemple ajouter du code CSS/JS personnalisé. Deux nouveaux champs ont été ajoutés :

  • Before </head> - Le code que vous placerez ici apparaîtra dans la section head de toutes les pages de votre site web. Cela est utile lorsque vous souhaitez ajouter un code de vérification; du javascript ou du CSS sur toutes les pages.
  • Before </body> - Le code que vous placerez ici apparaîtra dans le bas de la section body de toutes les pages de votre site. Cela est utile si vous souhaitez ajouter un code de tracking pour un comptabilisateur de statistique, comme par exemple Google.
  • Custom CSS - Entrez simplement le code CSS que vous souhaitez utiliser sur l'ensemble du site web.
  • Custom JS - Entrez simplement le code JS que vous souhaitez utiliser sur l'ensemble du site web.

Code personnalisé

Code personnalisé

Commentaires

Cette fonctionnalité native ajoute la possibilité de publier des commentaires Facebook et/ou des commentaires Discuss sur votre site web. Le tout grâce à un seul outil. Vous n'avez plus besoin d'ajouter aucun plugin conditionnel. Cette fonctionnalité permet à vos visiteurs de se connecter via leurs réseaux préférés puis d'ajouter des commentaires sous les articles.

commentaire d'article

Commentaires d'article avec Facebook et Disqus

Vous pouvez également ajouter un bouton Social Share sur les listes d'articles de blog ainsi qu'à l'intérieur de chaque article. Helix a augmenté le nombre d'icônes supportées.

Icônes résaux sociaux

Icônes réseaux sociaux

Information de contact

Le Framework de Template vous permet depuis ses paramètres d'ajouter un espace de contact avec numéro de téléphone et email. Cela sera utile pour le site web d'une entreprise. Bien sûr vous pourrez ajouter plus d'information en utilisant un module de contenu personnalisé ou n'importe quel module à la place. Donc cela n'est qu'une des possibilités. N'oubliez pas de désactiver cette option si vous souhaitez utiliser un module.

information de contact

Information de contact en Frontend

Information de contact en Backend

Information de contact en Backend

Footer éditable

Ajoutez un copyright personnalisable avec des balises HTML personnalisées ou masquez les crédits du template sans risquer d'endommager votre code source. Vous pouvez également modifier la position de ce footer en choisissant parmi les positions de modules disponibles.

Footer personnalisable Helix

Footer personnalisable Helix

Free. Open Source

Aucun achat, pas d'abonnement, pas de limitations, pas d'obligations. Helix 3 est entièrement gratuit et il le restera. Vous pouvez créer des sites web responsive, personnels ou commerciaux rapides et très flexibles.

Note : cet article est une traduction de l'article Helix3 - revolutionary template framework is RC ready.

Notez cet article:
21
Gérer facilement vos réseaux sociaux avec RSSocial...
Le JED (Joomla Extensions Directory) stoppera le s...

Articles en relation

Commentaires 5

 
Claude le mardi 10 février 2015 10:17

Bonjour
Voila une excellente nouvelle que je me suis empressé de mettre à profit. Simple d'utilisation et surtout très maniable et très simple.
La doc également sympa et bien faite. Que des félicitations. Maintenant au boulot :D
Bonne journée
Amicalement
Claude

Bonjour Voila une excellente nouvelle que je me suis empressé de mettre à profit. Simple d'utilisation et surtout très maniable et très simple. La doc également sympa et bien faite. Que des félicitations. Maintenant au boulot :D Bonne journée Amicalement Claude
cavo789 le mardi 10 février 2015 16:18

Cela semble super intéressant. Je lis l'article, je me dis que ce framework semble vraiment bien pensé et qu'il pourra être un excellent point de départ pour toutes personnes désireuses d'avoir un beau visuel sans bourse délier et la conclusion de l'article conclue par "c'est gratuit et cela le restera". Une belle pépite donc à avoir dans sa trousse.

Cela semble super intéressant. Je lis l'article, je me dis que ce framework semble vraiment bien pensé et qu'il pourra être un excellent point de départ pour toutes personnes désireuses d'avoir un beau visuel sans bourse délier et la conclusion de l'article conclue par "c'est gratuit et cela le restera". Une belle pépite donc à avoir dans sa trousse.
Kind of blow le samedi 21 février 2015 21:33

Wow, le site démo est dément !
Bien que je débute sur joomla, j'avoue que cela laisse rêvailleur un brin ce super Hélix, Sire Simon ...

Vais-je basculer ? Quand je vois de quoi l'humain est capable, humblement, pour le bien d'autrui, je me dis que tout n'est pas pain perdu.

Kind of blow.

Wow, le site démo est dément ! Bien que je débute sur joomla, j'avoue que cela laisse rêvailleur un brin ce super Hélix, Sire Simon ... Vais-je basculer ? Quand je vois de quoi l'humain est capable, humblement, pour le bien d'autrui, je me dis que tout n'est pas pain perdu. Kind of blow.
joeweb le samedi 4 avril 2015 17:53

Bonjour Simon
Déjà merci pour ton article
je pense aussi que c'est un excellent Framework
J'aime beaucoup la manière donc on peux manipuler les positions
c'est très pratique
pour te dire aujourd'hui, j'ai attaqué un site d'un client je devais choisir un Framework, mais j’hésitais entre gantry et T3 Framework, c'est alors que je suis tombé sur ton article qui m'a donné envie de m'en servir, je l'avais un peut oublié celui la, pourtant moi aussi j'avais fait un petit article dessus.

Bonjour Simon Déjà merci pour ton article je pense aussi que c'est un excellent Framework J'aime beaucoup la manière donc on peux manipuler les positions c'est très pratique pour te dire aujourd'hui, j'ai attaqué un site d'un client je devais choisir un Framework, mais j’hésitais entre gantry et T3 Framework, c'est alors que je suis tombé sur ton article qui m'a donné envie de m'en servir, je l'avais un peut oublié celui la, pourtant moi aussi j'avais fait un petit article dessus.
Simon le mardi 7 avril 2015 06:30

Bonjour,

merci pour ton commentaire, si tu as des retours à faire sur le framework, n'hésite pas ;)

Bonjour, merci pour ton commentaire, si tu as des retours à faire sur le framework, n'hésite pas ;)
Déjà inscrit ? Connectez-vous ici
Guest
mercredi 24 juillet 2019
Si vous souhaitez vous inscrire, veuillez saisir un nom d'utilisateur, mot de passe et nom.

Image Captcha

Sur ce site, nous utilisons des cookies.