Débuter avec PopUp de Tony
Qu'est-ce que l'application PopUp ?
PopUp est un bloc permettant l'ouverture d'autres pages, ou zone d'autres pages, de votre site dans une fenêtre modale, ou une iframe, sur n'importe quelle page.
De ce fait vous pouvez sur une page quelquonque en apeller une autre. Que ce soit une page entière, une zone de celle-ci, un seul bloc, ou autre.
PopUp fournit un certain nombre de règles vos permettant d'affiner l'élémément à aller chercher.
Les pricipales options disponibles :
- Vous pouvez transformer n'importe uel lien en popup: en ajoutant le nom de la classe css aux propriétés du lien, utiliser un sélecteur jquery css (comme #body a), ou avec un chemin vers la page (comme /about).
- Paramétrer autant de "règles" que vous le désirez, si chaque règle afffiche le titre de la page, et si elle s'ouvre en boîte de dialogue (fenêre modale), ce qui implique que celle-ci se ferme lorsque vous cliquez sur le fond.
- Paramétrer le bloc pour n'afficher que la zone principale de la page vers lequel le lien pointe, ou charger la page complète (auquel cas vous voudrez certainement créer une page type popup).
- La largeur de la PopUp peut être exprimée en pourcentage de la largeur de page ou en pixelles, et sa hauteur peut être automatique ou fixée.
- vous pouvez styliser votre fenêtre pour qu'elle corresponde au couleur de votre site en choisissant la couleur de fond, du texte, du cadre, ainsi que les largeur, marges internes, alignement du texte, et format du titre.
- PopUp intègre l'aplicaation Stats si celle-ci est installée, ainsi les cliques sont comptabilisés lorsque qu'une PopUp est ouverte.
Comment créer un lien PopUp :
1 Ajouter le bloc PopUp sur votre page, j'entends par là la page sur laquelle se trouve votre lien, pas la page que vous voulez charger. Garder simplement les réglages par défaut pur le début de définition de règle. Ce devrait afficher Base du lien: Nom de la classe css et dans le champ d'à côté, vous devirez avoir popupLink. Ensuite choisissez Main comme nom de zone. C'est donc cette zone ui devrait être chargée dans la PopUp.
2Créez votre page chargée par la Popup (n'importe ou sur votre site), et ajoutez du contenu ou un bloc dans la zone Main. Ce sera votre page PopUp. Dans cet exemple, ma page a /my_popup_page/ pour URL. Sortez ensuite du mode édition et publier votre page.
3 Ajoutons maintenant la classe popupLink à notre lien: Revenez sur la première page, passez en mode édition et ajouter/editer votre bloc contenant le lien. Sélectionnez le texte que vous voulez passer en lien PopUp, et cliquez sur l'icone lien (celle entourée en rouge). Ajouter l'url de votre page à chargée (voir la seconde image), ensuite cliquez sur l'onglet advanced, et saisissez le nom de la classe choisie, ici popupLink dans le champ classe (voir la troisième image). Pour terminer cliquez sur le bouton insert dans léditeur de lien et ajouter/mettre à jour pour enregistrer votre bloc.
4 Et voilà, c'est terminé ! Sortez du mode édition, et maintenant lorsque vous cliquez sur le lien, PopUp devrait charger la zone de la page demandée..
Conclusion
A vous de jouer et tester les différentes option du bloc PopUp et ses résultats. Avec un peu d'expérience on peut aller assez loin dans les définitions de règles. D'autant plus si vous êtes maître des classes du thème de votre site web.
