←  Graphisme & création web

InfoMars.fr

»

Popup redirection

 Photo Gregoryen 10 févr. 2015

Bonsoir !

 

J'aimerais afficher le règlement du forum, le même qui s'affiche en popup lors des inscription ( terms_of_use ) quand je clique sur le forum " règlement " de mon site.

 

Quand je crée un forum il me marque " forum de redirection ", par contre je ne sait pas quoi mettre dans " url de redirection " pour que quand je clique, le popup interne au site s'affiche sur la page.

 

J'ai trouvé ça 

$this->lang->words['terms_of_use']}

Mais cela ne marche pas, une idée ? :-) 

 

Merci !


Ce message a été modifié par Gregoryen - 10 février 2015 - 23:26 .
Répondre

 Photo noisette 11 févr. 2015

Bonjour,

 

 

 

pour ouvrir une pop-up, cela est un peu plus compliqué:

 

 

il faut un lien, qui va servir pour le clic,

et une fenêtre cachée, que le clic fait apparaître/disparaître.

 

Le clic est écouté par du javascript, qui s'occupera aussi de cacher-montrer.

 

 

Il faut que l'on regarde où est le script qui gère cela, ensuite comment il gère l'écoute et l'action.

 

 

On sait déjà que:

 

le lien a un ID: tou_link

 

Les boites qui apparaissent ont pour ID:

reg_tou_popup (Le contenu que tu veux faire apparaître doit être dans cette boite)

document_modal (le fond gros transparent)

 

Ces deux boites ont un style "en ligne" qui est:

display: none;

 

Un clic sur le lien modifie cette propriété en display: block, un second clic remet display: none.

 

 

 

Je dois filer, je te laisse un peu regarder.

 

A suivre.

Répondre

 Photo Gregoryen 11 févr. 2015

Merci, par contre je n'y comprend pas trop,  c'est pas trop mon domaine, le codage etc donc je sait pas du tout quoi écrire en fait.

Répondre

 Photo Gregoryen 11 févr. 2015

Quelqu'un ma parlé de créer ma propre div.

 

J'ai pensé à copier le code de celui de la page inscription mais je ne sais meme pas lequel c'est et comment lui donner une " url ".

Répondre

 Photo noisette 11 févr. 2015

ça, c'est la carcasse HTML:

 

 

le lien à cliquer:

<a href="#" id="tou_link">Terms of Use</a>

deux balises à mettre n'importe où, le mieux étant en toute fin de code par exemple, juste avant la balise fermante "/body".

<div id="reg_tou_popup" class="popupWrapper" style="z-index: 10001; display: none; top: 155.75px; left: 354px; position: fixed;">
     <div id="reg_tou_inner" class="popupInner" style="width: 600px; max-height: 911px;">
         <h3>un petit titre</h3>
         <div class="ipsPad" id="tou_popup">  
                contenu
          </div>
     </div>


<div id="reg_tou_close" class="popupClose clickable"><img src="http://patatipatata/close_popup.png" alt="x"></div></div>

Normalement, un troisième larron, en javascript, vient gérer tout ça.

 

A mon avis, dans ton essai, ça ne se déclenchera pas, et on regardera comment avancer.

Répondre

 Photo Gregoryen 11 févr. 2015

Super, c'est sur quel fichier que je doit le rajouter ? Dans un fichier sur le FTP ou dans le theme ? :-) Merci

Répondre

 Photo noisette 11 févr. 2015

Ton thème, tu le fais toi-même ? C'est un thème enfant ?

 

Pour placer ça, il va falloir qu'on regarde de près où tu veux le mettre exactement.

Répondre

 Photo Gregoryen 11 févr. 2015

J'ai créer un thème dans " créer un theme ". 

Ce n'est pas le thème par défaut.

Répondre

 Photo noisette 11 févr. 2015

D'accord: donc tu peux effectivement placer ça dans les templates directement.

 

Tu testes: normalement: tu devrais voir ton lien, les deux autres blocs seront cachés, et un clic sur le lien ne donnera pas encore de résultat, mais on aura avancé.

 

Tiens-moi au courant.

Répondre

 Photo Gregoryen 11 févr. 2015

J'ai mis ça dans url : 

<a href="#" id="tou_link">Terms of Use</a>

et j'ai mis ca dans globaltemplate avant la balise body 

<div id="reg_tou_popup" class="popupWrapper" style="z-index: 10001; display: none; top: 155.75px; left: 354px; position: fixed;">
     <div id="reg_tou_inner" class="popupInner" style="width: 600px; max-height: 911px;">
         <h3>un petit titre</h3>
         <div class="ipsPad" id="tou_popup">  
                contenu
          </div>
     </div>


<div id="reg_tou_close" class="popupClose clickable"><img src="http://patatipatata/close_popup.png" alt="x"></div></div>

Répondre

 Photo noisette 11 févr. 2015

J'ai mis ça dans url : 

<a href="#" id="tou_link">Terms of Use</a>


Je ne te suis pas, là: le lien s'affiche où déjà, et tu l'affiches comment ?
Répondre

 Photo Gregoryen 11 févr. 2015

Connecte toi avec les ID que je t'ai envoyé en mp.

 

Le but est d'ouvrir ce même popup que celui de l'inscription ( terme of use ) en cliquant sur le forum " reglement ".

Répondre

 Photo noisette 11 févr. 2015

Ok, merci pour les identifiants.

On continue sur ce fil dès que le problème des icônes est réglé. ;)

 

 

Relance le sujet si j'ai l'air d'avoir oublié. :old:

Répondre

 Photo Gregoryen 12 févr. 2015

Voilà, problème d'icônes réglé :-)

 

Manque ce popup.

 

Avant de créer d'autres sujets, je cherche à faire :

 

- Avoir le nombre de personne connecté sur mon bouton chat, comme l'original. Sauf que la j'ai crée mon menu.

-Pareil pour un bouton " nouveau contenu " qui emmène a la page " nouveau contenu ", j'aimerais que quand il y a un nouveau contenu, le gif s'anime.

-Flouter mon cadre noir d'arrière plan sur le fofo.

 

Et ce forum sera prêt ^^

Répondre

 Photo Gregoryen 12 févr. 2015

Bon je pense qu'on peux réattaquer ça xD

Répondre

 Photo noisette 12 févr. 2015

Je repasse demain. ;)

Répondre

 Photo Gregoryen 12 févr. 2015

Ca marche

Répondre

 Photo Gregoryen 13 févr. 2015

On reprend ?

 

Je rajouterais une question :

 

Peut-on créer plusieurs popup comme celui que je veux faire ?

Répondre

 Photo noisette 14 févr. 2015

Attention:

 

ça ne va pas être simple, il faut que tu comprennes comment fonctionne une lightbox,

 

 

et il faudra au bout du compte utiliser de façon un peu détournée le champ "description du forum",

 

on risque aussi mais c'est pas sûr, je dois aller vérifier, de devoir développer le script qui gère la lightbox, si on ne met pas la main sur le script IPB qui fait ça ou si ce script s'adapte mal à cette situation (c'est plutôt si la situation ne s'adapte pas au script, d'ailleurs).

 

 

 

Bon.

 

 

Imagine trois blocs:

 

 

un premier, qui prend tout l'écran, sans contenu, et avec un background semi-transparent

un second, qui vient par dessus ce premier bloc, qui est centré sur ta page, et affiche le contenu des règles.

 

Ces deux premiers blocs sont cachés par défaut, on ne les voit pas.

 

Sous ces deux blocs, ta page normale, qui contient le troisième bloc, avec un lien: si on clic sur ce lien, on ne va pas sur une nouvelle page, mais on affiche les deux premier blocs. Quand on reclique sur les blocs, ou seulement sur le premier bloc autour du second, ça referme tout et on revient au point de départ.

 

 

Tout ce que je viens de décrire se gère dans les templates, avec éventuellement un poil de CSS mais ce n'est pas obligé, CSS pouvant être intégré en ligne dans les templates.

 

Tout s'y gère, donc, sauf ceci:

 

si on clic sur ce lien, on ne va pas sur une nouvelle page, mais on affiche les deux premier blocs. Quand on reclique sur les blocs, ou seulement sur le premier bloc autour du second, ça referme tout et on revient au point de départ.

 

 

Ça, c'est un script qui va gérer ces comportements, donc soit on peut trouver et utiliser celui d'IPB, soit on en fait un nouveau.

 

 

 

 

Avant de commencer, prenons le temps que tu piges bien le système.

Répondre

 Photo Gregoryen 14 févr. 2015

J'ai 4 règlements, donc 4 popup à vouloir créer.

 

Si je comprend bien il n'y a que 3 popup caché et ils s'affichent tous en même temps ?

Répondre

 Photo noisette 14 févr. 2015

Non, il y aurait:

 

3 blocs par pop-up à afficher  (lien, fond, contenu), et un script unique pour gérer les 4.

 

Encore que le fond, on peut le mutualiser, comme le script. Et d'ailleurs, si on veut coder proprement, il faudrait complexifier un peu mais je t'en reparlerai plus tard (principalement, il s'agit de prendre en compte les cas où l'utilisateur n'a pas activé javascript).

Répondre

 Photo Gregoryen 14 févr. 2015

Oui pour le fond, il est noir.

Mes titre vert clair, et mon texte blanc donc on peut le mutualiser

 

J'ai compris en fait pour l'histoire des 3 block ^^


Ce message a été modifié par Gregoryen - 14 février 2015 - 11:26 .
Répondre

 Photo noisette 15 févr. 2015

J'ai eu pas mal de taf ces derniers jours,

je reviens en début de semaine.

 

Un lien qui va nous intéresser: http://www.invisioni...opup-class.html

mis là en pense-bête.

Répondre

 Photo Gregoryen 15 févr. 2015

Ok pas de soucis merci :)

Répondre