Tlačítko Nahoru pro web: jak to udělat

Funkce, jako je tlačítko "nahoru" pro stránky, činí internetový zdroj pohodlnější pro své návštěvníky. Pomáhá snadné navigaci z libovolného místa na stránce na vrchol. To je prostě nezbytné pro online obchody a weby s velkými články, které vyžadují dlouhé posouvání dolů.

Proč je to nutné

V současné době na většině webových stránek neexistuje žádná funkce, jako je tlačítko "nahoru" a není nic špatného. Ale jeho využití může přinést mnoho výhod jak online zdroji, tak jejich návštěvníkům.


Výhody pro návštěvníky

Často když je stránka s internetovými zdroji silně nabitá informacemi, když informační článek zaberá spoustu místa a musí rolovat stránku dolů pomocí kolečka myši. Kromě toho může být na konci článku mnoho komentářů. Když návštěvník přečte článek, je těžké posunout stránku dolů, ale když skončí text a musíte se posunout nahoru, začne se trochu otevírat. Většina lidí bude jednoduše nosit dlouhý svitek a oni prostě zavřou místo místo toho, aby procházeli prostorem. Použitím tlačítka k okamžitému přesunu do horní části stránky je pohodlnější trávení času na webu.

Výhody online zdroje

Pozitivní stránky pro samotný zdroj jsou založeny na minulých faktorech, protože zjednodušený pohyb na místě zlepšuje faktory chování, protože všechnynávštěvníci budou ve svých činnostech aktivnější a přecházejí na další stránky.


Uvedené behaviorální faktory ovlivňují poměr všech vyhledávačů k webu a vedou ke zlepšení místa provádění vyhledávání.

Jak udělat tlačítko "nahoru" na samotném místě

Pojďme dál. Tlačítko posunu pro stránku na libovolný systém CMS může být vždy provedeno samo o sobě, a to pomocí několika velmi jednoduchých kroků:
  • vytvoření obrazu;
  • vytváření skriptů;
  • vytvoření stylu tlačítka;
  • přidání na stránku.
  • Obrázek tlačítka

    Chcete-li přidat tlačítko "nahoru" na webu, musíte nejdříve vytvořit ikonu, když klepnete na kterou stránku má uživatel. K tomu můžete použít hotové varianty, mezi nimiž můžete vždy zvolit nejvhodnější varianty. Chcete-li vylepšit vzhled tlačítka, je třeba provést nějaké vylepšení, a to vytvořit sprite, což dovolí CSS kombinovat obrázky na pozadí, čímž vytvoří animaci z nich. Pro grafické práce můžete použít libovolný editor. Ale nejvhodnější volbou je online služba PIXLR, protože stahování nic není potřeba a můžete je použít přímo v prohlížeči. Chcete-li začít pracovat v okně editoru, musíte vybrat pole "Nahrát obrázek z počítače". Jako příklad použijte raketový snímek.
    Pokud je velikost vybrané ikony příliš velká, je třeba provést malou úpravu velikosti. Chcete-li to provést, přejděte do horní nabídky a vyberte v poli "Upravit" a poté"Volná transformace". Dále, spolu s obrázkem jsou speciální značky, pohybují je, můžete změnit velikost obrazu. Chcete-li uložit proporce, můžete použít klávesu Shift a stisknutím tlačítka přesunete modré značky. Na konci těchto akcí se objeví raketový obrázek.
    Dalším krokem je vytvoření kopie vrstvy. Nyní musíte trochu posunout obrázek z nové vrstvy. Chcete-li to provést, je vhodné použít pohyblivý nástroj umístěný ve druhém sloupci levého menu a šipku nahoru na klávesnici. Nyní musíte udělat horní obraz černobíle. To lze provést pomocí položky "Oprava" - "Tón /Saturace" v horním menu. Pro úplné odbarvení by měl posuvník "Sytost" přijmout hodnotu -100. To vám umožní provést efekt, při kterém bude tlačítko "Up" převedeno z černé a bílé na barvu, když se na něj pohybujete. Posledním dotykem je odstranění zbytečného místa kolem dvou snímků. Chcete-li to provést, vyberte položku "Stříhání" v levém menu a vyberte pouze dvě rakety v obdélníku. Chcete-li stříhání provést, stisknete klávesu Enter. Objevil se obraz, ve kterém není nadměrný volný prostor. Musíte napsat hodnotu šířky a výšky výsledného obrázku, protože tato data budou užitečná v dalším kroku.
    Chcete-li uložit, musíte kliknout na "Soubor" - "Uložit", kde vlevo "My Computer" zaznamená název obrázku (pouze anglické rozložení), zvolte formát (v tomto případě PNG) Ano. "

    Soubor se skriptemtlačítka "nahoru"

    V tomto případě není zapotřebí psát skript. Můžete použít volbu pro veřejnost a zavést některé opravy do hotového kódu. Chcete-li to provést, stáhněte si libovolný editor kódu. Nejoblíbenější a vedle bezplatné verze je Notepad ++. Po instalaci je třeba zkopírovat a vložit celý kód do něj:



    Potom klikněte na "Soubor" - "Uložit jako" v horní nabídce a uložte kód ve formátu .js. Poté můžete tento kód použít na svých stránkách stahováním obrazových souborů do něj pomocí připojení FTP.

    Instalace na webu

    Chcete-li nastavit navigační tlačítko nahoru pro daný web, musíte jej umístit na správné místo. Musíte ji zadat před značku.

    Vytvoření stylu tlačítek v CSS

    Tlačítko "up" pro místo se často nachází v dolní části ("suterén"). style.css soubor místo musí provést následující kód:

    „tlačítko /* až * /{.scrollTop
    pozadí: url ('images /up.png') 0 0 no-repeat; /* onosytelnыy cesta k obrazu * /
    , šířka: 39px; /* šířka tlačítka * /
    , výška: 96 pixelů; /* 50% výšky tlačítka * /
    spodní části: 5px; /* pevné poloze prostor zespodu * /
    vlevo: 89%, /* posun k * /
    ,}
    .scrollTop levé: visu {pozadí poloze: 0 -108px;} /* pozadí offset * /„


    V takovém případě budete potřebovat údaje o šířce a výšce obrázku. Jediné, co musíte udělat, je zadat přijaté údaje do kódu a tlačítko "nahoru" pro stránky bude připraveno! Co jiného?

    Tlačítko "Nahoru" pro stránky Wordpress

    Pro toto CMS lze tlačítko "Up" provést pomocí plug-inů, stejně jako sami.Metoda pluginu je nejvhodnější a snadná instalace, protože vyžaduje pouze kliknutí na instalační tlačítko a konfiguraci celé funkce v nabídce pluginů. Před výběrem druhého byste měli být opatrní, protože s tím bude možné snadno zakoupit virus na webu. Nejpopulárnější a nejsilnější volbou je plugin nazvaný Scroll Back to Top. Můžete si jej stáhnout pomocí standardního vyhledávacího modulu Wordpress plugin. Toto rozšíření má pluralitní funkcionalitu a bude velmi snadné individualizovat tlačítko "up" pro stránky na Wordpress. Není nutné měnit všechny hodnoty, stačí pouze nakonfigurovat typ a umístění tlačítka na stránce webu. Jak je vidět, instalace tlačítka "nahoru" s pluginy je velmi jednoduchá. Existuje však jeden důležitý nuance, že každý nainstalovaný plugin načte CMS. To může ovlivnit výkon online zdroje. To je důvod, proč se většina majitelů stránek pokouší implementovat všechny změny přímo do kódu, nikoli pomocí rozšíření třetích stran. Tlačítko "nahoru" pro web můžete vytvořit ve formátu HTML, který minimalizuje spotřebované zdroje. Než změníte všechny systémové soubory Wordpress, ujistěte se, že jsou zálohovány. Dále můžete spravovat všechny kroky k vytvoření vlastního tlačítka popsaného výše.

    Knop "up" pro Joomlu

    CMS Joomla také podporuje instalaci pluginů, jako Wordpress. Nejúspěšnější verze tlačítka "nahoru" pro web na webu Joomla 3 je rozšíření nazvané Nahoru stránky. V tomto CMS může být každý plug-in instalován prostřednictvím SprávceRozšíření. " K tomu je třeba:
  • stáhnout plugin na internetu;
  • Klikněte na tlačítko Procházet v Správci rozšíření;
  • vybrat stažený archiv;
  • Klikněte na "Stáhnout" a nainstalujte.
  • Nyní je třeba aktivovat funkci "Správce pluginů". Chcete-li to provést, musíte jít do této části, najít plug-in a přepnout jeho stav na "zapnuto". Následuje konfigurace všech možností rozšíření, které používají stejnou sekci, kde potřebujete najít "Základní nastavení" tohoto pluginu na pravé straně. Začátek stránky má následující funkce:
  • Spustit v /administrátorovi - Povolit možnost nejen v prostředku Internet, ale také v samotném panelu Joomla CMS.
  • Tlačítko odhalení tlačítka - kolik pixelů by měl uživatel vrátit zpět, aby se zobrazilo tlačítko "nahoru".
  • Vypustit text tlačítka - přítomnost textu na tlačítku.
  • Vždy nahoře - Stránka stránky bude vždy zobrazena od začátku. Pokud používáte kotvy, nemusíte tuto možnost aktivovat, chcete-li posunout na konkrétní místo na stránce.
  • Hladké posouvání - posunutí stránky hladší.
  • Délka posouvání - doba, po kterou se stránka zcela posouvá nahoru.
  • Scroll Transition - přidává posouvání na velké vizuální efekty.
  • Přechodné uvolnění - "oslabení", které se přesune do horní části stránky.
  • Umístění odkazu - Umístění ikony. Tlačítko se ve výchozím nastavení nachází v pravém dolním rohu.
  • Použití stylů je individuální styl tlačítka, který lze nastavit v rámečku níže. Při přepnutí na zápornou hodnotu budou všechny styly odebrányaktivní téma webu.
  • Link Style je pole pro zadávání nastavení stylů tlačítek.
  • Pro vlastní nastavení tlačítka ve stylu „nahoru“, musí mít alespoň minimální znalosti o CCS. V opačném případě je nutné změnit hodnotu posledního parametru na "Ne". Další důležitou věcí je, že obvyklý nápis na ikonu obsahuje anglický text: Návrat na začátek. Na ruské stránky jako textu nemůže být, takže byste měli prostě vypnout v nastavení nebo změnit zástrčku do ruštiny. Chcete-li tuto vložku změnit, musíte se přihlásit na server webu pomocí vestavěného hostingu FTP nebo správce souborů. Pak v adresáři «/správce /jazyka /en-GB /» je třeba najít soubor s názvem «en-GB.plg_system_topofthepage.ini». Před změnou textu je nutné změnit kódování tohoto dokumentu na UTF-8. To umožní normální zobrazení ruských písmen. Dále zde tento řádek:

    „PLG_SYS_TOPOFTHEPAGE_GOTOTOP =“ Zpět na začátek „“

    a změnou frázi v uvozovkách do ruštiny. Můžete použít fráze jako je „Up“, „Start!“ Nebo „Up!“. Na konci chcete uložit upravený soubor a kontrolovat tlačítek „up“ na webu na Joomla.

    Tlačítko "Nahoru" pro Ucoz

    Tlačítka „nahoru“ pro danou lokalitu Ucoz mají co do činění s prováděním kódu, stejně jako připojení CMS pluginů nemožné. Nicméně, to nemusí dlouho učit systém a vyhledávat soubory potřebné linky třeba vložit pouze správné místo malého kódu. K instalaci budeme potřebovat:
  • Přejít na ovládací panel - & gt;Zobrazit - & gt; Řízení návrhu (šablony) - & gt; Dolní část místa;
  • vložte skript (lze nalézt na oficiálních stránkách projektu a zdrojů třetích stran).
  • Závěr

    V pravém dolním rohu se objeví ikona, která přesune uživatele do horní části stránky. Jak je vidět, instalace tlačítka "Nahoru" pro jakýkoli systém CMS nebyla obtížná. Můžete použít jak automatizovanou metodu instalace (plug-inů), tak i manuál. Poslední možnost však zůstává nejvhodnější, neboť nemá negativní vliv na výkonnost stránek. Můžete použít tlačítko "nahoru" pro stránky v jazyce HTML, abyste maximalizovali spotřebu zdrojů webu, protože velký počet rozšíření může mít negativní vliv na výkonnost zdroje. Jeden zálohovací tlačítko nemůže výrazně ovlivnit dobu načítání stránek webu, ale ve většině případů má uživatel v CMS alespoň deset pluginů. V takovém případě může každý plugin negativně ovlivnit výkon stránek stránek.

    Související publikace