Kuidas teisendada ajaveebipostitused Facebooki kiirartikliteks - kodeerimine pole vajalik

Minu sõber palus mul aidata teisendada nende saidile varem postitatud artiklid Facebooki kiirartikliteks. Pärast otsustasin koostada juhendi, mis aitab mittetehnilistel inimestel oma vanu artikleid, ajaveebi postitusi või veebisisu teisendada.

Isegi kui te ei tea, mis on Facebooki Instant-artiklid, võite neid juba kasutada. Facebooki IA KKK lehe järgi:

„Instant Artiklid on mobiilse kirjastamise vorming, mis võimaldab uudiste kirjastajatel levitada Facebooki rakendusse artikleid, mis laaditakse ja kuvatakse tavalisest mobiiliveebist koguni kümme korda kiiremini.“

IA dikteerib sisu avaldamise standardi, mille tulemuseks on nii meeldiv kujundus kui ka optimeeritud toimivus artiklitele, mis on avatud Facebooki mobiilirakendusest. Lisateavet mõjuhinnangu eeliste kohta saate lugeda.

Facebook pakub hulgaliselt võimalusi IA tootmise ja muundamise kiirendamiseks. Kuid näib, et praegused juhendid on mõeldud arendajatele või suurematele ettevõtetele, kellel on keerulisem kirjastamise ökosüsteem.

Raske on leida juhendeid varem postitatud artiklite teisendamiseks, mis ei hõlma Facebooki IA API, PHP SDK ega WordPressi pistikprogrammi. Mitte-arendajate jaoks nõuab enamik neist tööriistadest liiga palju tehnilist kogemust. Isegi kui proovida leida WordPressi pistikprogrammi õpetust, tuleb kaevata Facebooki arendajaportaali dokumentatsiooni. See ei ole ideaalne mitte-arendajate jaoks, kes vallandatakse enne, kui nad selle lehe kunagi üles leiavad.

Töötame koos, et muuta kõik veebis juba avaldatud artiklid Facebooki Instant-artikliks! Õppetööks kasutame artiklit kuulsuste koera kohta filmist „Anchorman“.

Gruuvime!

0 samm: ettevalmistamine

Me ei pea installima ühtegi pistikprogrammi ega integratsiooni, kuid HTML-i lähtekoodiga töötamiseks on vaja tekstiredaktorit. Erinevaid koodile orienteeritud tekstitoimetajaid on palju, kuid selle näite huvides soovitan Sublime'i. Sellel on kõik vajalikud funktsioonid ja seda on värske installi abil lihtne kasutada.

Kui olete Sublime'i installinud, tahame alla laadida koodimalli, mida kasutame, GitHubGist.

Ekraani paremas servas:
1. Paremklõpsake nuppu "Toores"
2. Klõpsake vaikimisi nuppu "Salvesta link kui ...". See peaks vaikimisi salvestama HTML-failina nimega "mall".

Nüüd on meil koodiredaktor ja mallikood, mida me redigeerime!

Seadistamise viimase sammu jaoks:
1. Alglaadimine ülev
2. Avage mallifail, mille me alla laadisime

1. samm: ribareklaami pildi saamine

Hüppa tagasi oma Interneti-brauserisse ja leidke selle reaalajas saidilt artikkel, mille soovite teisendada. Kõigepealt haarame ribareklaami pildi, mida kasutame Facebooki Instant-artikli ülaosas.

Selleks paremklõpsake pilti ja valige “Copy image address”.

Lülitage tagasi malli juurde, mis meil Sublime'is avatud on. Otsige koodilt silti

, mis asub real 35 (rea number on vasakpoolses servas nähtav).

Tõstke esile algne URL, mis asub 36-l jutumärkide vahel, ja asendage see, kleepides pildi aadressi, mille kopeerisime ribapildilt. Vormingu säilitamiseks veenduge, et URL-i mõlemal küljel oleks topelt jutumärgid. Ja ärge kindlasti kustutage rea lõpus olevat “/>”.
Muutke teksti 
sees olevat teksti pealdisega, mida soovite kuvada pildi all. Kujutise omistamine läheb sageli sinna.

Pange tähele, kuidas oleme ettevaatlikud, et mitte muuta koodi ühtegi vormingut. Märgendite ise segamine põhjustab hiljem vigu, kui proovime veebisaiti renderdada. Ülev värvib meie koodi, mis aitab meil tuvastada vigu või HTML-koodide mittevastavust.

Pöörake erilist tähelepanu sellele, kuidas me joonise pealkirja teksti asendasime. Redigeerime paljusid teisi väärtusi täpselt samal viisil.

2. samm: metaandmete toomine

Nüüd on vaja natuke teavet koguda. Kuna suurem osa neist andmetest peaks olema hangitav ilma lähtekoodi uurimata, töötab selle teabe käsitsi kopeerimine hästi. Vajame seda lähtekoodi hiljem siiski, seega pole selle avamisel mingit kahju.

  • Algne artikli URL
  • Artikli pealkiri
  • Artikli alapealkiri
  • Artikli autor (id)
  • Kuupäeva ja kellaaja artikkel avaldati algselt
  • Kuupäeva ja kellaaja artiklit värskendati viimati

Kui seda teavet on keeruline saada, võime kasutada veebisaidi lähtekoodi. Sellele andmetele juurdepääsu viis sõltub sellest, millist brauserit kasutate.

Chrome: CTRL + U või paremklõpsake → vaata lehe allikat
Firefox: paremklõpsake → Kuva lehe allikas
Safari: Safari menüü → Eelistused → Täpsemad, lubage menüüribal „Näita arendamismenüüd”, seejärel menüü Arendamine → Kuva lehe allikas
Lähtekood peaks seda meenutama

Nüüd, kui meil on lähtekood ja algne veebisait üleval, alustame meie teabe otsimist.

Pealkiri: Kopeerige artikli pealkiri ja asendage see malli 14. rea siltide

piires sõnaga “artikli pealkiri”. Lähtekoodis on see tavaliselt siltide piires. Näiteks,

artikli pealkiri

muutub

Anchormani kuulsuste koerte Baxteri elu 15 minutit

Subtiitrid: Sama nagu ülalpool, kuid koos subtiitritega. Kasutage seda malli 15. rea siltide

siseselt artikliartikli subtiitrite asendamiseks.

URL: kopeerige reaalajas veebisaidi artikli URL. Kasutage seda malli 7. real kuvatava URL-i asendamiseks. Näiteks:

muutub ...

Avaldamise aeg: malli real 18 saate nimetada artikli algselt avaldamise kuupäeva ja kellaaja. Pidage meeles, et parameeter “datetime” on väga konkreetses vormingus. Datetime = ”” sees olevad andmed määravad metaandmed (ei kuvata), samas kui siltide “> ” vaheline tekst dikteerib, mis kuupäeva näidatakse (siin võib olla mis tahes vormingus).

Näiteks,
 11. november kell 16:44 
Kuvatakse järgmiselt: 11. november kell 16:44
Muudame selle kuupäevaks: 24. juuli 2017, kell 18:30
 24. juuli 2017, kell 18:30 
Viimane värskendusaeg: sama plaan nagu ülalpool, kuid malli real 21.

Autor (id): malli read 24–27 tähistavad autorit, kelle nimi lingib kusagil veebis. Ridad 28–31 tähistavad autorit, kelle nime pole lingitud. Võite kopeerida kogu vastava autori koodiploki ja kleepida see eelmisele plokile järjestikku, seejärel redigeerida seda vastavalt vajadusele. Saate seda teha ka mitme autori jaoks. Vaadake allpool toodud näidet lihtsa nimega + pealdistega autorite kohta.

3. samm: korpuse sisu kopeerimine

Nüüd toome välja artikli sisu, mille tahame teisendada. Seal on lai valik sisutüüpe, näiteks segameediumid, väljamõeldud JavaScript, manustatud sisu. Keerukama sisu korral on suurem võimalus, et asjad ei tööta ilma tõrkeotsinguta, seega võib läbisõit erineda.

Ma selgitan, kuidas töötada teksti, piltide (staatiliste või gifide) ja videoga, kuna need on enamiku minu silmapilkste artiklite aluseks.

Lähtekood on tõenäoliselt sadu (või isegi tuhandeid) read. Kehasisu alguse leidmiseks on lihtne trikk teha artikli põhiteksti paari esimese sõna jaoks „Otsi”. Tahame kopeerida oma põhiteksti alguses olevast sildist

kuni sildi

juurde (ja kaasa arvatud), mis järgneb artikli lõppsõnadele.

Järgmisena peame selle oma malli viima. Malli rea 58 lähedal peaks olema järgmine rida:

artikli sisu

Tõstke esile see kogu rida ja kleepige üle sisu, mille kopeerisime artikli reaalajas lähtekoodist. Märkus. Kopeerisime lähtekoodist avamise

ja sulgemise

, mistõttu kleepime need siin malli üle. Teises

-märgendite komplektis on kood, mis järgib põhiteksti, kuid selle stiil on stiil - ärge kopeerige seda oma tekstiga.

* Kas teil on video, mille soovite oma mõjuhinnangusse kaasata? Muutke URL-i siltide vahel 64-st rea ümber, nagu tegime ribareklaami pildi URL-iga 1. sammus.

Juriidilised märkused: rida 84. See tekst on väga väike ja teie artikli lõpus.

4. samm: kellad ja viled (reklaamid, Analyticsi jälgijad ja muu)

Soovitan selle sammu praegu vahele jätta. Kui soovite kinnitada, mida seni teinud oleme, töötab või kui teil pole kohandatud reklaame või jälgijaid, jätkake 5. juhisega.

Võrreldes teiste patenteeritud artiklite teisendamise tööriistadega on üks Facebooki kiirartiklite parimatest omadustest see, et saate hoida kohandatud analüüsi jälgijaid ja reklaame, mida juba kasutate oma saidil.

Iga kohandatud integratsioon on erinev ja tõenäoliselt ka raskustes. Selle näite jaoks kasutame liikluse analüüsi ja jälgimise tööriista ChartBeat. Alustusjuhendi leidmiseks saame kasutada Google'i kiiret otsingut “ChartBeat Documentation”.

Mõne ettevõtte dokumendileht võib olla suunatud arendajatele. Kui see teie jaoks ei sobi, otsige selle asemel õpetust.

ChartBeat annab meile kõik koodid ja juhised nende integreerimise lisamiseks.

Selles juhendis öeldakse meile järgmist: nii me teemegi:

Sisestage see skript vahetult enne sulgevat  silti:

Nüüd, kui oleme lisanud oma ChartBeat-jälgija, peame tegema mõned kiired muudatused, et jälgija teaks, kuidas meie ChartBeat-kontoga sünkroonida.

ChartBeat'i koodilõigu kood, mida peame kohandama

Iga esiletõstetud rida (välja arvatud .useCanonical) vajab redigeerimist, et see saaks andmeid logida.

MUUDATUSED ("=" -st paremal)
.uid - teie ChartBeat konto unikaalne ID
.domain - algse artikli täielik domeen
.sektsioonid - jaotise / žanri / siltide nimi, mille alla teie artikkel kuulub
.authors - selle teosega seostatava autori nimi

Bingo! Olete lisanud jälgija ja see seob saadetavad andmed teie ainulaadse ChartBeat kontoga. Salvestage muudetud mallifail ja olgem valmis avaldama.

5. samm: vahetu artikli juurutamine

Minge Facebookis oma hallatava lehe armatuurlauale, mille soovite postitada. Minge avaldamisriistade ja artiklite loendi juurde. Klõpsake paremas ülanurgas sinist nuppu „+ Loo”.

IA armatuurlaud

Nüüd peaks teil paluma kleepida uue artikli kood.

Valige mall, mida me redigeerime, kogu kood ja kleepige see siia. Tulemus päästa! Saate selle mustandi avaldada, kui te seda vajalikuks peate, või kavandada selle postitamine etteantud ajal, kasutades armatuurlauda.

Palju õnne, olete valmis! Ma ei jõua ära oodata, millal ma loen vingeid artikleid, mida kavatsete avaldada.

Hei, ma olen Nick Walsh.

Olen Wolframi teadusuuringute tehniline evangelist ja Major League'i häkkimise hakatonide treener, kellel on kirg tehnoloogia, e-spordi ja õpilaste arendajate võimaluste vastu.