Kolasim, need your help please.... 
Autor: Axel Hello,
Sometimes it could be nice to offer a solution to display a message on a specific page for the customer.
Like Paypal has some issues with the AD Blocker plugin into Chrome my idea should be to offer a way to display a nice popup (not the default JS)to prevent the user to do something to be sure to avoid any issue.
Here my code into a single HTML page (outside of WSX5 is to display this customizable popup)
The main issue here is to configure the link to the button 'Close '. It does not works... probably because it is inside a Jquery request... I cannot found the good syntax to create the link on this button...
Your help would be useful on this 
Now it should be nice to include this one into the page where the boutik is configured (it is an example). The best way to do that is to include this code into the page properties and not into an HTML object to be executed at page starting.
So I have included my code below into the page properties.
<html>
<head>
<meta charset="UTF-8">
<!--
<link rel='stylesheet' href='http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css'>
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/css/font-awesome.min.css'>
-->
<link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css'>
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/css/font-awesome.min.css'>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'>
<script src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/js/bootstrap.min.js'>
</head>
<body>
<form>
<!-- <button id="generate"type="button" onclick="notify_afs(BoxType, MonTitre, MonMessage)">Demo</button> -->
<a href="https://www.afsoftware.fr" target=_blank> </a>
</form>
<!-- Pour fenetre -->
<div id="notification" class="modal fade" >
<!-- Centrage fenetre -->
<div class="modal-dialog modal-sm">
<!-- Pour afficher la fenêtre -->
<div class="modal-content">
<div class="modal-header" style="background-color:#F0F0F0; border-radius:00px">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title"><i class="text-danger fa fa-exclamation-circle"></i> Error</h4>
</div>
<div class="modal-body">
<p>An error occurred...</p>
</div>
<div class="modal-footer" style="background-color:#F0F0F0 border-radius:00px">
<!-- <button type="button" class="btn btn-default" data-dismiss="modal">Fermer</button> -->
<!-- <input class="btn btn-default" data-dismiss="modal" type="button" value="Fermer1"> -->
</div>
<!-- Fin affichagefenêtre -->
</div>
<!-- Fin centrage->
</div>
<!-- Fin fenetre -->
<script>
notify_afs = function(boxtype, title, message){
var IconColor;
var IconSize;
switch (boxtype){
case "Success": /* box type */
icon = "fa-check-circle"; /* Icons from https://fontawesome.com/icons?d=gallery */
IconColor = 'green'; /* Icon color */
IconSize = '30px'; /* Icon size */
break;
case "Info":
icon = "fa-info-circle";
IconColor = 'blue';
IconSize = '30px';
break;
case "Warning":
icon = "fa-exclamation-triangle";
IconColor = 'orange';
IconSize = '30px';
break;
case "Error":
icon = "fa-times-circle";
IconColor = 'red';
IconSize = '30px';
break;
default:
}
$("#notification .modal-body p").text(message);
$("#notification .modal-title").html('<i class=" fa ' + icon + '" style="color:' + IconColor + ';font-size:'+ IconSize+' " ></i> ' + title);
// $("#notification .modal-title").html('<i class="' + color + ' fa ' + icon + '" ></i> ' + title);
// $("#notification .modal-footer").html ('<div style="float:left;"> <a href="https://www.afsoftware.fr" target=_blank> <strong> <font face="Verdana" color="#CC0000"> <span style="font-size:8pt;">www.afsoftware.fr</span> </font> </strong></div> </a><button type="button" class="btn btn-default" data-dismiss="modal">Fermer2</button>');
$("#notification .modal-footer").html ('<div style="float:left;"> <a href="https://www.afsoftware.fr" target=_blank> <strong> <font face="Verdana" color="#CC0000"> <span style="font-size:8pt;">www.afsoftware.fr</span> </font> </strong></div> </a href="https://www.afsoftware.fr"><button>Close 9</button></a>');
$("#notification").modal("show");
}
</script>
<script>
var MonTitre = 'Example of info message1';
var BoxType = 'Success'; // Success or Info or Warning or Error
var MonMessage = 'Do not forget to desactivate your AD Blocker to avoid payment issue !!!';
var a= 10;
var b = 200;
if (b > a ) {
notify_afs(BoxType, MonTitre, MonMessage);
}
else
{
var MonTitre = 'Titre AF Software Error';
var BoxType = 'Error'; // Success or Info or Warning or Error
var MonMessage = 'Errreur 1 !!!';
notify_afs(BoxType, MonTitre, MonMessage);
}
</script>
</body>
</html>
I have tried many things into the page properties to expand each code on the good each tag.... but no good result.
And now I have this one.
The popup is not on the top middla os the screen and the page is not correct... And also the Close button does not works... (may be first issue on the top of my message)
If you can help me on this it could be a nice option to help users to create their own popup on any page.
Thanks you
Axel
ciao, ...... malheureusement pour moi votre code contient plusieurs irrégularités, et ça ne fonctionne pas pour moi...
...peut-être que le code a été ruiné ici lors du copier/coller...
... joignez ici le code original correct au format ZIP...
... publiez également le LIEN sur votre page de test en ligne...
ciao
.
Autor
OK.
here the standalone html zipped file. Working for me outside of WSX5
and the link https://wsx5demo.afsoftware.fr/testpopup.html
The page is completly shifted
Thank you
...dans votre code, remplacez cette chaîne de code :
<button>Close 9</button>
...avec cette chaîne de code :
<button data-dismiss="modal">Close 9</button>
.
ciao
.
Autor
Not working...
click is ok now, but the page is always blank ..... and the href into the <a> tag is not used.
And the page is always not correct.
Autor
Hello KolAsim,
I found this one to activate the link on the button.
I replaced this line:
<a href="https://www.afsoftware.fr"><button class="btn btn-default" data-dismiss="modal">Close11</button></a>');
by:
<a href="#" target="_self" class="btn btn-default" role="button">Close 12</a> ')
If I modify the href with an URL, the link is ok
But the goal is to close the popup and to stay on same page and NOT to reload it to avoid to display agin the popup.!
And the second issue is the page shifted.
Again thanks
Autor
Now I have added data-dismiss. The popup is closed but on a blank page !
and the line is
<a class="btn btn-default" href="#" role="button" data-dismiss="modal" >Close 12</a>
Autor
Other issue is if I click outside of the popup the page is blank too.
... Je me suis toujours appuyé sur votre fichier ZIP, il y a quelques erreurs...
1) ... une balise <a> mal ouverte (</a>)!;
2) ... un commentaire avec une fermeture incorrecte incorrect(->)!;
3) ... un <div> manquant de la balise de fermeture (</div>)!;
...
... pour pouvoir vérifier j'ai ajouté une chaîne de texte dans le corps...
...
... le fichier ZIP correct est joint...
.
ciao
.
Autor
thank you...
I have included you new code.
The popup OK on the page which is not shifted
The button close the popup and we are staying on same page.
Juste on thing... clicking outside the button as same effect than close button... not possible to block this to force the user to click on the button
Autor
Other issue... With the installed code the menu is not displayed
And after clicking not any more.
...Je ne vois aucun menu...
...vous avez un mauvais code sur la page ; .. ouvrez les sources dans Firefox et vous les remarquerez surlignées en rouge, puis apportez les corrections nécessaires...
...
...pour désactiver le clic latéral dans la balise de script, ajoutez cette chaîne de code :
$(" .modal-content").parent().wrap('<div style="z-index:10;position:absolute;width:100%;height:100%"> </div>');
.
Autor
Je viens d'ajouter ce code et le clic est OK uniquement dans le popup. Super !!! ca avance :-)
Si j'enlève le code des propriétés de la page, le menu s'affiche comme cela.
En mettant le code, le menu ne s'affiche plus !
Et dans les sources il est bien dans le code
Dans Firefox je ne vois pas d'erreur en rouge sauf pour un × et un   sur ces 2 lignes
<buttontype="button" class="close" data-dismiss="modal" aria-label="Close"><spanaria-hidden="true">×</span>
</button><h4class="modal-title"><iclass="text-danger fa fa-exclamation-circle"></i> Error</h4>
...Je ne sais pas si cela peut dépendre de cela, mais il y a quelques erreurs dues à du code supplémentaire:
.
Autor
Oui j'ai vu après. J'ai nettoyé ces balises ....
Ce qui bloque l'affichage du menu c'est cela !!!!
Et si je met ces lignes ici comme il faudrait faire ci dessous plus rien ne fonctionne
Une dernière idée ? car le reste est OK
...J'ai maintenant vérifié votre page et la source est maintenant sans erreurs apparentes, ...OK...
...mais je ne vois pas le MENU, et je ne sais pas pourquoi cela se produit...
...malheureusement, je n'ai pas de PC avec le programme et je ne peux pas faire les tests...
...
... cependant, vous supprimez tout le code EXTRA que vous avez inséré dans la page...
... puis collez l'intégralité du fichier ZIP joint dans un objet de code HTML...
...ou vous le collez dans Expert dans la dernière (6ème) option : Avant de fermer la balise BODY...
.
Autor
J'ai copié le code dans la partie expert avant de fermer la balise BODY.
Cela fonctionne mais PAS DE MENU
Dans un objet HTML voila le résultat. Popup non actif et pas de menu.
Mais comme je l'ai dit plus haut le menu est dans les sources mais c'est bizarre il est considéré comme mobile hidden !!!
Autor
Hey Toc toc
I found how to display the menu. I have change the bosstrap code into the <head> byt his one
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>
And now the menu is displayed correctly
But now the issue is the displaying of the popup which is not correct
Previously
And now
How to get the previous visual ?
Thanks
... si tu veux je te laisse essayer ma simple invention universelle avec mon div_custom+iframe...
... si vous êtes intéressé, préparez une page cachée et sans appliquer les graphiques, contient le contenu, le message et le lien que vous souhaitez voir apparaître dans le message, dans une seule cellule max de 450px, ou un groupe de cellules de max 450px au total. ..
...
quand tu as posté le lien ici...
.
Autor
No div_customiframe into lastest zip file previously
... non, non, ce n'est pas là, et une autre chose personnelle à moi...
... après avoir publié le lien vers la page masquée et formatée comme mentionné précédemment, je pourrai l'évaluer et je vous le ferai savoir...
.
...maintenant je vois que le menu fonctionne..
...supprimez ce texte :
Test x CORPS - KolAsim
.
Autor
Here: https://wsx5demo.afsoftware.fr/empty.html
If you can also fix displaying like previousy
... peut-être que je n'ai pas compris ; ...Je vois tout blanc et la bannière semble fonctionner correctement...
.
Autor
tu as dit ...."sans appliquer les graphiques" j'ai donc supprimé le header / footer... je les remets
Autor
mais ici https://wsx5demo.afsoftware.fr/testpopup.html
tout fonctionne.
J'ai supprimé le X pour fermer et le lien du site web...
On va rester comme cela je pense !
...OK... ça marche...
.
Autor
Un grand merci pour ton aide
... ciao ...
Autor
Pour ceux qui ont jeter un oeil sur ce post, j'ai conclut en postant une explication complète pour aider chacun d'entre vous.
Le post est ici: https://helpcenter.websitex5.com/pl/post/261349
Encore Merci à KolAsim pour m'avoir assisté et que nous ayons pu proposer cette solution.
Axel