adHoc.71site.fr

→ Installer un Module (ou service) de Liens dans adHoc

C'est le Module qui fonctionne, en exemple sur ce site dans le menu horizontal ci-dessus ou en cliquant sur le lien latéral ci-contre.

Il n'y avait pas jusqu'à présent, pour adHoc, de Module de ce type. Je m'y suis penché finalement, et à partir du service présenté ci-dessous, vous pouvez choisir un Module complètement intégré dans adHoc et dont tous les réglages s'effectuent dans l'admin d'adHoc. Ce Module est complètement, nativement trilingue (anglais, français, italien) comme il se doit.

Il est adapté en utilisant le système accordéon uniquement en CSS issu de ce tutoriel : Autres astuces en CSS - Des textes en accordéon.

Ce Module (ou le service simple) vous permet d'intégrer dans une seule page, toutes les fiches que vous avez créées, dans des soufflets accordéon représentant chacun une catégorie.

La rédaction de ces fiches -courtes de préférence...- se fera tout simplement comme n'importe quelle page, avec l'éditeur de texte que vous utilisez dans l'admin d'adHoc, dans une ou plusieurs catégories que vous dédierez à ce service.

Si vous choisissez le service simple, il vous faudra mettre "un peu" les doigts dans le cambouis... mais rien d'insurmontable ! Par contre, si vous utilisez le Module, la gestion en est infiniment plus simple... Dans tous les cas, si vous utilisez ce script, veuillez, s'il vous plait, laisser les références à l'origine du script et à mon site, ainsi que sa licence GNU-GPL V3.

→ La mise en place, soit du Module, soit du service simple

→ → Vous pouvez télécharger l'archive zip du service simple : links.zip. Le fichier extrait ( links.php ) sera à placer à la racine dans votre site par FTP après l'avoir paramétré comme vous le souhaitez.

→ → Ou bien l'archive zip du Module (ce que je vous conseille désormais...) : mod_links_2_1.zip. Décompressez le zip sur votre disque dur. Envoyez le contenu du zip (quatre dossiers : admin, data, modules, skin et un fichier : links.php) à la racine de votre site adHoc par FTP s'il est en ligne, ou directement dans le dossier local contenant votre site (acceptez de fusionner les dossiers).
Pour cette version 2.1, sur la suggestion d'Alain (un des fondateurs d'adHoc), il y a l'ajout d'un lien d'Administration Rapide vers les réglages du module (voir ici pour son utilisation : CMS AdHoc - Administration Rapide).

Mais, dans les deux cas, des opérations préalables sont nécessaires :

→ Si nécessaire, pour les opérations qui suivent, vous pouvez vous rapporter utilement à la documentation en ligne d'adHoc, et notamment https://www.cmsadhoc.net/private/013-pages-configuration-fr.php et pages suivantes.

→ Dans votre admin, vous devez avoir créé une ou plusieurs catégorie(s) dans une ou plusieurs boîte(s) menu(s). Ces catégories contiendront l'ensemble de vos fiches. Une boîte menu peut être rendue privée si vous ne souhaitez adresser certaines fiches qu'aux membres de votre site ou rester publique à votre souhait (et dans ce cas, une boîte menu suffit amplement...).

→ Vous pouvez choisir d'afficher ou non votre(vos) boîte(s) menu(s) dans les réglages de l'Apparence. Et vous pouvez aussi configurer le type de menu. Mais dans ce type de service, il ne me paraît pas forcément nécessaire de présenter les fiches une par une comme les pages ordinaires. C'est à votre goût... Et de plus les liens qui seront affichés ne redirigeront pas vers la fiche, mais vers le lien que l'on souhaite présenter.

→ Notez bien les numéros (l'Identifiant : Id) de vos catégories : elles seront à reporter dans les réglages.

→ Créez autant de fiches que vous le souhaitez dans vos différentes catégories dans l'admin avec l'éditeur de texte dont vous avez l'habitude. Une astuce ici est très importante à signaler : Vous pouvez lors de la rédaction de votre fiche, renseigner une image, un texte... avec un lien, mais il est indispensable de placer l'URL absolue de votre lien dans la rubrique "Meta Description" de la fiche (page) : en effet le script ira chercher ce lien à cet endroit pour le renseigner sur le caractère identifiant le lien (trois maillons de chaîne sur ce site et sur le Module, une petite maison dans le script du service simple).

→ Si vous désactivez une ou plusieurs fiches en admin, le script ne les affichera pas.

→ Le fichier links.php

Dans les deux solutions, vous avez un fichier links.php qui devra être placé à la racine de votre site et pourra être appelé dans un lien de la Barre de Menu, avec un lien dans une boîte dédiée, ou tout autre moyen à votre convenance. Si vous aviez installé déjà le simple service, écrasez l'ancien fichier links.php avec celui du Module et procédez aux réglages en admin.

→ Les Réglages

Choisissez la suite du tutoriel en fonction de votre installation.

→ Voir la suite pour le service simple

→ Voir la suite pour le Module

→ → Les réglages du Module

Rendez-vous ensuite dans l'admin d'adHoc. Vous avez un onglet Modules, il vous donne accès à l'icône links. Vous pouvez ensuite y régler toutes les variables, dont les commentaires sont , je l'espère, assez clairs... Ce sont évidemment les mêmes variables que pour le simple service...

Ci-dessous, une imagette de saisie d'écran du réglage en admin, vous pouvez cliquer dessus pour zoomer.

→ → → le style

Pour le module, le style "accordeon" est placé dans un fichier spécifique avec une police d'icône gratuite pour un usage personnel sTmedia, si ce style vous convient, inutile de modifier quoi que ce soit. Sinon vous pouvez intervenir sur ce fichier skin/css/CSS_textes_accordeon-links.css qui est quasi identique à la partie de style présentée un peu plus bas pour le service simple. Pour les icônes, vous pouvez en changer : voyez l'image skin/css/fonts/stmedia.jpg et reportez vos choix dans le fichier de style. Il est possible, si vous souhaitez utiliser les "caractères" de la police Fontawesome (utilisés sur ce site), de l'installer et de les mettre en fonction dans le style.

Retour vers le début des réglages

Passer à la suite directement

→ → Les réglages du service simple

Ci-dessous la partie du fichier où vous aurez à intervenir pour les réglages des variables de votre service de Liens. Les commentaires sont, je l'espère, assez clairs.

// Variables à régler
$numcategorie = array('7', '8', '9'); // liste des numéros (Id) des catégories dans l'ordre où vous souhaitez qu'elles s'affichent

$affdate = 'non'; // affichage date : 'oui' ou 'non'
$SouC = 'S'; // si affichage date // 'S' : simple (sans heure) // 'C' : complète (date et heure)
$coum = 4; // date création : 3 ou date dernière modification : 4
$cible = '_blank'; // cible du lien vers la fiche : '_blank' ou '_top' ou ...

$connex = 0; // 0 : une partie au moins est accessible au visiteur // ou 1 : tout le service n'est accessible qu'après connexion
			 //(ATTENTION : Dans ce dernier cas -privé- n'oubliez pas de faire de même pour chaque boîte menu qui contient vos catégories)

$typeaccordeon = 'checkbox' ; // 'radio' ou 'checkbox' suivant le type d'accordéon souhaité
$categorieouverte = '7'; // Eventuellement un numéro de vos catégories à ouvrir par défaut ( par exemple '7' ) sinon ''
$tousouverts = ''; // tous les soufflets de l'accordéon sont fermés par défaut ou 'checked="checked"' pour les ouvrir tous
				//MAIS pour 'checkbox' uniquement car si vous choisissez 'radio' seul le dernier soufflet sera ouvert par défaut

	// dont définition des variables de langue
	if (USER_LANG == 'fr') { // fr
	$meta['title'] = 'Service de liens'; // titre
	$meta['description'] = 'Affichage de liens utiles'; // description
	$topmess = 'Liens' ; // nom de la page
	$prive = 'Désolé, cette page est en accès privé.'; // avertissement si privé
	}
	elseif (USER_LANG == 'it') { // it
	$meta['title'] = 'Servizio di link'; // titre
	$meta['description'] = 'Visualizzazione di link utili'; // description
	$topmess = 'Link' ; // nom de la page
	$prive = 'Spiacenti, questa pagina è riservata.'; // avertissement si privé
	}
	elseif (USER_LANG == 'en') { // en
	$meta['title'] = 'Links service'; // titre
	$meta['description'] = 'Displaying useful links'; // description
	$topmess = 'Links' ; // nom de la page
	$prive = 'Sorry, this page is private.'; // avertissement si privé
	}

→ Vous pouvez rendre tout ou partie de votre Service de liens privé ou pas (en association nécessaire avec le Niveau visibilité Boîte pour les boîtes concernées dans l'admin de votre site).

→ Vous pouvez choisir d'afficher ou non la date (avec ou sans heure) de création ou de dernière modification.

→ Les variables de langue servent à renseigner le code source ($meta[...]), à afficher un titre à la page et à proposer un message d'avertissement en cas de service privé. Vous pouvez les traduire si vous les utilisez dans les 3 langues principales d'adHoc. Si votre site possède plus de langues, il vous faudra ajouter et traduire les variables nécessaires dans un bloc de test elseif (USER_LANG == '??') { .... } .

→ → → dans le fichier links.php du service simple : le style

Le fichier links.php contient une partie de style indispensable. Cela me paraît, pour le service simple être le plus pratique. Si le style vous convient, inutile de le modifier, sinon, intervenez dans cette partie.

.ac-container { /*attributs du conteneur*/
	width: 99%; /*largeur du conteneur*/
	margin: 10px auto 30px; /*marges extérieures H DG B*/
	text-align: left; /*alignement texte gauche*/
}
.ac-container label,
.ac-container input[type="checkbox"] + label { /*attributs des titres*/
	font-family: Open sans, sans-serif; /*police*/
	font-size: 19px; /*taille police*/
	margin:0 auto 5px; /*marges extérieures H DG B à adapter*/
	line-height: 28px; /*hauteur ligne*/
	padding: 5px 20px; /*marges intérieures*/
	position: relative;
	display: block;
	height: auto; /*hauteur*/
	min-height: 45px;
	cursor: pointer;
	color: #ffffff; /*couleur texte*/
	background: linear-gradient(to right, rgba( 23, 62, 95, 1), rgba( 56, 102, 140, 1)); /*couleur fond #173E5F >> #38668C*/
	box-shadow:
		0px 0px 0px 1px rgba(155,155,155,0.3),
		0px 2px 2px rgba(0,0,0,0.1); /*ombre portée boite titre*/
}
.ac-container label:hover,
.ac-container input[type="checkbox"] + label:hover
{
	background: rgba( 56, 102, 140, 1); /*couleur fond au survol*/
}
.ac-container input:checked + label,
.ac-container input:checked + label:hover { /*attributs des titres sélectionnés et au survol*/
	background: rgba( 23, 62, 95, 1); /*couleur fond*/
	color: #D6AF84; /*couleur texte*/
	font-weight:bold; /*gras du texte*/
	box-shadow:
		0px 0px 0px 1px rgba(155,155,155,0.3),
		0px 2px 2px rgba(0,0,0,0.3); /*ombre portée boite titre*/
}
.ac-container label:before { /*pseudo-élément pour titre*/
	/*font-family:"fontawesome"; /*police de caractère*/
	/*content: "\f101"; /*caractère*/
	content: "►"; /*caractère*/
	padding-right:10px; /*marge intérieure droite*/
}
.ac-container input[type="checkbox"]:checked + label:before { /*pseudo-élément pour titre checkbox sélectionné*/
	/*font-family:"fontawesome"; /*police de caractère*/
	/*content: "\f103"; /*caractère*/
	content: "▼"; /*caractère*/
	padding-right:10px; /*marge intérieure droite*/
}
.ac-container input[type="radio"]:checked + label:before { /*pseudo-élément pour titre radio sélectionné*/
	/*font-family:"fontawesome"; /*police de caractère*/
	/*content: "\f107"; /*caractère*/
	content: ">>"; /*caractères*/
	padding-right:15px; /*marge intérieure droite*/
}
.ac-container input {
	display: none;
}
.ac-container article { /*attributs des articles masqués*/
	background: rgba(240,240,240,1); /*couleur fond*/
	margin-top: -5px; /*marge extérieure haute*/
	height: 0px; /*hauteur = 0 -> invisible*/
	transform:scale3d(1,0,1); /*échelle = 0 -> invisible*/
	transform-origin:0 0; /*origine transformation : ici haut*/
	overflow: hidden;
	position: relative;
}
.ac-container article p { /*attributs des paragraphes*/
	font-style: normal; /*à ajuster ou supprimer*/
	color: #000; /*couleur texte*/
	font-size: 14px; /*taille police*/
	line-height: 23px; /*hauteur ligne*/
	margin:0; /*marges extérieures*/
	padding: 0px 20px 5px 20px; /*marges intérieures*/
}
.ac-container input:checked ~ article { /*attributs des articles à la sélection*/
	transition:all 0.5s ease; /*transition à la sélection -temps, nature-*/
}
.ac-container input:checked ~ article.ac { /*attributs des articles à la sélection*/
	height: auto; /*hauteur*/
	transform:scale3d(1,1,1); /*échelle = 1 -> visible*/
}
.ac-container article h4 { /*titre h4*/
	margin-left:15px; /*marge extérieure gauche*/
	margin-top:-20px; /*marge extérieure haute*/
	font-size: 17px; /*taille police*/
	padding-bottom: 2px; /*marge intérieure basse*/
	color: #3366FF; /*couleur texte*/
}
.ac-container article h4 a { /*lien*/
	color:#D54500; /*couleur texte*/
}
.ac-container article h4 a:hover { /*lien au survol*/
	color:#6A2300; /*couleur texte*/
}
.ac-container article h4 a::after { /*pseudo-élément icone "caractère" du lien*/ 
	/*font-family:"fontawesome"; /*police de caractère*/
	/*content:"\f0c1"; /*caractère ou "\f15c" ou...*/
	content:"⌂"; /*caractère*/
	font-size:40px; /*taille police*/
	padding-right:5px; /*marge intérieure droite*/
}
.sep { /*ligne de séparation*/
	border-top: 1px dashed rgba(0,0,0, 0.5); /*bordure haute*/
	border-bottom: 1px dashed rgba(255, 255, 255, 0.3); /*bordure basse*/
	margin: 4px 1% !important; /*marges extérieures*/
	clear:both;
}
.comment { /*commentaire*/
	float:left; /*à gauche*/
	width:94%; /*largeur*/
	background:rgba(255,255,255,1);
	margin:5px 3% !important;
	border-radius:5px;
	border:1px dotted rgba(24,34,84, 0.6);
}
p.comment {color:#111 !important;padding-bottom:10px !important;}

.comment a {color:#D54500; /*couleur lien*/}
.comment a:hover {color:#6A2300; /*couleur lien au survol*/}
.comment::before { /*pseudo-élément icone "caractère" du commentaire*/
	/*font-family:"fontawesome"; /*police de caractère*/
	/*content:"\f1c6"; /*caractère ou "\f06c" ou ...*/
	content:"֍"; /*caractère*/
	color:#3366FF; /*couleur texte*/
	margin-left:5px; /*marge extérieure gauche*/
}
@media screen and (max-width: 520px), screen and (max-device-width: 520px) { /* inférieur à 520px de largeur (MOBILE) */
.ac-container article h4 { /*titre h4*/
	font-size: 18px; /*taille police*/
}
.ac-container article h4 a::after { /*pseudo-élément icone "caractère" du téléchargement*/ 
	font-size:36px; /*taille police*/
}
}

→ Il est possible, si vous souhaitez utiliser les "caractères" de la police Fontawesome (mis en commentaire ci-dessus), de l'installer et de les mettre en fonction dans le style.

→ Il est possible de transférer tout le style dans le fichier style.css de votre ou vos skins ou dans un autre fichier de style additionnel que vous auriez créé (c'est le fonctionnement du Module). Dans ce cas, vous pouvez le supprimer de ce fichier links.php.

Retour vers le début des réglages

→ Une "astuce" supplémentaire

NB : Si vous utilisez l'affichage de "Index des Pages" dans votre site (admin : Tableau de bord | Pages | Configuration) et que vous ne souhaitez pas que ces fiches apparaissent dans cet index, il est possible de "forker" assez simplement le fichier pages/index.php afin qu'il supprime de l'affichage certaines catégories que vous aurez choisies... C'est par exemple, le cas ici, où les fiches de liens et les items de téléchargement n'apparaissent pas dans le Sommaire pour ne pas le surcharger inutilement. Un module, téléchargeable ici (mod_fork_tri_index_1_0.zip) permet de réaliser cette opération très simplement en admin d'adHoc.

Me contacter via Contact, pour toute question ou aide pour mettre en place et utiliser ce Module ou service simple, et notamment :

→ pour régler les catégories de votre Module ou service simple et la ou les boîtes menus qui les contiennent.

→ pour modifier les paramètres de links.php du service simple.

→ pour installer le fichier links.php et créer un lien pour l'appeler.

→ pour installer la police Fontawesome et la mettre en service dans votre site, soit dans le service simple, soit dans le Module.

→ pour ajouter, si cela m'est possible des fonctions supplémentaires à ce Module ou service simple.

→ pour, éventuellement, adapter ce service simple à l'intérieur d'une boîte qui s'afficherait, par exemple dans la colonne principale de la page _index.

→ pour adapter ce Module ou service simple sans accordéon (il n'y aura plus de style dans le fichier... mais le résultat sera moins pratique et moins esthétique...).