Come faccio ad inserire un banner con il codice, in una pagina che sto costruend 
Autore: gaetano L.
Visite 270,
Followers 2,
Condiviso 0
COME FACCIO AD INSERIRE UN BANNER CON IL CODICE, IN UNA PAGINA CHE STO COSTRUENDO
Postato il
Ciao.
Procedi passo passo per un semplice banner centrato 500px x 500px. Apertura in zoom e pulsante di chiusura:
Realizza una pagina test oppure utilizza quella dove deve apparire il BANNER
Vai al PASSO 3 POI seleziona la tua pagina (non la devi aprire) Vai sulle proprietà della pagina in alto e fai click sull'icona. Vedi che ti si apre il pannello per inserire il codice. Troverai delle opzioni tu inizialmente scegli e inserisci tutto il codice che segue DOPO L'APERTURA DEL TAG HEAD E INSERISCI TUTTO QUELLO CHE VEDI ▼
<!-- BY LOSMANETTONE.IT 2026 -->
<div id="popup-banner">
<div class="popup-content">
<button class="popup-close">
<svg width="24" height="24" viewBox="0 0 24 24">
<line x1="4" y1="4" x2="20" y2="20" stroke="white" stroke-width="2"/>
<line x1="20" y1="4" x2="4" y2="20" stroke="white" stroke-width="2"/>
</svg>
</button>
<img src="https://www.miosto.it/images/miaiimagine.jpg" alt="Banner">
</div>
</div>
<style>
/* Overlay */
#popup-banner {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
display: flex;
justify-content: center;
align-items: center;
z-index: 9999;
animation: popupZoom 0.35s ease-out;
transform-origin: center;
}
/* Box del popup */
.popup-content {
position: relative;
width: 500px;
height: 500px;
background: #fff;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 0 20px rgba(0,0,0,0.4);
}
/* Immagine */
.popup-content img {
width: 100%;
height: 100%;
object-fit: cover;
}
/* Bottone X */
#popup-banner .popup-close {
position: absolute;
top: 10px;
right: 10px;
background: rgba(0,0,0,0.6);
border: none;
padding: 6px;
border-radius: 4px;
cursor: pointer;
}
/* Animazione zoom */
@keyframes popupZoom {
0% {
transform: scale(0.6);
opacity: 0;
}
100% {
transform: scale(1);
opacity: 1;
}
}
</style>
Ora dobbiamo inserire lo script e lo mettiamo DOPO L'APERTURA DEL TAG BODY
<script>
// Chiudi popup al click sulla X
document.querySelector(".popup-close").onclick = function() {
document.getElementById("popup-banner").style.display = "none";
};
// Chiudi popup cliccando fuori dal riquadro
document.getElementById("popup-banner").onclick = function(e) {
if (e.target.id === "popup-banner") {
this.style.display = "none";
}
};
</script>
Al contrario se non vuoi inserire codici strani e servirti delle opzioni di INCOMEDIA (Consigliato) vai al PASSO 1 poi fai click su MESSAGGIO PUBBLICITARIO. Nelle opzioni in alto a sinistra abilita il banner poi sulle opzioni TIPO MESSAGGIO hai 4 scelte. Ognuna ha un suo setup. Trova quella che fa al caso tuo e setta a destra dove deve apparire cioè in quale pagina deve apparire il banner. Puoi regolarne la durata e la visualizzazione se solo una volta o sempre e cioè ogni volta che si apre quella pagina.
Qual'è la differenza tra le due operazioni?
Con il codice se sei addentrato e sai dove mettere mani fai come ti pare ......colori,transizioni,animazioni,durata,tempi ecc viceversa, con le Opzioni di INCOMEDIA , secondo me più che sufficienti, fai un semplice banner.
Buon lavoro.
Autore
buon giorno roberto, grazie x l'aiuto. Io gia, il codice c'è lo anche il banner perchè e un banner religioso, lo devo solo inserire nella pagina del sito. mi puoi dire come si fa ? grazie
Ciao Gaetano, di solito si mette sulla pagina scelta Step 3 si scegle la pagina sulla mappa, Proprietà di Pagina, poi Esperto, quindi Prima della chiusura del TAG HEAD.
Bisogerebbe verificare il tuo codice, dipende dal tipo di codice, a volte una parte potrebbe andare in prima dell'apertura del TAG BODY. Fai qualche test, ciao.
ciao, ... hai un motivo per non preferire un semplice messaggio pubblicitario se è in formato immagine...?...
... se invece come pare che hai detto hai già un tuo codice, come quelli che oggi molti generano con l’AI o come i miei DIV_CUSTOM, devi fare attenzione a non commettere errori tipici dei meno esperti...!...
...ad esempio, se nel tuo codice sono presenti tag riservati e propri della struttura della pagina, devi eliminarli con attenzione. Questi tag devono essere univoci e devono essere solo quelli generati automaticamente dal programma...
... in pratica, nel tuo codice non devono essere presenti tag come:
<html></html>
<head></head>
<body></body>
...!... questi vanno rimossi...!...
............
... il tag <style> invece può essere inserito nella sezione Esperto > HEAD (3ª opzione), ma non è obbligatorio: può anche funzionare in base alla priorità determinata dalla posizione nella pagina...
... i tag relativi agli oggetti come <div>, <span>, e simili non devono assolutamente essere inseriti nella sezione HEAD, ma vanno posizionati nella sezione BODY; ...puoi inserirli:
> nella sezione Esperto (5ª o 6ª opzione);
> oppure, in modo più semplice e immediato, incollando il codice in un Oggetto Codice HTML appositamente creato nella pagina (ad esempio come ultimo elemento della griglia);
... salvo controindicazioni, lo stesso vale anche per eventuali tag <script>...
... se qualcosa non è chiaro o hai difficoltà, puoi postare il tuo codice: lo valuterò volentieri entrando nello specifico...
... aggiungo inoltre che, con un mio codice EXTRA, è possibile fare in modo che all’apertura della pagina si avvii automaticamente lo ShowBox con i contenuti di una pagina (immagini e testo) che avrai predisposto appositamente per questo scopo...
.
ciao
.
vediamo se ora accetta l'immagine esplicativa che prima non mi aveva accettato
Non conosco il tuo codice quindi non saprei che dirti se non quello di provare quello che ti ho indicato qualche post sopra cambiando il puntamento... ora fittizio.... con la tua immagine posta sul server.Ovviamente ci sono altri mille modi di farlo; qua non esistono esclusività da scienziati, almeno nel nostro caso.
Se posti il tuo codice posso vedere se è corretto o manca qualcosa.
Nel frattempo, giusto per chiarezza, ti spiego in sintesi il nostro codice:
Il codice che ho postato funziona già così com’è: lo incollo nella sezione HEAD di X5, apro la pagina… e magia: banner, overlay, X che chiude.
Giusto per evitare che ci si perda in teorie quantistiche dell’HTML, chiarisco una cosa semplice semplice:
incollare un <div> nella sezione HEAD di X5 non significa metterlo nel <head> della pagina.
WebSite X5 non è così ingenuo:
Insomma, X5 fa il suo lavoro.
Quindi no, non sto “inserendo un div nel head”, non sto violando le leggi dell’HTML, e non sto rischiando l’estinzione dei panda. Sto semplicemente usando X5 come è progettato:
Risultato? Funziona.
E quando una cosa funziona, di solito non serve un dottorato per accettarlo. Se poi vogliamo trasformare un banner in un trattato di ingegneria aerospaziale, liberi di farlo… ma io nel frattempo continuo a far apparire popup che funzionano.
Autore
ciao roberto questo e il codice che mi esce , e ti inserisco anche il banner. io ho la versione evo
<!---Codice Sorgente Lista Siti Cattolici ----><BR><a href="http://www.siticattolici.it/"><img src="http://www.siticattolici.it/images/siticat.gif" border="0" width="120" height="40"></a><BR><!--- Fine del Codice Sorgente -->
il codice corretto sarebbe Https (vedi sotto) che si apre in una nuova finestra meglio non uscire dal sito
semplicemente mettilo in un oggetto HTML in una pagina dove vuoi che esca
<!---Codice Sorgente Lista Siti Cattolici ---->
<a href="https://www.siticattolici.it/" target="_blank" rel="noopener">
<img src="https://www.siticattolici.it/images/siticat.gif" border="0" width="120" height="40">
</a>
<!--- Fine del Codice Sorgente -->
questo codice mostra un’immagine cliccabile, ma NON è un “banner popup” come quello che ti ho proposto. È semplicemente un link con un’immagine dentro, cioè un normalissimo banner statico.
È come mettere una foto nella pagina.
Se vuoi solo mostrare un’immagine cliccabile nella pagina → Sì, va benissimo.
Se vuoi un banner popup come quello che ti ho fatto io → No, questo codice NON fa quel lavoro.
Dove inserirlo in WebSite X5 ▼
Questo codice va messo:
in un Oggetto HTML nella pagina oppure nella sezione Esperto → Contenuto della pagina (BODY)
NON va messo nel HEAD.