Come costruire un widget per il mio sito web

Question

Sono molto nuovo per l'intera programmazione - finora ho solo esperienza con costruzione di siti web, database, ecc

Al momento ho un sito web dove gli utenti possono condividere i loro acquisti on-line .

Desidero creare un widget che altri siti Web possano integrare nel proprio sito. Il widget mostrerà gli acquisti recenti inseriti sul mio sito Web e gli utenti dovrebbero essere in grado di inserire i loro acquisti direttamente attraverso questo widget senza dover venire al mio sito web.

Il mio sito Web è costruito su PHP utilizzando Zend Framework e utilizza il backend Mysql.

Alcuni dei siti Web di cui sto parlando hanno accettato di aggiungere il widget se non invadente e se tutto ciò che devono fare è inserire 4 righe di codice javascript nelle loro pagine. Suppongo che questo dovrebbe funzionare come il codice AdSense di Google in cui inserisci il codice javascript di googles e gli annunci iniziano a essere visualizzati.

Questa è l'idea, ma non ho idea di come procedere: chiunque può indicarmi la giusta direzione. Qualsiasi esempio o tutorial su come farlo.

Esempio di Google Adsense Codice

 
<script type='text/javascript'> --></script><script type="text/javascript"><!-- 
google_ad_client = "pub-06xxxx453614"; 
google_ad_width = 728; 
google_ad_height = 90; 
google_ad_format = "728x90_as"; 
google_ad_type = "text"; 
google_ad_channel = "3407467430"; 
google_color_border = "38B63C"; 
google_color_bg = "FFFFFF"; 
google_color_link = "0066CC"; 
google_color_text = "000000"; 
google_color_url = "0066CC"; 
google_ui_features = "rc:0"; 
//--> 
</script> 
<script type="text/javascript" 
    src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> 
</script> 

Si tratta di una forma di widget come pure - Come viene JavaScript utilizzato qui? Grazie

Answer 1

Non sono esperto nel campo del widget ma una "direzione" consiste nell'utilizzare un iframe generato dinamicamente nella pagina che ospiterà il widget.

Questo è il codice JS scriverà qualcosa di simile:

<iframe src="http://www.mywebsite.com/services/widget.php" {other attributes here} /> 

L'iframe è di solito contenuto nel markup (html) che si occupa della presentazione del widget nella pagina di hosting. Il file javascript può contenere gestori (associati a eventi nel widget, ecc.).

La destinazione dell'iframe può essere uno script .php (o altro) che emetterà l'html o qualsiasi altra cosa dal tuo sito web. L'output può contenere informazioni/dati dal tuo Database (Mysql come dici tu) ed eseguire qualsiasi operazione su quei dati.

È un approccio (l'iframe) utilizzato in diversi casi. Assicurati di avere familiarità con la finestra dei termini, genitore in javascript prima di scrivere codice JS nei casi in cui sono coinvolti iframe e frame (generalmente come gestire casi in cui una pagina contiene frame che a loro volta possono contenere altri frame, ecc.)

Spero che questo possa farti iniziare dando un'idea generale/approccio su questo argomento.

Sono sicuro che avete sentito parlare di annunci Google. Il modo di includere gli annunci di google in una pagina web è chiaramente spiegato nelle pagine degli annunci google. È sufficiente aggiungere uno script e un codice che a sua volta produce il seguente html:

<iframe allowtransparency="true" frameborder="0" height="100" hspace="0" id="google_ads_frame1" marginheight="0" marginwidth="0" name="google_ads_frame" scrolling="no" src="http://googleads.g.doubleclick.net/pagead/ads?client="{PARAMS}" style="left:0;position:absolute;top:0" vspace="0" width="900"></iframe> 

Il contenuto di questo telaio sono gli annunci reali (i link degli annunci che vedete nella pagina).

Il tag iframe non è l'unico generato dal google ads javascript nella pagina. Vengono creati anche altri tag (html) che gestiscono i problemi relativi alla presentazione.

Answer 2

Ci sono molti modi per farlo. L'esempio di andreas è carino. È anche possibile esporre i dati desiderati in un formato come JSON o XML e quindi rendere il 'widget' un po 'di Javascript che renderà questo in base ad alcune preferenze. Un esempio (un po ') semplice da cui iniziare è twitter search widget.

Buona fortuna!

Answer 3

Ad esempio, si desidera visualizzare lo stato del sito Web memorizzato sul sito Web come widget sul sito Web del partner.

Ecco un semplice COME:

widget di

1.Creare script sul vostro sito, diciamo: http://yourwebsite.com/widget1.php?data=value&date2=value2

2.On quello script, riempirlo con qualcosa di simile:

<?php 
$data=get_xss_free($_GET['data']); 
$data2=get_xss_free($_GET['data2']); 
//do your process here 
//then, display it: 
echo "<div>This is my widget data!</div>"; 
?> 

3.Tell il vostro partner per incorporare in questo modo:

<iframe src="http://yourwebsite.com/widget1.php?data=value&date2=value2"></iframe> 

Answer 4

Forse Coul d guardare utilizzando il PHP GD library per creare dinamicamente un'immagine. In questo modo si avrebbe soltanto gli utenti di inserire un tag di immagine in questo modo la loro sui siti web:

<img src="http://www.yourwebsite.com/widget.php?user={USERNAME}" width="500" height="250" alt="Your Widget" /> 

Poi nel file widget.php hai tutta la logica del database, ecc, che utilizza questi dati e rende un'immagine. Facebook utilizza un approccio simile a questo chiamati "badge Profilo" e sono accessibili in modo simile: http://www.facebook.com/badge.php?id= {ID}&format=png&params={OTHERPARAMS}

ma tieni presente che in modo dinamico la creazione di un immagine non è probabilmente il modo più semplice per avvicinarsi a questo e la soluzione iframe già postato sembra abbastanza buono e sarà sicuramente più facile da creare.