/ / Mygtukas "aukštyn" svetainėje: kaip tai padaryti

"Up" mygtukas svetainėje: kaip tai padaryti

Ši funkcija, pvz., Svetainės mygtukas "aukštyn"daro interneto šaltinį patogu lankytojams. Tai padeda lengvai pereiti iš bet kurio puslapio į viršų. Tai tiesiog būtina internetinėms parduotuvėms ir svetainėms su dideliais straipsniais, kuriems reikia ilgai slinkti žemyn.

Kas tai yra?

Šiuo metu daugelyje tokių svetainiųfunkcijos, tokios kaip mygtukas "aukštyn", ne, ir nieko apie tai nėra kritiškai. Tačiau jo naudojimas gali suteikti daugybę pranašumų tiek interneto šaltiniui, tiek jo lankytojams.

Privalumai lankytojams

Dažnai tai atsitinka, kai yra interneto išteklių puslapisyra labai pakrautas su informacijos kiekiu, kai informaciniame straipsnyje užima daug vietos ir jūs turite slinkti žemyn puslapį su pelės ratuku. Be to, straipsnio pabaigoje gali būti daug pastabų.

Kai lankytojas skaito straipsnį, niekonuobodus puslapio slinkimas yra ne, tačiau kai tekstas baigėsi ir reikia judėti į viršų, jis pradeda šiek tiek padirbėti. Dauguma žmonių paprasčiausiai bus pernelyg tingūs, kad galėtumėte ilgai slinkti, o jie tiesiog uždarys svetainę, o ne visur pasivaikščioję per savo erdves.

Naudojant mygtuką, kad iš karto pereiti prie puslapio viršuje, patogiau lankytis svetainėje.

Privalumai interneto šaltiniui

įjungti svetainę

Teigiamas šaltinis išteklius patirianuo praeities veiksnių, nes supaprastintas svetainės judėjimas gerina elgesio veiksnius, nes visi lankytojai aktyviau dalyvauja savo veiksmuose ir perkelia į kitus puslapius.

Taigi šie elgesio veiksniai įtakoja visų paieškos sistemų požiūrį į svetainę ir padeda pagerinti paieškos rezultatų vietą.

Kaip padaryti mygtuką "aukštyn" svetainėje patys

mygtuką į html svetainę

Mes suprantame toliau. Svetainės slinkimo aukštyn bet kurioje TMS sistemoje visada gali būti padaryta patys, tik kelis labai paprastus veiksmus:

  • sukurti vaizdą;
  • Scenarijaus sukūrimas;
  • sukurti mygtuko stilių;
  • pridedant prie svetainės.

Mygtuko vaizdas

Norėdami pridėti mygtuką "aukštyn" svetainėje, užkai paspausite piktogramą, jums reikės padaryti, kad piktograma patikslintų puslapį. Norėdami tai padaryti, galite naudoti parengtas parinktis, tarp kurių visada galite pasirinkti tinkamiausią.

Norėdami pagerinti mygtuko išvaizdą, turite atlikti keletą patobulinimų, būtent, sukurti spritą, pagal kurį galite susieti foninius vaizdus pagal CSS, taip sukurdami animaciją iš jų.

Grafiniams darbams galite naudoti bet kurį redaktorių. Tačiau patogiausias variantas bus internetinė paslauga PIXLR, nes čia nieko nereikės atsisiųsti ir galite ją naudoti tiesiai savo naršyklėje.

Norėdami pradėti rodyti redaktoriaus langą, pasirinkite laukelį "Įkelti nuotrauką iš kompiuterio". Pavyzdžiui, paimkite raketos vaizdą.

kaip padaryti mygtuką į svetainę

Jei pasirinktos piktogramos dydis yra per didelis, tadajums reikės nedidelis dydžio koregavimas. Norėdami tai padaryti, eikite į viršutinį meniu ir pasirinkite lauką "Redaguoti" ir po "Nemokama transformuoti ..."

Kitas šalia nuotraukos yra ypatingasžymeklius, judėdami, galite keisti vaizdo dydį. Norėdami išsaugoti proporcijas, galite naudoti "Shift" klavišą, užverždami jį, turite perkelti mėlynus žymeklius. Pasibaigus šiems veiksmams, gaunamas raketos vaizdas.

Kitas žingsnis - sukurti sluoksnio kopiją.

Dabar jūs turite perkelti raketos nuotrauką išnaujas sluoksnis šiek tiek padidėjo. Norėdami tai padaryti, bus lengviau naudoti perkėlimo įrankį, kuris yra antrame kairiajame meniu esančiame stulpelyje, ir klaviatūros rodyklę "aukštyn".

Dabar reikia, kad viršutinis paveikslėlis būtų juodai baltas. Tai galima padaryti naudodami "Korekcijos" - "Hue / Saturation" elementą viršutiniame meniu. Norėdami visiškai pakeisti spalvą, slapuko "Saturation" nustatymas turi būti -100. Šiuo veiksmu bus įjungtas mygtukas "Aukštyn" nuo juodos ir baltos iki spalvos, kai jį užveskite.

Galutinis prisilietimas yra perteklinės vietos pašalinimasaplink dvi nuotraukas. Norėdami tai padaryti, pasirinkite kairiuoju meniu punktą "Apkarpyti" ir pasirinkite stačiakampyje tik dvi raketas. Norėdami atlikti apkarpymą, paspauskite klavišą Enter.

Rezultatas yra vaizdas, kuriame nėra pertekliaus. Reikės įrašyti gauto vaizdo pločio ir aukščio, nes šie duomenys bus naudingi kitame žingsnyje.

kaip padaryti mygtuką į svetainę

Norėdami išsaugoti, spustelėkite "Failas" -"Išsaugoti", kur kairėje pusėje "Mano kompiuteris" užrašome vaizdo pavadinimą (tik anglų išdėstymas), pasirinkite formatą (šiuo atveju - PNG) ir spustelėkite mygtuką "Taip".

Failas su mygtuko įkėlimo scenarijumi

Tokiu atveju jums nereikia rašyti scenarijaus. Galėsite pasinaudoti visuomenei teikiama parinktimi, padarius tam tikrus pataisytus galutinį kodą.

Norėdami tai padaryti, turite atsisiųsti bet kokį kodo redaktorių. Populiariausi ir nemokama versija yra Notepad ++. Įdiegę jį, turite nukopijuoti ir įklijuoti į visą šį kodą:

<script type = "text / javascript"> $ (dokumentas).pasirengę (function () {$ (langas) .scroll (function () {if ($ (this) .scrollTop ()> 0) {$ ( "# scroller") fadeIn () ;.} else {$ ( "# scroller ") pritildymą ();.}}); $ (" # scroller ") Spustelėkite (function () {$ (". kūno, HTML ") animuoti ({scrollTop :. 0}, 400); return false;} );}); </ script>

Tada spustelėkite viršutinį meniu "Failas" - "Išsaugoti"kaip ... ", tada mes išsaugome kodą .js formatu. Po to jūs galite naudoti šį kodą savo svetainėje, įkeldami scenarijų failus ir vaizdus naudodami FTP ryšį.

Diegimas svetainėje

Norėdami nustatyti naršymo mygtuką iki svetainės, turite įdėti kodą į norimą vietą. Turite įvesti jį prieš žymę </ body>.

CSS stiliaus mygtuko stiliaus kūrimas

Dažniausiai svetainės mygtukas "aukštyn" yra apačioje ("rūsys").

Failo site style.css reikia įvesti tokį kodą:

"/ * Aukštyn mygtukas * /

.scrollTop {
fonas: URL ( "images / up.png) 0 0 ne-Pakartokite; / * onositelny kelias į įvaizdžio * /
plotis: 39px; / * mygtuko plotis * /
aukštis: 96 piksai; / * 50% mygtuko aukščio * /
apačia: 5px; / * fiksuotoje padėtyje, įtrauka iš apačios * /
kairėje: 89%; / * kompensuoti kairę * /
}
.scrollTop: užveskite (fono padėtį: 0-108px; } / * fono poslinkis * / "

Šiuo atveju jums reikia duomenų vaizdo pločio ir aukščio. Liko tik įvesti duomenis į kodą, o svetainės mygtukas "aukštyn" bus paruoštas! Kas dar?

Aukštyn "WordPress" svetainės mygtukas

kaip padaryti mygtuką į svetainę

Šiam CMS mygtukas "Aukštyn" gali būti sukurtas naudojant papildinių, taip pat nepriklausomai.

Su įskiepiais naudojamas metodas yra patogu ir lengva įdiegti, nes tam reikia tik paspausti mygtuką "Įdiegti" ir pritaikyti visas įjungimo meniu funkcijas.

Pasirenkant pastarąją reikėtų kreiptis nuoatsargiai, nes kartu su juo bus galima lengvai įsigyti virusą svetainėje. Populiariausi ir patikrinta parinktis yra "Plug-in" vadinamas slinktimi "Atgal į viršų". Galite atsisiųsti jį naudodami standartinę WordPress įskiepių paiešką.

Šis plėtinys yra kelifunkcionalus, ir bus labai paprasta individualizuoti "up" mygtuką svetainės WordPress. Visų reikšmių nereikia keisti apskritai, svetainės puslapyje reikia konfigūruoti mygtuko išvaizdą ir vietą.

Kaip matote, nustatykite mygtuką suĮskiepiai yra labai paprasta. Tačiau yra vienas svarbus niuansas, kad kiekvienas įdiegtas įskiepis įkelia CMS. Tai gali paveikti interneto išteklių greitį. Štai kodėl dauguma svetainių savininkų bando visus pakeitimus atlikti tiesiogiai kodu, o ne trečiųjų šalių plėtiniais. Jūs galite padaryti mygtuką "up" į svetainę HTML, kuris sumažins sunaudotus išteklius.

Prieš keisdami visus sisteminius failus, "WordPress" turi sudaryti atsargines kopijas. Be to, galite sekti visus veiksmus, kad sukurtumėte savo mygtuką, aprašytą aukščiau.

Knoka "up" "Joomla"

mygtukas "Joomla 3"

"CMS Joomla" taip pat palaiko papildinių įdiegimą, pvz., "Wordpress". Sėkmingiausia svetainės "up" versija "Joomla 3" yra pratęsimas, vadinamas puslapio viršuje.

Šiame CMS bet kuris papildinys gali būti įdiegtas per "Extension Manager". Norėdami tai padaryti, jums reikia:

  • atsisiųsti papildinį internete;
  • Išplėtimo tvarkytuve spustelėkite mygtuką "Naršyti";
  • pasirinkite atsisiųstą archyvą;
  • spustelėkite "Atsisiųsti" ir įdiekite.

Dabar reikia jį suaktyvinti "Plugin Manager". Norėdami tai padaryti, eikite į šį skyrių, suraskite papildinį ir pakeiskite jo būseną į "įjungta".

Tada sukonfigūruosite visas plėtinio parinktis, naudodami tą patį skyrių, kuriame jums reikia rasti šio papildinio "Pagrindiniai parametrai" dešinėje pusėje.

Puslapio viršuje yra ši funkcija:

  • Paleiskite / administratorius - įjunkite parinktį ne tik interneto šaltinyje, bet ir pačioje CMS Joomla programoje.
  • Mygtukas Atskleisti poziciją - kiek pikselių naudotojas turėtų grįžti atgal, kad rodytų "aukštyn" mygtuką.
  • "Omit Button Text" - tekstas ant mygtuko.
  • Visada viršuje - svetainės puslapis visuomet bus rodomas nuo pat pradžių. Jei naudojate "inkarus", kad pereitumėte prie konkrečios puslapio vietos, ši parinktis nereikia įjungti.
  • Smooth Scroll - leidžia puslapiui slinkti sklandžiau.
  • Slinkties trukmė - laikas, per kurį puslapis visiškai pereina į pradžią.
  • Slinkties perėjimas - pridedama prie didelių vaizdo efektų przewijanie.
  • Perėjimo lengvinimas - "palengvinimas" - perėjimas prie puslapio viršuje.
  • Nuorodos vieta - piktogramos vieta. Pagal standartą mygtukas yra apatiniame dešiniajame kampe.
  • Naudokite "Styles" - atskiras mygtuko stilius, kurį galima nustatyti žemiau esančiame lauke. Jei perjungiate į neigiamą vertę, visi stiliaus nustatymai bus paimti iš aktyvios svetainės temos.
  • "Link Style" - laukas norint įvesti mygtuko stiliaus nustatymus.

Norėdami pritaikyti mygtuko "up" stilių, turite bent jau turėti minimalių CCS žinių. Priešingu atveju, priešpaskutinį parametrą reikia pakeisti į "Ne".

Kitas svarbus niuansas yra tas, kadĮprastame piktograma yra angliškas tekstas: Grįžti į viršų. Rusijos svetainėje tokio teksto negalima rasti, todėl tiesiog jį išjunkite į papildinio nustatymus arba pakeiskite jį rusų kalba.

Norėdami pakeisti šį užrašą, eikite įserverio svetainę naudojant FTP arba integruotą prieglobos failų tvarkyklę. Tada kataloge "/ administrator / language / en-GB /" reikia rasti failą, vadinamą "en-GB.plg_system_topofthepage.ini".

Prieš keisdami tekstą, šį kodą turėtumėte pakeisti į utf-8. Tai padaro įprastą rusų raidžių vaizdą.

Toliau mes rasime šią eilutę:

"PLG_SYS_TOPOFTHEPAGE_GOTOTOP =" Grįžti į viršų ""

ir pakeiskite frazę į kabutes į rusų kalbą. Galite naudoti tokias frazes kaip "Aukštyn!", "Iš pradžių!" Arba "Aukštyn!".

Galų gale turėsite išsaugoti pakeistą failą ir patikrinti "up" mygtuką svetainės Joomla.

Ukozo mygtukas "U"

naršymo mygtuką į viršų

Turės būti atliktas "Ucoz" svetainės mygtukas "up"su kodo įvedimu, nes šio CMS papildiniai negali būti prijungti. Tačiau tai nereikalauja daug laiko išmokti sisteminius failus ir ieškoti reikiamą eilutę reikia tik įdėkite nedidelį kodą į norimą vietą.

Norėdami įdiegti, mums reikia:

  • eikite į "Valdymo skydas -> Dizainas -> Dizaino valdymas (šablonai) -> Apatinė svetainė;
  • įterpti scenarijų (galima rasti oficialioje projekto svetainėje ir trečiųjų šalių išteklių).

Išvada

Po to piktograma bus rodoma apatiniame dešiniajame kampe, o naudotojas bus nukreiptas į pačią puslapio viršutinę dalį.

Kaip matote, nustatykite mygtuką "Aukštyn"bet kuri CMS nebuvo ypač sunki. Galite naudoti tiek automatinio diegimo metodą (papildinius), tiek vadovą. Tačiau pastaroji galimybė išlieka tinkamiausia, nes ji nedaro neigiamos įtakos svetainės veikimui.

Galite naudoti mygtuką "aukštyn" svetainėjeHTML, kad sumažintų svetainės išteklių sunaudojimą, nes daugelis plėtinių gali turėti neigiamą poveikį išteklių našumui. Vienas "plug-in" mygtukas "up" negali labai paveikti svetainės puslapių įkėlimo laiko, tačiau daugeliu atvejų vartotojui yra įdiegta bent dešimt papildinių CMS. Šiuo atveju bet koks papildinys gali neigiamai paveikti svetainės puslapių našumą.

Skaityti daugiau: