Cum de a face un buton "sus" pentru un site sau blog stabilit pe site-ul, site-ul de afaceri al pavel

Cred că toată lumea înțelege esența acestui buton. Citirea un post lung, interesant de pe site-ul dvs., vizitatorul ajunge la sfârșitul paginii, și să-l apoi pentru o lungă perioadă de timp, nu pentru a porni roata mouse-ului, el face clic pe butonul „sus“ și este imediat la începutul meniului principal paginii la dispoziția sa.

Instalați butonul "sus" pe site:

La sfârșitul acestui articol, descărcați arhiva cu două fișiere: o html pagină finalizată și o imagine (săgeată în sus). Puteți deschide pagina html în orice browser și puteți vedea funcționarea butonului "sus".

ATENȚIE. Pentru a rula scriptul, trebuie să conectați biblioteca jquery. înainte de codul JS. Dacă aveți deja acest lucru, inserați acest cod în fișierul principal al site-ului dvs. între majuscule. De obicei, fișierul principal este index.html, index.php. Pentru un blog Wordpress, vă recomandăm să inserați un șablon pentru site-ul dvs. în fișierul header.php. Dacă aveți un simplu site html static, atunci va trebui să îl inserați pe fiecare pagină.

2. Adăugați butonul "up", css-code:

Inserați acest cod css în stil style.css al site-ului dvs. sau șablonul site-ului dvs. Pentru blogurile făcute pe wordpress acest fișier este într-un dosar cu o temă (wp-content / themes / your_theme / style.css).

3. Adăugați codul html al butonului "sus":

Puneți-l în șablonul principal al site-ului dvs., înainte de eticheta de închidere a corpului. Pentru blogurile Wordpress, recomand să le inserați în fișierul footer.php din corp. Dacă aveți un site html simplu, îl lipiți în fiecare pagină.

4. În arhivă există o imagine (săgeată în sus), o aruncați la rădăcina site-ului. Dacă cine nu știe, acesta este directorul principal în care se află toate fișierele site-ului dvs. De obicei se numește httpdocs sau public_html.

Asta e tot! Actualizați pagina, site-ul sau blogul dvs., în colțul din dreapta jos ar trebui să apară butonul "sus" când derulați rotița mouse-ului în jos. Puteți schimba designul butonului, imaginați-vă cu stiluri css, schimbați imaginea la dvs., etc.

Astăzi, în titlul "Motivația - calea către succes" am pus această imagine:

Cum de a face un buton


Descărcați gratuit!













  • Vă mulțumesc foarte mult pentru butonul "Sus" - am văzut câteva descrieri, cred că sunteți cel mai bun! - totul este clar și ușor de înțeles. Singurul lucru pe care îl puteți simplifica codul - Înapoi la început nu neapărat pus într-o etichetă

    În mod obiectiv vorbind, eticheta

    nu ai nevoie. Puteți face acest lucru Înapoi la început Și sub această afacere să corecteze stilurile și scenariile CSS.

    Bună Dima!
    Sunt de acord cu dvs., această simplificare este rezonabilă! Mulțumesc. )

  • Este super, mulțumesc, totul este clar și clar. Am reușit. Sistemul Bitrix.

  • Bună ziua Pavel, ți-am citit articolul, am vrut să instalez butonul, dar site-ul meu a fost creat pe baza designerului site-ului Setup.ru. Spune-mi, pentru munca corectă, unde să pun codul și dacă acesta va funcționa?

  • Mark Simple