Pagrindinis » WordPress » „WordPress“ greičio optimizavimas naudojant individualias socialinio bendrinimo piktogramas
„WordPress“ greičio optimizavimas naudojant individualias socialinio bendrinimo piktogramas
Tai gali atrodyti kaip lengva užduotis, tačiau „WordPress“ svetainės pridėjimas gerai veikiančių socialinių pasidalijimo mygtukų gali būti sudėtingas. Kai aš sakau gerai elgdamasis, aš turiu omenyje paprastus, lengvus, išteklius tausojančius, sparčiausiai socialinius dalijimosi priedus. Jie linkę valgyti tokius išteklius kaip beprotiška ir kodėl kas nors norėtų padidinti įskiepio įkrovimo laiką 25–35% tik tam, kad būtų rodomos kai kurios piktogramos jų svetainėje?
Geros naujienos yra tai, kad šiai užduočiai atlikti nebūtina turėti papildinio. Šioje instrukcijoje parodysiu, kaip galite lengvai pridėti pasirinktinius socialinio bendrinimo mygtukus iki „WordPress“ svetainės įrašų pabaigos tik kelios eilutės kodų.
1 veiksmas: sukurkite socialinio bendrinimo mygtukus
Naudosime paprastą bendrinimo mygtukų generatorių, patogų ir lengvai naudojamą žiniatinklio įrankį, kuris sukuria bendrinimo piktogramas. Pagrindinis šio app privalumas yra tai, kad mygtukai, kuriuos jis sukuria, veikia ant priekinės dalies jie neužkraus jūsų serverio taip pat galite išsaugoti savo vartotojų veiklą privačiai.
Norėdami sukurti savo pasirinktinius mygtukus, eikite čia ir paspauskite Pradėkite. Pasirinkite 1 iš 6 skirtingų mygtukų stilių. Spustelėkite Kitas ir pažymėkite socialiniai tinklai norite pridėti prie savo svetainės. Kai baigsite, turėsite užpildyti savo svetainės informaciją.
Šiame ekrane (žemiau) rasite dvi parinktis: „Nėra„ JavaScript “ ir „JavaScript“. Pažymėkite „JavaScript“, kadangi jis leis naršyklei dinamiškai aptikti URL, todėl lankytojai galės bendrinti kiekvieną įrašą atskirai ne tik pagrindinio puslapio URL..
Galiausiai pažiūrėkite į tiesioginį peržiūrą, atsisiųskite pasirinktą piktogramų rinkinį ir paimkite sugeneruotą kodą.
2 žingsnis: sukurkite vaiko temą
Dabar turėsite pridėti sukurtas piktogramas ir kodą į savo svetainę. Pirmiausia jums reikės sukurti vaikų temą.
WP vaiko temą galite lengvai sukurti naudodami mūsų pamoką, arba galite laikytis šio WP Codex straipsnio nuostatų. Jei jau turite, galite pereiti prie 3 veiksmo.
Vaiko tema susijusi su šiuo metu naudojamomis temomis - šiek tiek panašiu būdu, kaip vaikas susijęs su jo tėvais. Tai paveldi viską (stilių ir funkcionalumą) iš tėvų temos Bet tu gali pridėti papildomų funkcijų į jį.
Mūsų atveju papildomos funkcijos bus pasirinktiniai socialinio bendrinimo mygtukai.
Naudodamiesi šia funkcija galėsite pridėti socialines piktogramas, kur tik norite, naudodami savo pasirinktą kablys. Jei jūsų vaiko tema dar neturi funkcijų.php failo, savo vaiko temos šakniniame aplanke sukurkite tuščią teksto failą su pavadinimo funkcijomis ir pakeiskite jo išplėtimą į .php.
Į šį tuščią failą įrašykite šią eilutę:
Kai tavo funkcijos.php failas yra sukurtas pridėkite šį kodo fragmentą:
/ * * Prideda pasirinktines socialinio bendrinimo piktogramas * / funkcija add_social_sharing () ?>
Bendrinkite šį įrašą
Pagaliau ištrinkite HTML komentaro eilutę iš pirmiau pateikto kodo fragmento ir pakeisti jį HTML kodu Jūs sukūrėte 1 veiksmą su „Social Sharing Buttons Generator“.
4 veiksmas: nukopijuokite tinkamą šablono failą į vaiko temos aplanką
Pagal numatytuosius nustatymus atskirus įrašus valdo šablono failas single.php. Kartais - ypač šiuolaikiškesnėse temose - struktūros single.php yra sudėtingesnis, nes taip pat įkeliami papildomi šablonų failai. Šiame etape turime rasti tinkamą šablono failą, kuriame vėliau galime pridėti piktogramas.
Kad surastumėte tinkamas vietas socialiniams mygtukams, turime rasti šabloninį failą yra funkcija, įkelianti atskirų pranešimų turinį.
Atidarykite temos redaktorių „WordPress“ administravimo skydelyje Išvaizda> Redaktorius. Viršutiniame dešiniajame kampe rasite išskleidžiamąjį sąrašą, kuriame galite pasirinkti savo tėvų temą. Po išskleidžiamajame meniu galite matyti visus tėvų temos failų šablonus. Slinkite žemyn, kol rasite Vieno įrašo šablonas (vadinamas single.php) ir atidarykite.
Jei pagrindinė tema naudoja get_template_part () WP funkcija single.php failą, kuris reiškia, kad jis naudoja papildomą šabloninį failą vieno įrašo turiniui įkelti.
Pirmiausia turite išsiaiškinti, kas tai yra. Papildomo šablono failo pavadinimas yra pirmasis get_template_part () funkcija.
Pirmasis parametras yra 'turinys' tai reiškia, kad ieškome šablono failo content.php. Šį failą reikia nukopijuoti iš tėvų temos šakninio aplanko į vaikų temos šakninį aplanką, kad jį pakeistumėte.
5 veiksmas: pridėkite veiksmų kablys į dešinę šablono failą
Sukūrėme funkciją, pavadintą add_social_sharing () 3 žingsnyje, ir pridėjome jį prie pasirinktinio veiksmo kablio, pavadinto custom_social_share. Dabar turėsime pridėti šį kabliuką prie taško, kur norime, kad funkcija būtų vykdoma.
Čia yra kodo fragmentas, kurį turėsite įterpti į tinkamą vietą:
Toliau suraskime tinkamą vietą.
Atidarykite šablono failą, kurį pridėjote prie savo vaikų temos 4 veiksme kodų redaktoriuje arba „WordPress“ administratoriaus informacijos suvestinės temų redaktoriuje ir ieškokite turinys() funkcija.
Patikrinkite, ar yra a wp_link_pages () funkcija po turinys() funkcija. Jei yra, tuomet pirmiau pateikiamas kodo fragmentas; kitaip jis seka turinys() funkcija.
6 veiksmas: pridėkite CSS kodą į vaiko temą
Atidaryk style.css savo vaiko temos failą savo kodo redaktoriuje arba „WordPress“ administratoriaus informacijos suvestinės temų redaktoriuje, nukopijuokite 1 žingsnyje sukurtą CSS kodą, įklijuokite jį į failo pabaigą ir išsaugokite.
Į CSS failą pridėsime dvi papildomas eilutes, kad kiekvienoje temoje būtų tinkamai rodomos socialinės pasidalijimo piktogramos. Kopijuokite ir įklijuokite šį kodo fragmentą į style.css failas:
ul.share-mygtukai li a border: 0; ul.share-mygtukai li img display: inline;
7 veiksmas: įkelkite „Social Media Icon“ rinkinį į serverį
Įkelkite pasirinktą socialinės žiniasklaidos piktogramų rinkinį, kurį atsisiuntėte 1 žingsnyje į savo vaikų temos aplanką. Prijunkite serverį per FTP, sukurkite naują aplanką vaizdai jūsų vaiko temos aplanko (/ wp-content / themes / your-child-theme / images) šaknies viduje ir įkelkite čia esančią piktogramą.
Pavadiname aplanką vaizdai nes tai yra numatytoji vaizdo aplanko, kuriam naudojami paprasti bendrinimo mygtukai, generatorius.
8 veiksmas: patikrinkite piktogramos failų kelią
7 veiksme įkėlę socialinės žiniasklaidos piktogramas į serverį, svarbu patikrinti piktogramų failų kelią, kad įsitikintumėte, jog jos bus įkeltos.
Vaizdo failo kelias suteikia naršyklės užuominą apie jo vietą serveryje. Patikrinkime vaizdo takus viduje funkcijos.php vaiko temos failą. Atidarykite failą savo kodų redaktoriuje ir pereikite prie add_social_sharing () funkcija, kur reikia patikrinti HTML kodą, kurį sukūrėte naudodami paprasto bendrinimo mygtukų generatorių.
HTML kode rasite žyma su src kiekvienos piktogramos atributas. Patikrinkite, ar kiekvienas src atributai nurodo tikslią vietą, kur 7 veiksme buvo įkeltas jūsų piktogramų rinkinys.
Paprastas bendrinimo mygtukų generatorius prideda santykinius kelius į rinkmenas. Kartais naršyklės negali atkurti vaizdų, jei naudojate santykinį kelią, taigi tai yra gera idėja vietoj to naudokite absoliučius kelius. Tokiu būdu kiekviena naršyklė, kurią lankytojai gali naudoti, gali būti miręs, kad būtų užtikrintas reikalingų piktogramų failų vieta.
Santykinis vaizdo generatorius, pridedamas prie generatoriaus, atrodo toks:
Pakeiskime src kiekvienos piktogramos atributas absoliučiu keliu, tai reiškia, kad jis apims visą failo URL.
Aukščiau nurodytas URL kelias atrodys taip:
9 veiksmas: įkelkite modifikuotus failus ir aktyvuokite vaiko temą
Prijunkite savo serverį per FTP ir įkelkite visus šiame vadovėlyje sukurtus failus, kurių dar neprisijungėte: funkcijos.php, style.css, ir atitinkamą šablono failą (šioje pamokoje arba single.php arba content.php).
Galiausiai aktyvuokite vaiko temą WP administravimo skydelyje po Išvaizda> Temos Meniu.
Dabar esate pasirengę su savo itin lengvu, taupančiu, pritaikytu socialinio bendrinimo piktogramomis. Galite prisijungti prie interneto ir patikrinti, ar jis veikia jūsų svetainėje.
Išvada
Šioje instrukcijoje parodiau jums, kaip pridėti individualius socialinio bendrinimo mygtukus iki vieno įrašo pabaigos. Bendrinimo piktogramas galite pridėti prie bet kurios kitos svetainės svetainės naudodami sukurtą veiksmų kablelį.
Tiesiog pridėkite 5 veiksme naudojamą kodą į vietą, kurioje norite rodyti mygtukus:
Jei norite įdėti piktogramas kitur, turėsite rasti tinkamą šablono failą. Atskirus puslapius valdo šablono failas page.php, o žiniasklaidos priedai, pvz., vaizdai, yra įkeliami attachment.php.
Jei norite rodyti socialinio bendrinimo mygtukus kitoje svetainės vietoje, galite ją rasti naudodami „WordPress“ šablono hierarchiją.
