OG Image Generator – sotsiaalse jagamise pilditegija

Open Graphi pilt on pilt, mis kuvatakse, kui link kleepitakse vestlusesse, säutsusse või Slacki kanalisse – ja iga platvorm, mis renderdab lõuendit, mille suurus on ligikaudu 1200 × 630 pikslit, mille suuruseks on Facebooki og:image ja Twitteri summary_large_image kaardid. Valige vale suurus ja pilt on kärbitud, udune või pigistatud; muutke küljendus valesti ja pealkiri on loetamatu killuke hõivatud foto taustal. See tööriist koostab pildi tegeliku sihteraldusvõimega, kasutades Canvas 2D API-t, nii et see, mida näete eelvaates, on täpne pikslite ruudustik, mis tarnitakse PNG-vormingus.

Valige taust – ühtlane värv, kahe astmega lineaarne gradient, mis on koostatud kahest teie valitud värvist, või üleslaaditud foto, mida kärbitakse nii, et see täidaks kogu 1200 × 630 kaadri samamoodi nagu CSS-i taustasuuruses: kaas, mitte ei venitaks proportsionaalselt välja. Tippige pealkiri ja valikuline alapealkiri: mõlemat mõõdetakse tähemärgi haaval lõuendi fondimõõtudega, nii et ühele reale mahtumiseks liiga pikk pealkiri murrab teise või kolmanda reale reaalsel sõnapiiril, mitte ei valguks servast välja või kärbiks nähtamatult. Valige kesk- või vasakjoondus, valige teksti värv, mis loeb teie taustal, ja kukutage valikuline logo nurka kindlas loetavas suuruses.

Lõuendi all on neli väikest kaarti, mis näitavad, kuidas valmis pilt välja näeb, kui tõeline platvorm selle oma kroomi mähib: Twitteri/X-i kaardil kuvatakse ainult domeen ja pildi all rasvane pealkiri ilma kirjeldava reata, Facebook lisab pealkirja ja kirjelduse ploki kohale suurtähtedega domeeniriba, LinkedIn asetab domeeni pealkirja alla ilma kirjelduseta, sisestab oma pealkirja ja lisab kirjelduse kohale Discord. teema. Need on planeerimise eesmärgil kujundatud ligikaudsed stiilid – selgelt illustreerivad, domeenireaga, mille ise sisestate – mitte tegelike platvormide reaalajas toomine või ekraanipilt, kuna lingi jagamine ja iga platvormi enda roomaja laskmine lugeda teie lehe tegelikke og:image ja og:title metasilte on see, mis tegelikult loob reaalajas kaardi.

Kõik renderdatakse teie brauseris HTML-lõuendi elemendil kohapeal: pealkiri, alapealkiri, üleslaaditud taust ja logo ei lahku kunagi teie seadmest ning eksporditud fail on puhas canvas.toBlob() PNG, mis sisaldab ainult teie koostatut – allalaaditud pilti ei sisestata makettide ääriseid, võltsitud brauseri ribasid ega platvormi logosid. Kui teil on vaja ka eksporditud PNG suurust hiljem muuta või teisendada, käivituvad selle saidi kujutise suuruse muutmise ja kujutise teisendaja tööriistad kohe sealt, kus see pooleli jääb.