Vertex Shape 5
Le wiki : Accueil - Administrateur - Bureautique - Développeur - Intégrateur - Marketing - Multimédia - Objets numériques - Jeux - We make Hack
Vertex Shape 5
Site officiel de Shape5
Le site officiel : https://www.shape5.com Le forum officiel : https://www.shape5.com/component/option,com_smf/Itemid,95/&Itemid=95
Manuel
Source du tutoriel Shape5 : http://www.shape5.com/documentation Source du tutoriel Web 54 : https://www.web54.fr/telechargements/telechargements-tutoriels-vertex
Les fonctions de Joomla dans Vertex
Le fichier suivant est utilisé pour définir les fonctions de Joomla. Modules, sortie composant...
\templates\templatename\vertex\cms_core_functions.php
Afficher les positions du template
Depuis le menu du Template on peut faire en sorte d'afficher les positions du template pour les voirs avec&tp=1.
Ajouter une Nouvelle Position de Module dans Vertex
Ajouter une Nouvelle Position de Module dans Vertex
Source du tutoriel Web 54 : https://www.web54.fr/tutoriels-vertex/documentation-framework-vertex/pour-les-utilisateurs-avances
Il est possible de configurer le template avec un menu spécifique pour l'affichage mobile.
Je ne le fait pas. J'affiche le menu normal, mais, je limite l'affichage à 2 niveaux, pour les appareils portables.
Drop Box
Une fenêtre déroulante peut être affichée. En version portable, elle n'apparait pas.
Le menu accueil n'a pas de sous liens. Un problème avec le fil d'Ariane indique deux fois accueil.
J'ajoute des liens sortants qui n'interfèrent pas avec le fil d'ariane. Les sous liens du menu accueil sont donc des liens sortants.
Erreur Bad Request - Désactiver Enable Font Resizer
400 Bad Request Your browser sent a request that this server could not understand. Size of a request header field exceeds server limit. Cookie /n
Basically, you have one malformed cookie that is causing the problem. The problem appears to be because permanent cookies are set by the Font Resizer in my shape5 Vertex template, for each page in the site (code is in s5_font_adjuster.js).
Disabling the resizer seems to stop this. Only a few session cookies are set and all is well.
Corrigé en passant à Off Enable Font Resizer depuis les menus de configurations du template Vertex Shape5.
Vérifier sur la DEMO de Shape5 Vertex pour voir si ils fonctionnent.
La barre noire qui permet de remonter automatiquement en haut de page
La barre noire qui permet de remonter automatiquement en haut de page était boguée sur mobile, dans mon cas, avec Joomla! 2.5.28.
Cette option fonctionne pour Joomla! 3.5 et le template Vertex Shape5 dans sa dernière version.
Je désactive cette option de remontée automatique pour gagner en temps de chargement.
Une image pour le bouton de recherche
Activer/Désactiver l'utilisation d'une image pour le bouton de recherche du template vertex shape5.
L'image doit être nommée 'searchButton.gif' et placée dans le dossier 'templates/nom-du-template/images/'.
CSS - Couleur sur l'outil de recherche
#s5_search input {
padding: 4px 15px !important;
width: auto !important;
background: #27698a;
}
CSS - Titres de la même couleur
.s5_h3_first {font-family: arial, serif;
color:#73A0CF;}
.s5_mod_h3 {font-family: arial, serif;
color:#73A0CF;}
CSS - Page erreur 404
Cette css n'est valable que pour mon article utilisé pour la page erreur 404.
/* Erreur 404 */
/* Peut être intégré directement */
div.erreur-404 {
text-align: center;
border: 1px solid #C0C4C0;
width: 90%;
height: auto;
background-image:url( https://www.visionduweb.eu/images/stories/navigation/danger.png );
background-repeat:no-repeat;
margin: auto;
background-color: #750c11;
background-position: 96% 94%;
padding-left: 0px;
-moz-border-radius: 12px;
-webkit-border-radius:12px;
border-radius: 12px; }
p.erreur {color:black;}
h1.erreur {color:red; font-weight: bold;}
h2.erreur {color:black; font-weight: bold;}
.inner-erreur-404 {padding-top:25px;}
/*Couleur bordure bottom du sous menu*/
#subMenusContainer div.s5_sub_wrap ul, #subMenusContainer div.s5_sub_wrap_rtl ul, #subMenusContainer div.s5_sub_wrap_lower ul
{
border-bottom: 1px solid #65EFB9 !important;
}
/* Bordure à 0 pour ne pas avoir 2 bordures */
#subMenusContainer div.s5_sub_wrap ul, #subMenusContainer div.s5_sub_wrap_rtl ul {
padding-bottom: 0px !important;
margin-bottom: 0px !important;
}
CSS - Appliquer mon type de puces
.s5_fourdivs_1coherence li {
margin-top: 0px;
padding: 6px 24px;
border-bottom: 0px dotted #D3D3D3;
background: transparent url(" https://www.visionduweb.fr/templates/shape5_vertex/images/system/arrow.png ") no-repeat scroll left center; list-style-type: none;}
/* Supprimer les puces */
.latestnews li, .mostread li, .sections li{
list-style-type:none;
border-bottom: 0px dotted #D3D3D3;
CSS - Cadrer la bannière
Je supprime les 3 commandes suivantes pour cadrer la bannière et optimiser la css dans le fichier template.css
#s5_banner {
paddin-top: 36px;
padding-right: 32px;
color: #CCC;
}
CSS - Changer la couleur du background de l'entête
Changer la couleur du background de l'entête par la couleur de la bannière depuis le fichier template.css
s5_header_wrap {
/* Changer background: #1A1A1A par #010207 */
}
CSS - Bannière responsive
Je vide #s5_banner pour que la bannière prenne 100% de l'espace depuis le fichier s5_responsive.css
#s5_banner {
//vidé
}
Supprimer le logo de shape5 au bas de la page
Localiser le fichier principale index.php
En fin de fichier, supprimer :
<a title="shape5.com" href=" www.shape5.com " target="blank" id="s5_shape5_logo"></a>
Pour changer simplement l'image en bas de page du template : Nom_du_template/images/shape5_logo.png
#s5_shape5_logo { La css pour l'image de pied de page. }
Mode déboguage
Le mode débogage active une version non compressée de jQuery. En mode normal, la version compressée est de nouveau en place.
Quand je coupe le rapport max des erreurs, le site tourne parfaitement bien, parfaitement fluide.
Position du bouton éditer article
Le bouton disparaît caché par un élément au dessus de lui.
( Ou du fait d'un élément du template non activé, comme une position de template au dessus ou au dessous. )
Je ne sais plus si il faut jouer sur la hauteur ou fixer à 0, à tester.
a img{
margin-top:0px;
}
ul.actions {
margin-top:0px;
}
Autre solution qui fonctionne.
Pour que le bouton d'édition des articles s'affiche, il faut d'abord placer un titre H1 en haut de l'article.
[Résolu] en mettant un titre dans une balise H1 en haut de l'article.
Bootsrap
Dans le dossier du template.
Bootstrap utilise JQuery. Télécharger la dernière version de la bibliothèque JQuery depuis le site officiel : jquery.com
Concevoir un template Joomla Responsive avec Bootstrap
20 outils pour créer un template Bootstrap
Source : https://www.codeur.com/blog/creation-template-bootstrap/
FontAwesome
En option : utiliser Font Awesome pour avoir d'avantage d'icônes.
Dans le dossier du template.
Télécharger Font Awesome pour enrichir vos possibilités créatives en css : fortawesome.github.io/Font-Awesome/
Icomoon
Adapter les icones de Kunena avec les icones de icomoon /media/jui/css/icomoon.css
Exemple de class CSS pour l'icone " OS " avec icon-screen. icon-home fonctionne aussi.
NAVIGATION
PARTICIPER ET PARTAGERBienvenue sur le wiki de Amis SH. De nombreuses pages sont partagées sur ce wiki. Créer un compte utilisateur pour participer sur le wiki. Les pages présentées sur le wiki évoluent tous les jours. Certaines recherches sont peu abouties et incluent des erreurs. Utiliser la recherche interne du wiki pour trouver votre contenu. La page de discussion de Amis SH vous permet de poser vos questions. Consulter le site amis-sh.fr pour installer votre propre serveur web. Améliorer le contenu des pages avec vos retours depuis l'onglet discussion. Ce contenu ne doit pas servir à nuire à autrui ou à un système informatique. Protéger votre système Linux ou Windows avec cette page dédiée à la sécurité. |
SOUTENIR CE WIKISoutenir le wiki avec un don en monnaie numérique : AEON - Bitcoins - Bitcoins Cash - Bitcoins Gold - Bitcore - Blackcoins - Basic Attention Token - Bytecoins - Clams - Dash - Monero - Dogecoins - Ğ1 - Ethereum - Ethereum Classique - Litecoins - Potcoins - Solarcoins - Zcash OBTENIR DE LA MONNAIE NUMERIQUEObtenir gratuitement de la monnaie numérique : Miner de la cryptomonnaie. |