Widgetit

Widgetit ovat pieniä, interaktiivisia elementtejä, jotka näyttävät tiettyä sisältöä tai toimintoja verkkosivustollasi ilman monimutkaista ohjelmointia. Meidän tapauksessamme widgetit näyttävät profiilit suoraan sivullasi. Ne voidaan sijoittaa joustavasti mihin tahansa kohtaan, ja ne tarjoavat kävijöille suoran yleiskatsauksen profiileihin ilman, että heidän tarvitsee poistua alustaltasi. Integrointi tapahtuu helposti JavaScriptin kautta, jolloin widget sulautuu saumattomasti verkkosivustosi nykyiseen ulkoasuun

Widgetin upottaminen verkkosivustollesi tapahtuu JavaScriptin avulla. Muutamalla koodirivillä voit sijoittaa widgetin haluamaasi paikkaan. Lisäät vain annettun HTML-tagin HTML-koodiin sivullasi


    <script src="https://static-edge-p6.cdn.es-infra.net/public/ept.latest.js"></script>

Target-toteutuksen avulla voit määrittää tarkasti, mihin kohtaan verkkosivustollasi widget tai muu sisältö näytetään. Tätä varten HTML-koodiin lisätään pieni DIV-kontaineri, joka toimii widgetin kohdepaikkana. JavaScriptin avulla widget ladataan ja näytetään tässä kontainerissa


    <div id="target"></div>

Widgetin upotuksessa voit määrittää erilaisia parametreja mukauttaaksesi ulkoasua ja sisältöä. Alla selitetään P6Embed-olion tärkeimmät parametrit:

id: Määrittää, missä HTML-elementissä widget näytetään. Käytä tässä DIV-kontainerin id-tunnistetta, esim. target
ety: Määrittää widgetin tyypin tai kategorian, esim. et1. Tämä arvo ohjaa, millainen näyttö ladataan
bsw: Määrittää widgetin leveyden pikseleinä. Esimerkki: 500 asettaa leveydeksi 500px
bsh: Määrittää widgetin korkeuden pikseleinä. Esimerkki: 600 asettaa korkeudeksi 600px
eun: Määrittää profiilin nimen, joka näytetään widgetissä. Esimerkki: 'PROFILE_NAME'
border: Määrittää widgetin kehystyypin. Esimerkki: '1px solid #000' luo mustan 1 px vahvuisen kehyksen

Näillä parametreilla voit joustavasti mukauttaa widgetin ulkoasua ja verkkosivustosi vaatimuksia vastaavaksi. Konfiguroinnin jälkeen widget näytetään kutsumalla metodia .render():


    new P6Embed({
        id:  'target',     // where to place the iframe
        ety: 'et1',        // __ety
        bsw: 500,          // __bsw (width)
        bsh: 600,          // __bsh (height)
        eun: 'PROFILE_NAME',   // __eun (profile name)
        border: '1px solid #000'
    }).render();

Täydellisessä toteutuksessa voit upottaa widgetin verkkosivustollesi yhdessä vaiheessa. Ensin sijoitat kohde-elementin, johon widget ladataan, ja lisäät sen jälkeen JavaScript-koodin, joka alustaa widgetin. Näin sekä ulkoasu että toiminnallisuus aktivoituvat automaattisesti, ja widget on heti interaktiivisesti käytettävissä. Tämä menetelmä varmistaa, että widget ladataan oikein ja kaikki määritetyt parametrit kuten leveys, korkeus, profiilinimi tai kehys otetaan käyttöön


<div id="target"></div>
<script type="text/javascript">
    new P6Embed({
        id:  'target',     // where to place the iframe
        ety: 'et1',        // __ety
        bsw: 500,          // __bsw (width)
        bsh: 600,          // __bsh (height)
        eun: 'PROFILE_NAME',   // __eun (profile name)
        border: '1px solid #000'
    }).render();
</script>

Widgetit

Widgetien toiminnan ja mukautusmahdollisuuksien havainnollistamiseksi alla on joitakin käytännön esimerkkejä. Jokainen esimerkki näyttää, miltä widget voi näyttää verkkosivustollasi ja miten eri parametrit vaikuttavat ulkoasuun ja käyttäytymiseen

Erillinen suostumus ei ole tarpeen, koska alustamme käyttää tietojen pseudonymisointia. Henkilötietoja ei tallenneta suoraan, joten käyttäjien anonymiteetti säilyy eikä suora tunnistaminen ole mahdollista. Upottamisen yhteydessä myös ulkoisilla verkkosivuilla käsittely tapahtuu pseudonymisoidusti, jolloin käyttäjien yksityisyys säilyy suojattuna

Widgetit

Widgetit

Pieni widget

Esimerkki:

Keskikokoinen widget

Esimerkki:

Suuri widget

Esimerkki: