tutoriels frameworks / templates

Tutoriels sur Gantry, Vertex, Helix ... etc ...

(documentation personnelle ou traduction de la documentation originale)

Sous-catégories

Tutoriels Gantry5

Gantry5 remplace avantageusement Gantry4 !

Retrouvez-ici toutes les procédures pour prendre en main cet outil !

Tutoriels Helix

Retrouvez les tutoriels et toute la documentation Du framework Helix de Joomshaper traduite en français. (http://www.joomshaper.com/documentation/helix/)

Tutoriel Astroïd

Tutoriel ASTROÏD

Documentation en français sur le framework astroïd Pour Joomla

https://astroidframe.work/

par

Astroid c’est quoi ?

Astroid est un puissant framework moderne conçu pour les designers et les développeurs ou simplement pour vous aider à créer votre premier site web. Son interface intuitive vous aidera à créer des sites web et des templates basés sur Joomla cc réactifs, rapides et robustes. Astroid utilise les dernières technologies web et intègre et améliore les capacités de base de Joomla.

Caractéristiques

Construit pour Joomla 4, Joomla 5 & au delà!
Crée des sites web à chargement rapide
Structure 100 % réactive avec des contrôles utilisateur avancés par appareil
Compatible Bootstrap 5, Sass Ready, Custom CSS & SCSS si necessaire
Constructeur de mise en page ergonomique par glisser-déposer avec une flexibilité totale en matière de conception
Options flexibles pour le logo et l'en-tête (logo Retina, menu « collant », contrôles de la mise en page...)
Font Awesome 6 (Chargement externe ou locale)
Icônes sociales, téléphone et partage
Conception accessible et instructions textuelles Prêt pour le RTL/LTR
Animations des sections et des éléments et contrôles étendus de l'arrière-plan
Options avancées des menus (bannières de pages, icônes, sous-titres, badges...)
Sections off-canevas et options puissantes de " Mega Menu "
Contrôles typographiques avancés pour les polices externes (Google, etc.) ou auto-hébergées
Options avancées de blog (Informations sur l'auteur, Articles connexes, Temps de lecture, Partage social, Commentaires...)
Options de type d'article personnalisé (vidéos, galerie, audio, commentaires, citations et badges d'articles...)
Intégration illimitée de codes et de fichiers personnalisés (Javascript, CSS, code de suivi...)
Profils et thèmes personnalisés avec paramètres d'importation/exportation
Lazy Loading et optimisation du code JS et CSS
Open Graph
Possibilité d'intégration totale des modèles enfants de Joomla
Administration Ajax et thèmes de couleurs claires et foncées avec commutateur pour les visiteurs
Expérience utilisateur améliorée. Créez facilement le design que vous avez en tête.
Code de base remanié, amélioration de toutes les versions
Disponible dans plusieurs langues
Système puissant de widgets
Et plus encore ...
N'activez que ce dont vous avez besoin et demandez-nous de nouvelles fonctionnalités !

Pour démarrer :

Vous avez 2 minutes ?

Découvrez un aperçu vidéo du framework Astroid

Si, pour une raison quelconque, vous souhaitez avoir la zone de contenu principal à gauche et deux colonnes à droite, vous pouvez le faire en modifiant le fichier index.php dans le répertoire templates/protostar/. Toujours faire une sauvegarde de l'index.php actuel avant de le modifier.

Le template par défaut pour Protostar 3.2 a une section dans le fichier index.php qui ressemble à ceci :

<div>

<?php if ($this->countModules('position-8')) : ?>

<!-- Begin Sidebar -->

<div id="sidebar">

<div>

<jdoc:include type="modules" name="position-8" style="xhtml" />

</div>

</div>

<!-- End Sidebar -->

<?php endif; ?>

<main id="content" role="main" class="<?php echo $span;?>">

<!-- Begin Content -->

<jdoc:include type="modules" name="position-3" style="xhtml" />

<jdoc:include type="message" />

<jdoc:include type="component" />

<jdoc:include type="modules" name="position-2" style="none" />

<!-- End Content -->

</main>

<?php if ($this->countModules('position-7')) : ?>

<div id="aside">

<!-- Begin Right Sidebar -->

<jdoc:include type="modules" name="position-7" style="well" />

<!-- End Right Sidebar -->

</div>

<?php endif; ?>

</div>

Le texte coloré est indiqué pour éclaircissement. Les lignes noires sont le HTML5. Les rouges sont le PHP et les bleues sont les appels de <jdoc>.

Pour déplacer la colonne de gauche actuelle afin qu'elle soit juste à droite du contenu, vous devez couper et coller toutes les lignes depuis :

<?php if ($this->countModules('position-8')) : ?>

jusqu'à l'endif correspondant pour ce premier if.

<?php endif; ?> et le placer sous </main>

Remarques :

Notez que c'est pour Protostar fourni avec Joomla 3.2. Les versions antérieures de Protostar pour Joomla 3 n'utilisaient pas la balise HTML5 <main>.

Si vous mettez à jour Joomla à une date ultérieure, vous devrez peut-être modifier le nouveau fichier index.php dans le répertoire templates/protostar/ d'une manière similaire.

Certains styles supplémentaires à l'aide des feuilles de style peuvent être nécessaires pour que vos colonnes soient agencées comme vous le souhaitez .

Si vous envisagez d'utiliser le template Protostar fourni avec Joomla, vous pouvez ajouter votre propre feuille de style custom.css. Vous pouvez la nommer comme vous voulez bien sûr, sauf template.css - qui est le nom de la feuille de style par...

Lire → Ajouter une feuille de style personnalisée pour protostar

Il peut y avoir une situation où vous ne souhaitez pas que le template Protostar soit responsive. C'est peut-être parce que vous avez de larges images dont vous ne souhaitez pas réduire la taille, ou des avertissements d'extensions tierces ou...

Lire → Comment rendre Protostar non-responsive

Si vous voulez utiliser et personnaliser le template Protostar par défaut, il est souvent suggéré que que vous fassiez une copie et renommiez le template.

Remarque: Si vous allez dans le gestionnaire de Template Manager et cliquez sur Dupliquer, Cela...

Lire → Comment copier et renommer le template Protostar ?

Il se peut que vous souhaitiez avoir une zone de contenu plus étendue ou de plus larges colonnes à gauche et à droite. Voici quelques suggestions sur la façon dont vous pourriez aborder cette question. Regardons quels sont les paramètres...

Lire → Comment ajuster la largeur des colonnes de gauche et de droite ?

Plus d'articles...

Page 12 sur 25

Tutoriels sur Joomla et la création de site