Сайт үшін түймесі «Up»: қалай жасауға

оның келушілер үшін Интернет ыңғайлырақ ресурсты қабылдау сайт үшін «дейін» Мұндай функция, батырмасы. Ол оңай жоғарғы бөлігінде бетке кез келген жерінен шарлау үшін көмектеседі. Бұл ұзақ, төмен жылжып талап үлкен элементтердің онлайн дүкендер мен сайттар үшін міндетті болып табылады.

Неге керек

Қазіргі уақытта, «жоғары» батырмасы, осы функцияны сайттар ең емес, және сыни ештеңе жоқ. Бірақ оны пайдалану интернет-ресурсында үшін де және оның келушілерге көптеген артықшылықтары әкелуі мүмкін.

Келушілер үшін артықшылықтары

ақпараттық-бап көп орын алады және тінтуірдің дөңгелегін пайдаланып бетті төмен жылжу үшін бар Жиі кезде интернет-ресурс бет қатты, ақпараттың көлемін жүктеледі. мақала соңында бұл үшін плюс, оған ескертулер көп ұсына алады.

Қонақта бір бет төмен жылжу жеке утомительный мақаланы оқып кезде осы емес, бірақ мәтін соңына келді және ол жоғары жылжыту үшін қажет болған, ол біраз шаршап бастайды. Көптеген адамдар ұзақ шиыршықты әкелуі ғана тым жалқау болады, және олар тек оның ашық кеңістіктер арқылы емес, басқа серуенге қарағанда, полигонын жабу.

бірден беттің жоғарғы жағына жылжыту үшін түймесін пайдалану сайтында ермек ыңғайлырақ етеді.

Интернет-ресурстың артықшылықтары

оңай сайты шарлау үшін, өйткені, тарихи факторларға негізделген ресурстың өзі оң аспектілері барлық келушілер, олардың іс-шараларға белсенді түрде және басқа беттерге жылжыту болады, мінез-құлық факторларын жақсартады.

Осылайша деректер мінез-құлықтық факторлары іздеу нәтижелерінде жақсартылған ғарышқа сайт және қорғасын барлық іздеу қозғалтқыштар көзқарасын әсер етеді.

жалғыз веб-сайтында «Up» батырмасын жасауға қалай

одан әрі зерттелді. Сіз әрқашан бірнеше өте қарапайым қадамдарды орындау арқылы өз жасай аласыз CMS кез келген сайтқа дейін айналдыру үшін Button:

• сурет құру;
• сценарий құру;
• батырмасы мәнерін жасау;
• сайтқа қосу.

батырмасы сурет

басқан кезде «жоғары» сайтында қосу үшін, бастау үшін өзіне белгішені жасау керек, пайдаланушы бетті жоғары жылжыту болады. Сіз біз әрқашан ең қолайлы таңдауға болады, олардың арасында дайын параметрлерін пайдалана аласыз.

түймешігінің көрінісін жақсарту үшін, сіз атап айтқанда спрайт жасауға, жақсартуы қажет, CSS-негізделген фондық суреттерді біріктіруге мүмкіндік береді, осылайша қысқа анимацияны құрып.

графикалық жұмыстарды, сіз кез келген редакторы пайдалануға болады. жүктеп алу үшін ештеңе, сіз браузерде тікелей оларды пайдалана аласыз қажеті жоқ, өйткені Бірақ ең қолайлы нұсқа, онлайн қызмет Pixlr болып табылады.

таңдау терезесі редакторында жұмыс бастау үшін «компьютеріңізден Суретті кері қотару.» Мысал ретінде, зымыран суретті түсіру.

Таңдалған белгішелердің өлшемі тым үлкен болса, сіз өлшемге шағын түзету жасау қажет болады. , Бұл, «Өңдеу» жасауға жоғарғы мәзір өтіңіз, және өрісті таңдаңыз, және «... Free Transform» кейін

Келесі суретте көшуде арнайы маркерлер бар Келесі, сіз суретті өлшемін өзгертуге болады. кадр пішімін сақтау үшін, сіз көк маркерлер жылжыту қажет, бұл өткізу, Shift пернесін пайдалануға болады. Осы іс-шаралар соңында алынған зымыран бейнесі.

Келесі қадам - қабатының көшірмесін жасау.

Енді сіз жаңа зымыран біраз дейін қабатының суретті жылжыту керек. Бұл әрекетті орындау үшін, ол сол мәзір екінші бағанда орналасқан Жылжыту құралы, пайдалануға ыңғайлы болуы, және пернетақтада «дейін» көрсеткісін болады.

Енді сіз қара және ақ түспен жоғарғы суретті жасау үшін керек. жоғарғы мәзірінен «Hue / Saturation» - Бұл тармақ «түзету» пайдаланып жасауға болады. толық түссіздігін Жүгірткі үшін «Қанықтық» мәні -100 алуы тиіс. Бұл әрекет, сіз оған меңзегенде «Up» батырмасы түске қара және ақ түскен қосу деп әсер жасайды.

соңғы сенсорлық - екі кескіндердің артық кеңістігін жою. Бұл әрекетті орындау үшін, элементті сол мәзірінен «Trim» және тіктөртбұрыш ішіне тек екі зымыран таңдаңыз. The пернесін енгізіңіз кесуге пресс жасау үшін.

тым көп орын бар, онда суретті алу үшін. Сіз бұл деректер Келесі қадамда пайдалы болады, себебі нәтижесінде суреттер енін және биіктігін жазу үшін қажет.

«Файл» басу керек сақтау үшін - «Иә» және нұқыңыз - (PNG бұл жағдайда) «Менің компьютерім» имиджін атауын жазыңыз (тек ағылшын тілінде пернетақта жаймасы) астында қалдырды «Сақтау», пішімін таңдаңыз.

сценарий «Up» түймесі арқылы File

Сценарийді жазу, бұл жағдайда ол қажет емес. Ол кейбір түзетулер дайын коды тарту, қоғамдық параметрді пайдалану мүмкін болады.

Бұл кез-келген коды редакторы жүктеп алу үшін талап етеді. ең танымал, сондай-ақ тегін нұсқасы - Notepad ++ болып табылады. Орнатқаннан кейін сіз барлық осы кодты көшіріп, қойыңыз қажет:

<Сценарий түрі = «мәтін / JavaScript »> $ (құжат) .ready (функциясы () {$ (терезе) .scroll (функциясы () {егер ($ (осы) .scrollTop ()> 0) {$ ( '# скроллер «) fadeIn ();. } тағы {$ ( '# скроллер») біртіндеп жойылуы () ;.}}); $ (' # скроллер «) (функциясын () {$ (түймешігін басыңыз.» дене, HTML). анимациялау ({scrollTop: 0}, 400); жалған қайтаруға;}); });

«... ретінде сақтау», содан кейін .js форматында кодын сақтап - Содан кейін жоғарғы мәзір «Файл» түймешігін басыңыз. Содан кейін, FTP-байланыстарын пайдалана отырып, сценарий және бейне файлдарды жүктеу арқылы сіздің сайтында осы кодты пайдалануға болады.

Сайттағы Орнату

сайт үшін жылжу орнату үшін, сіз қалаған орынға код орналастыру керек. ол тегтің алдында болу керек жазылуы.

CSS бар батырмасы мәнерін жасау

Ең жиі, төменгі ( «жертөле») орналасқан сайт үшін түймесі «дейін».

Сайттың style.css файлы, сіз келесі кодты қосу керек:

жоғарғы жағында «/ * Button * / .scrollTop { фон: URL ( «суреттер / up.png ') 0 0 жоқ-қайталау; кескінге / * onositelny жолы * / ені: 39px; түймені / * ені * / биіктігі: 96px; түймешігінің биіктігі / * 50% * / төменгі: 5px; төменгі маржасының / * тұрақты позиция * / сол жақ: 89%; / * солға офсет * / } .scrollTop: Hover {фон-позиция: 0 -108px; } / * Фонды офсет * / «

Бұл жағдайда, қажетті деректер мен имиджін ені мен биіктігі. Бұл код деректерді енгізу үшін қалады, тек, және сайт үшін «дейін» батырмасы дайын болады! Тағы да не?

Wordpress бойынша сайт үшін «Up» батырмасы

Осы CMS түймешігі үшін «Up» дербес, сондай-ақ, плагиндер көмегімен жасауға болады.

ең ыңғайлы және орнату оңай әдісі плагиндер, оны орнату батырмасын ғана басыңыз талап және плагин мәзір барлық қасиеттерін баптай еді, өйткені.

соңғысының таңдау арқылы оны сіз оңай сайтында вирус сатып алады, себебі, сақтықпен жақындауға болады. Ең танымал және дәлелденген опция - плагин деп аталатын жылжып Басына. Сіз стандартты іздеу Wordpress плагин модульдерді пайдаланғанда оны жүктеуге болады.

Бұл кеңейтім бірнеше функционалдық бар, және Wordpress бойынша сайт үшін «дейін» түймесін дараландыратын өте оңай. Барлық мәндерді өзгерту міндетті веб-беттегі түймешігінің тек түрі мен орнын теңшеуіңіз қажет емес.

Өздеріңіз көріп отырғандай, плагиндер көмегімен «жоғары» түймешігінің орнату өте оңай. Бірақ әрбір орнатылған қосылатын модулі CMS жүктер фактісі тұрады бір маңызды ескерту бар. Бұл Интернет-ресурстың жылдамдығын әсер етуі мүмкін. сайтқа иелерінің ең орнына үшінші тарап кеңейтімдерді пайдалану, коды тікелей барлық өзгерістерді жүзеге асыруға тырысады сондықтан. Сіз тұтынылатын ресурстар барынша азайту HTML сайт, арналған «дейін» батырмасын жасауға болады.

кез келген жүйелік Wordpress файлдарды өзгертпес бұрын, сіз оларды құрайтын керек. Содан кейін Сіз өз түймелерін құру үшін барлық қадамдарды орындаңыз аласыз, жоғарыда сипатталған.

Joomla үшін «дейін» Knock

CMS Joomla, сондай-ақ Wordpress сияқты қосылатын модульдері орнату қолдайды. Joomla 3 сайтында арналған түйме «дейін» ең табысты опция Беттің жоғарғы атты қосылатын модулі болып табылады.

кез келген қосылатын Бұл CMS «Кеңейтулерменеджері» арқылы орнатуға болады. : Бұл әрекетті орындау үшін

• Интернетте плагин жүктеп;
• кеңейту менеджерінде «Шолу» батырмасын басыңыз;
• жүктелген файлды таңдаңыз;
• «Жүктеу» және орнату түймешігін басыңыз.

Енді сіз «плагин менеджері» оны іске қосу үшін қажет. Бұл әрекетті орындау үшін, сіз, осы бөліміне өтіңіз ашасын табуға және оның мәртебесін ауысу керек «қосылған.»

Келесі сіз оң жағында осы плагин «негізгі параметрлері» бөлімін табу керек сол бөлімнің көмегімен кеңейту опциялардың параметрі болып табылады.

Беттің жоғарғы жағы келесі ерекшеліктері бар:

• іске қосу / әкімшісі - интернет-ресурсында, сондай-ақ тақтасында CMS Joomla ғана емес опциясын қосу.
• онда «дейін» түймесіне пайдаланушыға кері айналдыру керек қанша пиксел - Button ұстанымын анықтауға.
• Түйменің мәтін - Button Text тигізбеңіз.
• Әрқашан жағында - Сайт барлық уақытта оның басынан бастап пайда болады. беттегі арнайы орынға айналдыру үшін «зәкір» пайдаланған кезде, бұл опция белсендірілген қажет емес.
• Тегіс жылжып - бет сарп тегіс етеді.
• Scroll Ұзақтығы - бет толығымен жоғарғы көшіп, ол кейін уақыт.
• Scroll Өтпелі - үлкен көрнекі әсерлер арқылы жылжу қосады.
• Өтпелі төмендеуі - «әлсіреуі» беттің жоғарғы жағына жылжытыңыз.
• Сілтеме Орналасқан жері - Орналасқан жері белгішелер. стандарт ретінде, батырмасы төменгі оң жақ бұрышында орналасқан.
• Мәнерлерді пайдаланыңыз - төменде саласындағы көрсетілуі мүмкін жеке стилі түймелер,. Егер сіз теріс мәнге қосулы болса, стильдерінің барлық параметрлері белсенді тақырып сайтынан қабылданатын болады.
• Сілтеме Стиль - Сіздің параметрлері түймешігі стилі түсу үшін өріс.

Өзін-өзі баптау батырмасы стилінде «Up», сіз ОКҚ кем дегенде аз білімі болуы керек. Әйтпесе, «Жоқ» деген соңғы параметрдің мәнін өзгерту керек.

Тағы бір маңызды нәрсе белгішесін әдеттегі жазу ағылшын мәтіні бар екенін: Басына оралу. Егер сіз жай ғана орыс ештеңе өзгертуге плагин параметрлерін оны өшіру керек, сондықтан орыс сайтында ұқсас мәтін, осы болуы мүмкін емес.

жапсырмаларды өзгерту үшін кіріктірілген FTP серверін немесе файл менеджер хостинг пайдаланып сайт серверде өту үшін қажет. Келесі каталогта «/ әкімшісі / тілі / EN-GB /» «EN-GB.plg_system_topofthepage.ini» деп аталатын файлды табу керек.

мәтінді өзгертпес бұрын UTF-8 құжаттың кодтауды өзгертуге тиіс. Бұл ресейлік әріптер қалыпты дисплейін жасайды.

Содан кейін, біз келесі жолды таба:

«PLG_SYS_TOPOFTHEPAGE_GOTOTOP =» «Басына оралу »

және орыс тілінде тырнақшаға тіркесін өзгертіңіз. Сіз «! Бастау», осындай «Up» ретінде сөз тіркестерін пайдалану немесе «Up!» Болады.

Joomla Сайт үшін «дейін» өзгертілген файлды сақтау және түймелерін тексеру қажет соңында.

Ucoz үшін «Up» батырмасы

Осы CMS үшін қосылым ашасы мүмкін емес, өйткені Ucoz туралы сайт үшін түймешігі «Up», код енгізумен істеу керек. тек қажетті орынға шағын кодын енгізіңіз қажет Алайда, бұл жүйе файлдар үйрену және қажетті желісі іздеу үшін ұзақ уақыт қажет етпейді.

орнату үшін, біз қажет:

• Басқару панелі «өтіңіз -> Дизайн -> Дизайн басқару (үлгілер) -> сайттың төменгі бөлігі;
• сценарий салыңыз (ресми жоба сайтында және үшінші тарап ресурстар табуға болады).

қорытынды

Осыдан кейін, белгішенің төменгі оң жақ бұрышындағы беттің өте жоғарғы пайдаланушыға жылжыту, пайда болады.

көрген айтылғандай, CMS кез келген үшін «Up» түймешігінің орнату, әсіресе қиын болған жоқ. Ол автоматтандырылған орнату (қосылатын модульдерді) әдісі, және нұсқаулықта ретінде пайдалануға болады. ол теріс сайттың жұмысына әсер етпейді, өйткені Дегенмен, соңғы параметр, ең қолайлы болып табылады.

Сіз кеңейтімдерді үлкен саны ресурс орындауға теріс әсер етуі мүмкін, себебі ресурс тұтыну сайты азайту үшін, «дейін» HTML сайт үшін пайдалануға болады. Плагин түймесі «дейін» қатты беттердің жүктеме уақыты әсер етпейді, бірақ көп жағдайда пайдаланушы кем дегенде ондаған қосылатын модульдерді CMS орнатылған осы болып табылады. Бұл жағдайда, кез келген қосылатын модулі теріс сіздің беттер өнімділігіне әсер етуі мүмкін.