Tokia funkcija kaip svetainės mygtukas „aukštyn“daro interneto š altinį patogesnį lankytojams. Tai padeda lengvai pereiti iš bet kurios puslapio vietos į puslapio viršų. Tai būtina internetinėms parduotuvėms ir svetainėms su dideliais straipsniais, kuriuos reikia ilgai slinkti žemyn.
Kam tai kainuoja
Šiuo metu daugumoje svetainių nėra tokios funkcijos kaip mygtukas „aukštyn“, ir čia nėra nieko ypatingo. Tačiau jo naudojimas gali duoti daug pranašumų ir interneto š altiniui, ir jo lankytojams.
Nauda lankytojams
Taip dažnai atsitinka, kai interneto š altinio puslapis yra labai apkrautas informacija, kai informacinis straipsnis užima daug vietos ir puslapį tenka slinkti žemyn pelės ratuku. Be to, straipsnio pabaigoje gali būti daug komentarų apie tai.
Kai lankytojas skaito straipsnį, slinkti puslapį žemyn nėra nieko varginančio, tačiau kai tekstas baigiasi ir reikia judėti aukštyn, tai pradeda šiek tiek nuobodžiauti. Daugelis žmonių tiesiog tingės ilgai slinkti ir tiesiog uždarys svetainę, užuot dar kartą pasivaikščioję po jos platybes.
Naudodami mygtukąjei norite akimirksniu pereiti į puslapio viršų, patogiau leisti laiką svetainėje.
Interneto š altinio nauda
Paties š altinio teigiamus aspektus lemia praeities veiksniai, nes paprastesnis naršymas svetainėje pagerina elgsenos veiksnius, nes visi lankytojai bus aktyvesni ir pereis į kitus puslapius.
Taigi šie elgesio veiksniai turi įtakos visų paieškos sistemų požiūriui į svetainę ir pagerina padėtį paieškos rezultatuose.
Kaip patiems pasidaryti mygtuką „aukštyn“svetainėje
Spręskite toliau. Visada galite patys sukurti svetainės slinkties mygtuką bet kurioje TVS, atlikdami tik kelis labai paprastus veiksmus:
- vaizdo kūrimas;
- scenarijaus kūrimas;
- sukurti mygtuko stilių;
- pridedama į svetainę.
Mygtuko vaizdas
Norėdami svetainėje pridėti mygtuką „aukštyn“, pirmiausia turite sukurti pačią piktogramą, kurią spustelėjęs vartotojas pereis į puslapio viršų. Norėdami tai padaryti, galite naudoti paruoštas parinktis, tarp kurių visada galite pasirinkti tinkamiausią.
Siekdami pagerinti mygtuko išvaizdą, turime atlikti kai kuriuos patobulinimus, būtent sukurti sprite, kuris leistų derinti fono vaizdus pagal CSS ir taip sukurti iš jų animaciją.
Grafikos darbams galite naudoti bet kurį redaktorių. Tačiau patogiausias pasirinkimas būtų internetinė paslauga. PIXLR, nes čia nėra ko atsisiųsti ir galite jį naudoti tiesiogiai savo naršyklėje.
Norėdami pradėti, pasirodžiusiame redaktoriaus lange pasirinkite lauką „Įkelti vaizdą iš kompiuterio“. Kaip pavyzdį paimkime raketos vaizdą.
Jei pasirinktos piktogramos matmenys yra per dideli, turėsite atlikti mažo dydžio koregavimą. Norėdami tai padaryti, eikite į viršutinį meniu ir pasirinkite lauką „Redaguoti“, o po „Nemokama transformacija…“
Toliau šalia nuotraukos atsiranda specialūs žymekliai, kuriuos judant galite keisti vaizdo dydį. Norėdami išlaikyti proporcijas, galite naudoti klavišą „Shift“, kurį laikant reikia perkelti mėlynus žymeklius. Šių veiksmų pabaigoje gaunamas raketos vaizdas.
Kitas žingsnis – sukurti sluoksnio kopiją.
Dabar reikia šiek tiek perkelti raketos paveikslėlį iš naujo sluoksnio. Norėdami tai padaryti, bus patogu naudoti perkėlimo įrankį, esantį antrajame kairiojo meniu stulpelyje, ir klaviatūros rodyklę aukštyn.
Dabar turime padaryti viršutinį vaizdą nespalvotą. Tai galima padaryti naudojant elementą „Pataisa“- „Atspalvis / sodrumas“viršutiniame meniu. Kad būtų visiškai sumažintas prisotinimas, slankiklį Saturation reikia nustatyti ties –100. Šis veiksmas leis jums sukurti efektą, kai mygtukas „Aukštyn“taps nespalvotas į spalvotą, kai užveskite pelės žymeklį virš jo.
Paskutinis prisilietimas – aplink dvi nuotraukas pašalinama papildoma erdvė. Norėdami tai padaryti, kairiajame meniu pasirinkite elementą "Apkarpyti" irstačiakampyje pasirenkame tik dvi raketas. Norėdami atlikti apkarpymą, paspaudžiamas klavišas Enter.
Rezultatas yra vaizdas, kuriame nėra papildomos laisvos vietos. Turėsite užsirašyti gauto vaizdo plotį ir aukštį, nes šie duomenys bus naudingi atliekant kitą veiksmą.
Norėdami išsaugoti, turite paspausti "Failas" - "Išsaugoti", kur kairėje pastraipoje "Mano kompiuteris" įrašome vaizdo pavadinimą (tik angliškas maketas), pasirinkite formatą (šiuo didžioji raidė, PNG) ir spustelėkite mygtuką „Taip“.
Failas su mygtuko „aukštyn“scenarijumi
Šiuo atveju scenarijaus rašyti nereikia. Bus galima naudoti viešąją versiją, atlikus kai kuriuos galutinio kodo pakeitimus.
Norėdami tai padaryti, turite atsisiųsti bet kurį kodo rengyklę. Populiariausias ir nemokamas variantas yra Notepad++. Įdiegę turite nukopijuoti ir įklijuoti visą šį kodą:
| $(document).ready(function(){ $(langas).scroll(function () {if ($(this).scrollTop() > 0) {$('scroller').fadeIn ();} else {$('scroller').fadeOut();}}); $('scroller').click(function () {$('body, html').animate({scrollTop: 0}, 400); return false;}); }); |
Toliau viršutiniame meniu spustelėkite „Failas“– „Išsaugoti kaip…“, po to išsaugome kodą.js formatu. Po to galėsite naudoti šį kodą savo svetainėje, įkeldami scenarijaus failus ir vaizdus į ją naudodami FTP ryšį.
Įdiegti svetainėje
Norėdami nustatyti svetainės slinkimo aukštyn mygtuką, turite įterptireikalingas vietos kodas. Jį turite įvesti prieš žymą.
Mygtuko stiliaus kūrimas naudojant CSS
Dažniausiai svetainės mygtukas „aukštyn“yra apačioje („poraštė“).
Šis kodas turi būti pridėtas prie svetainės style.css failo:
|
/mygtukas aukštyn/ .scrollTop{ background:url('images/up.png') 0 0 be kartojimo;/natyvaus vaizdo kelias/ width:39px;/ mygtukas plotis/ height:96px;/50% mygtuko aukštis/ bottom:5px;/padidėjimas apačioje fiksuotoje padėtyje/ left:89%;/perkelti į kairę/ }.scrollTop:hover{ background-position:0 -108px; } /fono poslinkis/" |
Šiuo atveju reikės tų vaizdo pločio ir aukščio duomenų. Belieka tik įvesti gautus duomenis į kodą, o svetainės mygtukas „aukštyn“bus paruoštas! Kas dar?
Wordpress svetainės mygtukas aukštyn
Šiai TVS mygtuką „Aukštyn“galima padaryti naudojant papildinius, taip pat atskirai.
Papildinių metodas yra patogiausias ir lengviausias įdiegti, nes tereikia spustelėti diegimo mygtuką ir sukonfigūruoti visas papildinio meniu funkcijas.
Pastarąjį pasirinkimą reikia vertinti atsargiai, nes su juo bus nesunku užkrėsti virusą svetainėje. Populiariausias ir patikrintas variantas yra įskiepis, vadinamas Scroll Back To Top. Jį galite atsisiųsti naudodami standartinę Wordpress papildinių paiešką.
Šis plėtinys turidaug funkcijų, o „Wordpress“svetainės mygtuką „aukštyn“pritaikyti bus labai paprasta. Visų reikšmių keisti visai nebūtina, tereikia sukonfigūruoti mygtuko išvaizdą ir vietą svetainės puslapyje.
Kaip matote, nustatyti mygtuką su papildiniais yra labai paprasta. Tačiau yra vienas svarbus niuansas – kiekvienas įdiegtas papildinys įkelia TVS. Tai gali turėti įtakos interneto š altinio greičiui. Štai kodėl dauguma svetainių savininkų visus pakeitimus bando atlikti tiesiogiai kode, o ne naudodamiesi trečiųjų šalių plėtiniais. Galite sukurti HTML svetainės mygtuką „aukštyn“, kad sunaudotų išteklių bus kuo mažiau.
Prieš keisdami visus Wordpress sistemos failus, turite sukurti jų atsargines kopijas. Tada galite atlikti visus veiksmus, kad sukurtumėte savo mygtuką, aprašytą aukščiau.
Joomla mygtukas „aukštyn“
CMS Joomla taip pat palaiko įskiepių, pvz., Wordpress, diegimą. Sėkmingiausia „Joomla 3“svetainės mygtuko „aukštyn“versija yra plėtinys, vadinamas puslapio viršuje.
Šioje TVS bet kurį papildinį galima įdiegti naudojant „Plėtinių tvarkytuvę“. Tam jums reikia:
- atsisiųskite papildinį iš interneto;
- paspauskite mygtuką „Naršyti“plėtinių tvarkyklėje;
- pasirinkite atsisiųstą archyvą;
- spustelėkite „Atsisiųsti“ir įdiekite.
Dabar turite jį suaktyvinti „Papildinių tvarkytuvėje“. Už taiturite eiti į šią skiltį, rasti papildinį ir perjungti jo būseną į „įjungta“.
Kitas žingsnis yra sukonfigūruoti visus plėtinio parametrus naudojant tą patį skyrių, kuriame dešinėje pusėje reikia rasti šio papildinio „Pagrindinius parametrus“.
Puslapio viršuje yra šios funkcijos:
- Run in/administratorius – įjungiama parinktis ne tik interneto š altinyje, bet ir pačiame Joomla TVS skydelyje.
- Button Reveal Position – kiek pikselių vartotojas turi atsukti atgal, kad būtų rodomas mygtukas aukštyn.
- Praleisti mygtuko tekstą – teksto buvimas ant mygtuko.
- Visada viršuje – svetainės puslapis visada bus rodomas iš viršaus. Kai naudojate inkarus slinkdami į konkrečią puslapio vietą, šios parinkties įjungti nereikia.
- Smooth Scroll – palengvina puslapio slinkimą.
- Slinkties trukmė – laikas, po kurio puslapis visiškai persikels į pradžią.
- Slinkties perėjimas – prideda daugiau vaizdinių slinkimo efektų.
- Perėjimo palengvinimas – judėjimo „susilpninimas“į puslapio viršų.
- Nuorodos vieta – piktogramos vieta. Pagal numatytuosius nustatymus mygtukas yra apatiniame dešiniajame kampe.
- Naudoti stilius – individualus mygtuko stilius, kurį galima nustatyti toliau esančiame lauke. Jei perjungta į neigiamą reikšmę, visi stiliaus nustatymai bus paimti iš aktyvios svetainės temos.
- Nuorodos stilius – mygtuko stiliaus parametrų įvedimo laukas.
Norėdami tinkinti mygtuko „aukštyn“stilių, turite turėti bent minimalųCCS žinios. Priešingu atveju turėtumėte pakeisti priešpaskutinio parametro reikšmę į „Ne“.
Kitas svarbus niuansas – įprastame užraše ant piktogramos yra angliškas tekstas: Grįžti į viršų. Tokio teksto negali būti svetainėje rusų kalba, todėl tiesiog turėtumėte jį išjungti įskiepio parametruose arba pakeisti į rusišką.
Norėdami pakeisti šį užrašą, turite eiti į svetainės serverį naudodami FTP arba priegloboje integruotą failų tvarkyklę. Tada kataloge „/administrator/language/en-GB/“turite rasti failą pavadinimu „en-GB.plg_system_topofthepage.ini“.
Prieš keisdami tekstą, turėtumėte pakeisti šio dokumento kodavimą į UTF-8. Taip bus rodomos normalios rusiškos raidės.
Toliau rasime šią eilutę:
| " PLG_SYS_TOPOFTHEPAGE_GOTOTOP="Grįžti į viršų"" |
ir pakeiskite frazę kabutėse į rusų kalbą. Galite naudoti tokias frazes kaip "Aukštyn!", "Į viršų!" arba „Aukštyn!“.
Pabaigoje turėsite išsaugoti pakeistą failą ir patikrinti, ar nėra Joomla svetainės mygtuko „aukštyn“.
Ucoz mygtukas aukštyn
Ucoz svetainės mygtukas „aukštyn“turės būti atliktas naudojant kodo įvedimą, nes neįmanoma prijungti šios TVS įskiepių. Tačiau tam nereikia ilgai tyrinėti sistemos failų ir ieškoti reikiamų eilučių, tereikia įklijuoti nedidelį kodą tinkamoje vietoje.
Jei norite mus įdiegtibūtina:
- eikite į „Valdymo skydas -> Dizainas -> Dizaino valdymas (šablonai) -> Svetainės apačia;
- įterpkite scenarijų (jį galite rasti oficialioje projekto svetainėje ir trečiųjų šalių š altiniuose).
Išvada
Po to apatiniame dešiniajame kampe pasirodys piktograma, perkelianti vartotoją į patį puslapio viršų.
Kaip matote, bet kurios TVS grįžimo mygtuką nustatyti nebuvo ypač sunku. Galite naudoti tiek automatinį diegimo metodą (įskiepius), tiek rankinį. Tačiau pastaroji parinktis išlieka tinkamiausia, nes ji neturi neigiamos įtakos svetainės veikimui.
Galite naudoti HTML svetainės mygtuką „atgal į viršų“, kad sumažintumėte svetainės išteklių suvartojimą, nes daug plėtinių gali turėti neigiamos įtakos š altinio našumui. Vienas „aukštyn“mygtuko įskiepis negalės didelės įtakos svetainės puslapių įkėlimo laikui, tačiau dažniausiai vartotojas TVS yra įdiegęs bent keliolika įskiepių. Tokiu atveju bet koks papildinys gali neigiamai paveikti svetainės puslapių našumą.
