Luo tallennuspainike sivustoosi

Vinkit ja vianetsintä

Jos olet lisännyt tallennuspainikkeen koodiin ennen vuoden 2016 kesäkuuta, huomaa, että painikkeen Pin it -teksti on korvattu Tallenna-tekstillä 3.10.2017.

Tallennuspainikkeen avulla yrityksesi löydetään Pinterestissä. Kun lisäät tallennuspainikkeen sivustosi sivuille, asiakkaat voivat tallentaa mieluisat löytönsä Pinterestiin ja yrityksesi tuotteet saavat lisää näkyvyyttä. 
 
Jos käytössäsi on Wordpress-, Blogger-, Tumblr-, Wix- tai Squarespace-sivusto:
 
WordPress.com WordPress.com
Wordpressin Pin it -painikkeen lisääminen sivustoosi ei edellytä ylimääräistä koodia. Voit lisätä Pin it -painikkeen kaikkiin Wordpressissä julkaisemiisi teksteihin ottamalla sen käyttöön oletusjakoasetuksissa.
  1. Siirry Wordpress-blogin hallintaan.
  2. Valitse Settings ja sitten Sharing.
  3. Vedä Pinterest Sharing Buttons -osiossa Available Services -kohdasta Enabled Services-kohtaan.
  4. Jos haluat näyttää Pin It -painikkeen oletuskuvan, valitse avattavasta Button style -valikosta Official ​buttons.
  5. Tallenna valitsemalla sivun alareunassa Save Changes .
WordPress.org WordPress.org

Lataa osoitettaessa näytettävää Pin it -painiketta varten tarvittava laajennus WordPress.org-sivuston laajennushakemistosta.

Blogger Blogger
  1. Valitse Ulkoasu Bloggerin hallintakeskuksessa.
  2. Valitse muokkaa Blogitekstit-kohdassa.
  3. Vieritä Näytä jakopainikkeet -kohtaan ja valitse valintaruutu.
  4. Järjestä kohteet tarvittaessa uudelleen Järjestä kohteet -osiossa ja valitse Tallenna.
Tumblr Tumblr
Ensin täytyy lisätä JavaScript -rivi.
 
Lisää JavaScript-rivi näin:
  1. Valitse muokattava blogi Tumblrissa ja valitse Customize.
  2. Valitse Customize-näytössä Edit HTML.
  3. Vieritä koodin loppuun.
  4. Jos koodissa näkyy pinit.js -merkintä, voit lisätä widgetin.
  5. Jos merkintää ei näy, lisää seuraava koodi </body>-lopputunnisteen eteen: <script type="text/javascript" async src="//assets.pinterest.com/js/pinit.js"></script>.
 
Lisää osoitettaessa näytettävä Pin it -painike näin:
  1. Varmista, että olet lisännyt JavaScript-rivin yllä olevien ohjeiden mukaisesti.
  2. Valitse muokattava blogi Tumblrissa ja valitse Customize.
  3. Valitse Customize-näytössä Edit HTML.
  4. Vieritä koodin loppuun.
  5. Lisää​ koodi data-pin-hover="true" ennen yllä vaiheessa 4 mainittua kohtaa, jonka alussa on "src=". Muokattu rivi näyttää tältä: <script type="text/javascript" async data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script> .
  6. Päivitä esikatselu valitsemalla Update Preview. Pin it -painikkeen pitäisi tulla näkyviin, kun siirrät kohdistimen oikealla näkyvän esimerkkikuvan päälle. Jos painiketta ei näy, siirry takaisin vaiheeseen 4 ja tarkista että kaikki on OK.
  7. Valitse Tallenna.
Wix.com Wix.com
  1. Valitse Add (+) muokkausnäkymän vasemmasta laidasta.
  2. Valitse Social.
  3. Vieritä alareunaan ja valitse Pinterest Pin It.
  4. Vedä Pin it -painike sopivaan kohtaan sivulla.
  5. Pin it -painike luo Pin-lisäyksen valitun kuvan ja kuvauksen perusteella. Pin-lisäyksessä on linkki sille sivulle, jolla käyttäjä napsauttaa Pin it -painiketta.
Squarespace Squarespace

Opi lisäämään Pin It -painike Squarespace-sivustoon täällä

 
Jos haluat rakentaa painikkeen itse, päätä ensin, millaisen tallennuspainikkeen tahdot lisätä. Voit valita kolmesta vaihtoehdosta: 
 
  • Osoitettaessa näytettävä (näet painikkeen täällä): tallennuspainike tulee näkyviin, kun hiiren osoitin siirretään minkä tahansa sivulla olevan kuvan päälle.
    Learn how to build it Learn how to build it
    1. Siirry widget-sivulle.
    2. Valitse Painiketyyppi-osiossa Osoitettaessa näytettävä.
    3. Valitse painikkeelle haluamasi koko ja muoto. 
    4. Näet painikkeen esikatselun, kun pidät kursoria esimerkkikuvan päällä. Voit myös napsauttaa Pin it -painiketta, niin näet, miten se toimii.
    5. Kun olet tyytyväinen painikkeeseen, kopioi koodi Copy the code -osiossa.
    6. Liitä koodi juuri ennen jälkimmäistä </body>-tunnistetta niille sivuille, joilla haluat painikkeen näkyvän.
  • Kaikki kuvat (näet painikkeen täällä): painiketta napsauttamalla voi lisätä sivustosta Pinterestiin minkä tahansa kuvan. Tämä on helppo luoda.
    Learn how to build it Learn how to build it
    1. Siirry widget-sivulle.
    2. Valitse Painiketyyppi-osiossa Yksi kuva.
    3. Valitse painikkeelle haluamasi koko, muoto, kieli ja kuva. 
    4. Näet painikkeen esikatselun, kun pidät kursoria esimerkkikuvan päällä. Voit myös napsauttaa tallennuspainiketta, niin näet, miten se toimii.
    5. Kun painike on sellainen kuin haluat, kopioi sivun oikeassa laidassa näkyvä koodi.
    6. Liitä koodi tunnisteiden <body> ja </body> väliin niille sivuille, joilla haluat painikkeen näkyvän.
  • Yksi kuva (näet painikkeen täällä): tämä tallennuspainike on vain yhdelle sivulla olevalle kuvalle, ja sen luomiseen tarvitaan hiukan koodaustaitoa.
    Learn how to build it Learn how to build it
    1. Siirry widget-sivulle.
    2. Valitse painikkeelle haluamasi koko, muoto, kieli tai kuva. 
    3. Lisää niiden sivujen URL, joissa olevaan kuvaan haluat tallennuspainikkeen luoda. Sivu voi olla etusivu tai mikä tahansa muu sivu sivustossasi.
    4. Avaa uusi selainikkuna ja siirry sivustoosi.
    5. Napsauta hiiren oikealla painikkeella kuvaa, johon haluat lisätä tallennuspainikkeen.
    6. Valitse Copy Image URL.
    7. Palaa widget-sivulle ja liitä kuvan URL Image-kenttään.
    8. Kirjoita kuvalle kuvaus.
    9. Valitse Build It! niin pääset esikatseluun.
    10. Kun painike on sellainen kuin haluat, kopioi sivun oikeassa laidassa näkyvä koodi.
    11. Liitä koodi tunnisteiden <body> ja </body> väliin niille sivuille, joilla haluat painikkeen näkyvän.

Yleisiä ongelmia

Tallennuspainikkeen laskuri ei näy tai lukema on väärä
Taulunvalitsin ei avaudu uuteen ikkunaan, kun napsautat tallennuspainiketta
Osoitettaessa näytettävä lisäyspainike ei toimi.
Pinterestillä on vaikeuksia saada yhteys sivustooni

Laskuri näyttää niiden Pin-lisäysten määrän, joissa on linkki painikekoodissa määrittämääsi URL-osoitteeseen. Jos sivu ei ole sama kuin tällä hetkellä tarkastelemasi sivu, laskurin näyttämä lukema ei välttämättä vastaa odotuksia.

Jos käytät laskuria Kaikki kuvat -tallennuspainikkeen kanssa, laskurissa on niiden Pin-lisäysten määrä, joissa on linkki tällä hetkellä tarkastelemasi sivun URL-osoitteeseen.

Jos käytät painikkeen vieressä näkyvää laskuria eikä sivulta ole vielä tehty yhtään Pin-lisäystä, laskuria ei näytetä. Laskuri tulee näkyviin, kun sivulta tehdään lisäys.

Jos käytät kolmannen osapuolen laajennuksella toteutettavaa tallennuspainiketta, pyydä laajennuksen tekijää korjaamaan ongelma. 

Jos käytät omaa tallennuspainketta, kokeile näitä vinkkejä:

  • Varmista, että lisäsit JavaScript-rivin sivusi lähdekoodiin juuri ennen viimeistä tunnistetta.
  • Jos JavaScript-rivi esiintyy sivulla useaan kertaan, poista rivit viimeistä lukuun ottamatta.
  • Jos käytit sekä edistynyttä asynkronista JavaScript-riviä että standardiriviä, poista toinen niistä.
  • Jos käytät kolmannen osapuolen laajennusta, tarkista, lisääkö se pinit.js-rivin sivulle. Jos lisää, sitä ei tarvitse lisätä uudelleen.
Kaikki isännöintipalvelut eivät tue JavaScriptiä, joten et välttämättä pysty lisäämään koodia Pinterestin widget-työkalulla. Palvelussa saattaa kuitenkin olla saatavilla muita widgetien lisäystapoja.

Kokeile näitä vianetsintävinkkejä:
 
  • Varmista, että kuvien koko yhdessä suunnassa (korkeus tai leveys) on vähintään 100 kuvapistettä ja toisessa suunnassa vähintään 200 kuvapistettä. Osoitettaessa näytettävä tallennuspainike näytetään vain kuville, joiden koko on vähintään 120 x 120 kuvapistettä.
  • Varmista, etteivät kuvat ole CSS-taustakuvia ja että jokaisen kuvan src-attribuutti alkaa "img".
  • Lisää painikkeen koodi juuri ennen viimeistä tunnistetta.

Ongelma johtuu siitä, että Pinterest aikakatkaisee toiminnon ennen kuin Pin-lisäys saadaan tehtyä. Pinterest ei valitettavasti pysty korjaamaan ongelmaa, sillä se johtuu yleensä sivuston hitaudesta. Suosittelemme, että selvität asiaa itse.