 |
|
|||
Sezione del telaio dedicata alla realizzazione e |
||||
|
|
|||
..:: Iframe per accessori e gadget web ::.. Un iframe ci permette di visualizzare il contenuto di una pagina web dentro un'altrapagina web, personalizzando le misure della larghezza e dell'altezza in base alle necessità, quindi molto utili se non indispensabili per realizzare accessori e gadget Spesso gli accessori e i gadget per pagine web hanno dei codici molto lunghi e in alcuni casi sono divisi in due parti, una si scrive tra <head> e </head> e l'altra tra <body> e </body> alcuni script vanno in conflitto con altri presenti nella pagina, altri ancora si possono postare una sola volta in una pagina, quindi realizzarli in una pagina esterna e visualizzarli tramite una "finestra" personalizzata è davvero comodo e utile * Opzione inevitabile per chi vuole realizzare accessori e gadget da far prelevare
Il codice base per un iframe è questo:
Vediamo come procedere... Se vogliamo realizzare un accessorio o un gadget web per il nostro sito creiamo una nuova pagina,a cui daremo un nome indicativo di ciò che contiene, datario, calendario, almanacco, ecc, ecc. (* Una cartella apposita per queste utilità è consigliata, sarà più semplice trovare in seguito le pagine per aggiornamenti e/o modifiche e ovviamente avremo lo spazio del sito più ordinato *) Iniziamo con lo style della pagina, imposteremo il colore di sfondo che abbiamo nelle altre pagine del sito o il colore di sfondo della pagina in cui vogliamo inserire l'accessorio/gadget e proseguiamo con le classi di eventuali contenitori, div o table, che ospiteranno i codici
* Con i parametri margin-top: 0 px; margin-left: 0 px; inseriti nel tag body impostiamo la posizione del contenuto nella pagina in alto a sinistra senza margini * [***] Aggiungiamo i parametri per il testo, font-family:nome font; font-size : **px; color: #******; * Con i parametri margin-left:auto; margin-right:auto; inseriti nei contenitori, ne impostiamo la posizione corretta nella pagina e del contenuto 
Se non volete utilizzare contenitori inserite i parametri per il testo nella classe css del body,aggiungendo il parametro text-align:center; si annullerà margin-left: 0 px; eliminatelo, il contenuto si visualizzerà centrato e senza margine all'inizio della pagina (top) Scriviamo o incolliamo i codici necessari per l'accessorio/gadget che vogliamo realizzare facendo attenzione a dove occorre inserirli affinché funzionino correttamente, cioè se tra <head>***</head> o tra <body>***</body>Possiamo realizzare accessori e gadget utilizzando solo i contenitori, contenitori e immagini o realizzare delle basi grafiche come sfondo per i contenitori dei codici. Salviamo la pagina e mettiamola online, se lavorate direttamente sul sito vi basterà salvare e andare in anteprima per aprirla nel browser, se invece lavorate con un editor html dovrete fare il trasferimento in fpt tramite l'editor stesso o caricando il file da pc al vostro hosting Copiate quindi url dalla barra del browser o scrivetela voi per inserirla nel tag iframe Per le misure in larghezza e altezza regolatevi in base ai contenitori o all'eventuale base grafica fate delle prove con uno sfondo a contrasto nella pagina in cui avete scritto il codice iframe * Cliccate sull'immagine per ingrandire e vedere maggiori dettagli  Con alcuni editor è possibile visualizzare il lavoro in due finestre, una con il codice e l'altra con l'anteprima, è comodo perché si fa prima a settare le misure, inoltre c'è la possibilità di sistemare le dimensioni della "finestra" direttamente con il mouse cliccando sui puntini neri che vedete nello stamp, io uso un editor obsoleto e lo dovrò cambiare, appena ne trovo uno gratuito, che abbia queste caratteristiche e funzioni con ogni tipo di linguaggio vi avviso^^ altrimenti c'è Adobe Dreamweaver ma costa parecchio... E abbiamo finito, sistemate le misure possiamo incollare nella pagina il codice dell'iframe nel punto in cui vogliamo far visualizzare il nostro accessorio/gadget Realizzare accessori e gadget da far prelevare Piccola premessa per chi gestisce un blog o un forum, per realizzare accessori/gadgetper pagine web è necessario uno spazio hosting, cioè un sito web in cui creare le pagine dei vari lavori, ce ne sono diversi che offrono spazio free, io ho lavorato solo su Altervista e mi sono trovata sempre bene, tanto spazio gratuito, tanti accessori e utilità per gestire al meglio il sito, se volete approfondire e creare un account visitate il mio sito dedicato alla piattaforma Un sito su Altervista Quindi, si crea una pagina per ogni accessorio o gadget e si procede come descritto sopra, ma nella classe css del body non potremmo inserire un colore di sfondo, le pagine dovranno essere "trasparenti" affinché si possano utilizzare su qualsiasi sfondo, sopratutto se i lavori non hanno una base con contorni definiti, tipo una tag grafica, una table o un div con bordi e sfondo * Ecco un esempio pratico Come potete vedere nel primo esempio, se la pagina che contiene il lavoro si lascia bianca o si inserisce un colore di sfondo l'effetto non è gradevole, quindi modificheremo il parametro con: background-color=transparent;
Con i contenitori che hanno bordi definiti non ci sono problemi, basterà fare attenzione alle misure dell'iframe Nel codice dell'iframe, solo a favore di Internet Explorer ora Microsoft Edge, aggiungeremo il parametro allowtransparency="true" altrimenti si visualizzerà comunque uno sfondo biancoUna volta realizzati i vari accessori/gadget occorre preparare una pagina in cui mostrarli, se vi serve potete leggere i tutorial Pagina anteprima gadget e Textarea per scrivere il codice iframe in modo che si possa prelevare Spero di essere stata chiara in tutti i passaggi ^_^ Vi auguro buon lavoro ma sopratutto buon divertimento! Ciao alla prossima^^ Penelope ♥
|
🌷 Molto apprezzato
|
.gif){kind=small}
Commentario...
un suggerimento o una critica ^_^
I vostri commenti in questa pagina...
ૡPenelope ♥ ~ 21/01/2024 23:01:40Cara Grazia WordPress è sicuramente la scelta migliore che si possa fare per avere uno spazio professionale semplice da gestire, conosco la piattaforma piuttosto bene e so che è anche molto versatile, per il mio telaio però preferisco un sito tradizionale mi piace trafficare con i codici ^_^ Un abbraccio forte a te
Grazia ~ 21/01/2024 08:21:23Buongiorno e buona domenica Penelope! ❤️ Sai, io adoro come te i siti statici, ma per quel che riguarda gli spazi che personalmente costruisco con WordPress, sono tutti realizzati con software esterni acquistati di editing tecnico-grafico, nel mio caso non utilizzo le basi pronte fornite da Altervista, ma decido ogni singolo componente (anche la struttura interna delle pagine ecc.). Avevo bisogno di un blog per argomentare e WordPress era la scelta più professionale a disposizione! ? sempre un piacere passare a trovarti, un abbraccio forte forte a te e ai ragazzi ed a presto
ૡPenelope ♥ ~ 20/01/2024 22:57:04Grazie carissima Grazia i tuoi complimenti sono davvero graditi, gli iframe sono una grande risorsa web e capire come utilizzarli al meglio può essere molto utile, spero ^_^ ho provato ad utilizzare WordPress con Altervista ma non fanno per me i cms, preferisco un sito indipendente da codici preimpostati Un abbraccio forte
Grazia ~ 19/01/2024 16:27:52I nostri adorati iframe... :) Complimenti per la chiarezza, mi è piaciuto molto come hai descritto i vari passaggi, sei stata come sempre bravissima! Chi utilizza WordPress (ad es. su Altervista) ha la comodità di un blog e la possibilità anche di caricare pagine web complete, per questo lo adoro, c'è pure l'accesso FTP alla cartella dei contenuti, volendo...♥ Ma i siti prettamente statici hanno sempre il loro fascino....un abbraccio carissima!
~ Pagina visitata da 5782 utenti
Segui il telaio su Facebook
* Info sezione...
Mi farebbe molto piacere la condivisione
dei miei tutorial ma vi sarei anche molto grata
se evitaste di fare copia e incolla su altri spazi
del mio lavoro, linkate le pagine, avvisatemi
ricambierò senza problemi. Grazie ♥
Basi e utilità pagine web
html tag scrittura pagine web
- Box effetto rilievo
- Basi CSS pagina web
- CSS elemento div
- CSS div struttura sito
- CSS sito responsive Flexbox
- CSS table
- CSS table struttura sito
- CSS file esterno
- Cbox - Chat per brevi messaggi
- Cbox - Theme editor
- Cursore
- Font personalizzato nel sito...
- Iframe per accessori e gadget
- Iframe per sito web
- Immagini
- Ipertesto - Link
- Link style
- Link ancora o interno
Marquee-
Marquee speciali -
Marquee javascript - Sfondo pagina
- Table basi e style
- Table sfondo
- Table scroll
- Table lavori
- Testo, font e personalizzazioni
- Testo scorrevole left
- Testo scorrevole up
- Textarea
Script per pagina
Script per gadget
Preleva anche tu una tag Help donna
Aiutami a diffondere il più possibile informazioni
utili alle donne vittime di abusi... Grazie!
Link del telaio...
| ೡ Il telaio di Penelope ☆ Template webset e blog ☆ Un sito su AlterVista ☆ Gif & co... |
I vostri messaggi...  =ahamiah= ~ 29/03/2026 09:48:10Buona domenica delle Palme, ho riscoperto il vostro forum e vi faccio i complimenti. Ho prelevato il codice di uno dei vostri saluti con data. Grazie a buon lavoro. ૡScritto in Datari con saluto more image  Cris ~ 28/03/2026 18:34:53Ciao, sono passata per un salutino. Buon fine settimana! ૡScritto in Commenti telaio...  Angel ~ 21/03/2026 16:59:16Ho letto il tuo messaggio inizio pag. : "Codice marquee deprecato..." Io avevo sul mio sito frasi scorrevoli e ora sono ferme!! Non so più come fare... a inserire una frase scorrevole! Mi puoi aiutare? Grazie cmq Penelope. Grazie di tutte le tue meraviglie che crei. Buona domenica! ૡScritto in Home  ParisNeoni ~ 21/03/2026 10:33:31I've gone through presumably numerous articles on this same subject this month and none of them hit home the way yours did. There's a clarity here that's tough to fake. ૡScritto in Home  ૡPenelope ♥ ~ 19/03/2026 21:16:39Ciao cara Sari mi fa molto piacere  volevo lasciare un saluto da te ma il blog è privato quindi lo faccio qui, un abbraccio forte forte buon blog!ૡScritto in Calendari fiorellini  Sari ~ 19/03/2026 12:54:53Sono Sari di vocedivento e sto allestendo il mio blog pasquale. A questo scopo ho prelevato il calendarietto a fiorellini azzurri.Grazie, come sempre. Ciao ૡScritto in Calendari fiorellini  Cris ~ 16/03/2026 15:25:23Ciao. Ho preso un tuo Almanacco, è perfetto per il mio blog. Grazie! ૡScritto in Almanacco soft  Sabry ~ 10/03/2026 11:39:07Io ti adoro ... vorrei tanto essere brava come te, ti seguo da anni e rimango sempre affascinata dalla tua astuzia e bravura e creativitá ♥ Prendo spunti ♥ Grazie di ♥ ૡScritto in Sfondo pagina  Gabriella ~ 09/03/2026 18:37:40Ciao Penny, come sempre i tuoi lavori sono molto eleganti ,ne ho prelevato due per adesso ;) grazie ૡScritto in Decori pagine Primavera |
|
|
html & script Tutorial è online dal 2011 e dopo una lunga pausa ripartiamo da... 2 anno, 6 mesi, 15 giorni ೡ Copyright © Penelope 2008 - 2026 Tutti i diritti riservati www.iltelaiodipenelope.it |
|
|
 |
Ciao cara come stai? Spero bene sono passata per un saluto veloce ♥