Oldingi sahifaga qaytish joomla 3. Veb-sahifada orqaga tugmani qanday qilish mumkin

Ushbu video darsda biz teskari tartibda sayt bo'ylab oldingi sahifalarga o'tish uchun BACK tugmasini qanday qilishning 3 ta variantini ko'rib chiqamiz. BACK tugmasi, shuningdek, saytning bir nechta sahifalaridagi havolalar (A1, A2...An) bir sahifaga (B) olib borilganda va bu sahifadan (B) oldingi sahifaga (An) qaytishingiz kerak bo'lganda ham kerak bo'ladi. sahifaga kirgan saytning (B).

Yangi video darslikni tomosha qiling:

Ushbu video darsimizda biz saytning oldingi sahifalariga qaytish tugmachasini yaratamiz Adobe dasturi Muse. Ushbu tugma biz saytda kuzatgan yo'l bo'ylab qaytadi.

Ushbu darsni o'tkazish uchun men kichik loyiha tayyorladim, aniqrog'i uni kichik deb atash mumkin emas, bu erda u yuqori darajadagi sahifalardan, birinchi darajali sahifalardan iborat, shuningdek, "2-sahifa" sahifasi uchun yana bir nechta bolalar bor. sahifalar. Va xilma-xillik uchun men ikkita shablon yaratdim. Men birinchi shablonni dastlabki uchta sahifaga qo'lladim. Va men ikkinchi shablonni hammaga qo'lladim.

Keling, boshlaymiz. Biz “S andozasida” Orqaga tugmachasini yaratamiz, shunda u shu shablon qo'llaniladigan sahifalarda darhol paydo bo'ladi. Men ushbu shablonni tahrirlash uchun boraman va bu erda biz orqaga tugmachamizni joylashtiramiz.

Biz "Orqaga" tugmasini uchta usulda kiritishimiz mumkin. Menda bor maxsus fayl, men allaqachon bloknotda tayyorlaganman. Va uchta usul, uchta kod mavjud bo'lib, ular yordamida biz saytga bunday tugmani kiritishimiz mumkin.

Birinchi variant shunchaki matn. Tugma matn shaklida bo'ladi. Men ushbu kodni nusxa ko'chiraman:

Va men uni shablonga joylashtiraman. Bu shunday ko'rinadi. Bizda faqat matn bor va u oq rang bilan ajratilgan. Men uni shu yerda joylashtiraman. Bularning barchasi qanday ishlashini tushunish uchun biz brauzerdagi barcha sahifalari bilan butun saytni ko'rish uchun ctrl+alt+E tugmalarini bosamiz. Saytning asosiy sahifasi shunday ko'rinadi. Menyuni kezishimiz, sahifalarni tanlashimiz mumkin. Bu erda ochiladigan menyular mavjud. Va, masalan, asosiy sahifadan biz darhol "3-sahifa" sahifasiga o'tdik. Va bu erda bizda orqaga tugmasi bor.

Ushbu tugma faol, lekin sichqonchani uning ustiga olib borganingizda, barmoqli qo'l ko'rinmaydi. Biz ushbu tugmani xavfsiz bosishimiz mumkin va biz asosiy sahifaga qaytamiz. Xuddi shu tarzda biz “3-sahifa”ni bosamiz, so‘ng “4-sahifa”ga o‘tamiz va “Orqaga” tugmasini bosamiz, u bizni “3-sahifa”ga olib boradi va agar biz bossak. yana "Orqaga" tugmasini bosing ", keyin u bizni asosiy sahifaga olib boradi. Orqaga tugmasi shunday ishlaydi.

Ammo bu tugmani tugma deb atash qiyin, chunki bu oq rangda ta'kidlangan bu yozuv. Agar biz uni Muse'da tahrir qilmoqchi bo'lsak, biz faqat matn hajmini o'zgartirishimiz mumkin, masalan, men bu erga "36" qo'yaman, shuning uchun uni yaxshiroq ko'rishingiz mumkin. Menimcha, biz matn rangini o'zgartira olmaymiz. Endi qizil rangni qo'yishga harakat qilaman. Men qizil rangni tanladim, lekin bu bizning harflarimizga hech qanday ta'sir qilmadi, shuning uchun rangni o'zgartira olmaymiz. Biz hajmini o'zgartirishimiz mumkin. Keling, uni qalin qilib, markazga qo'yishga harakat qilaylik. Biz qila oladigan yagona narsa shu tarzda tahrirlashdir. Agar biz ushbu blokni to'ldirmoqchi bo'lsak, masalan, uni to'q sariq rangga aylantirmoqchi bo'lsak, unda bizning matnimiz hali ham oq rangda ta'kidlangan bo'ladi va, qoida tariqasida, u juda yaxshi ko'rinmaydi.

Endi biz uni nusxalaymiz. Men ctrl+C tugmalarini bosib dasturga o'taman va ctrl+V tugmalarini bosib saytga joylashtiraman. Bu havolaga o'xshaydi. Bizning havolamiz ko'k rangda. Endi u unchalik ko'rinmaydi. Keling, uni kattalashtirish va yaqinroq ko'rish uchun 36-shriftni ham yarataylik. Bu erda bizda faqat ko'k havola mavjud. Agar biz hozir ctrl+alt+E tugmachalarini bossak, ko'rib chiqilayotganda bu oddiy ko'k havolaga o'xshashligini ko'ramiz. Keling, buni ko'rish uchun yana bir necha marta o'taylik, bir marta bosing, ikki marta bosing va qaytib keling. Ushbu havola oddiy havola bilan bir xil ko'rinishga ega.

Biz unga havola uslublarini Adobe Muse-da qo'llashimiz mumkin. "Giperhavolalar" bo'limida havola uslublarini toping, "Havola uslublarini tahrirlash" -ni tanlang. Menda allaqachon tayyorlangan versiya bor. Endi menda allaqachon tayyorlangan versiya bor. Unga qo'llaniladigan uslub borligini ko'rishingiz mumkin. Standart holatda va sichqoncha kursorini ko'targanda rang ko'k va faol holatda - qizil. Siz buni tomosha qilayotganda ko'rdingiz. Men yaratgan ikkinchi uslub oddiygina qora ranglar edi. Ushbu uslubni ushbu tugmaga qo'llashimiz mumkin. Masalan, men ushbu maxsus uslubni tanlayman va ushbu tugmaga qo'llayman. Bizning yozuvimiz esa qora rangga aylanganini ko'rasiz.

Bu erda biz to'ldirishni ham qila olamiz, masalan, men buni bir xil to'q sariq rang bilan qilaman. Bu yerda siz allaqachon matnni tahrirlashingiz mumkin. Keling, uni o'rtaga qo'yib, uni qalin qilib qo'yamiz. Va, qoida tariqasida, bu variant allaqachon tugmachaga o'xshaydi. Endi bunday oq ta'kidlash yo'q va, qoida tariqasida, bu variant allaqachon juda mos keladi. Ko‘rayotganda (ctrl+alt+E) “sahifa-3”, “sahifa-4” sahifasiga o‘tamiz va yana bir marta bosing. Ushbu tugma birinchisi bilan bir xil ishlaydi, faqat dizaynni tahrirlash uchun ko'proq imkoniyatlar mavjud.

Va tugmachani qanday joylashtirishimiz uchun uchinchi variant - bu tugma rasm bo'ladi. Men ushbu kodni nusxa ko'chiraman:

Men Muse-ga boraman va "Qo'shish" tugmasini bosing. Va bizda mavjud bo'lgan bu uchinchi variant - bu rasm. Bu erda qandaydir rasmga ega bo'lishimiz uchun biz Internetdan biron bir rasm faylini yuklab olishimiz yoki uni o'zimiz yaratishimiz kerak. Biz rasmni dasturning "Fayl" funktsiyasi orqali qo'shamiz, "O'tkazish uchun fayllarni qo'shish" -ni tanlang. Men allaqachon Internetdan bir nechta rasmni yuklab oldim. Biz birini tanlashimiz mumkin. Orqaga tugmasi bilan buni tanlaymiz. Endi "Resurslar" bo'limiga qaraydigan bo'lsak, biz "back2.png" - "Transmit" tugmachasini qo'shdik. Bizda ushbu faylni uzatish uchun mavjud.< a href = "#" onclick = "history.back();return false;" > < img src = "assets/back2.png" alt = "Orqaga" / > < / a >

Hammasi shunday, "OK" tugmasini bosing. Muse’ning o‘zida hech qanday o‘zgarishlarni ko‘rmaymiz. Biz barcha o'zgarishlarni faqat brauzerda saytni ko'rganimizda ko'ramiz. Saytni brauzerda ko'rish va sahifalarimizni kezib chiqish uchun yana ctrl+alt+E tugmalarini bosing.

Keling, sahifaga o'tamiz, masalan, "2-1-bet", endi "sahifa-2", endi "3-sahifa" ga, keyin esa "bet-4" sahifasiga o'tamiz. Va endi, agar biz orqaga tugmachasini bossak, biz teskari tartibda ketma-ket orqaga qaytamiz bosh sahifa sayt. "Orqaga" tugmasini bosing, "sahifa-3" sahifasiga, "sahifa-2" sahifasiga o'ting. Va bu erda bizda endi tugma yo'q. Agar biz uni "2-sahifa" sahifasiga qo'llaniladigan shablonga joylashtirsak, bu erda "Orqaga" tugmasi ham bo'ladi. Bizda yo'qligi sababli, biz asosiy sahifaga faqat menyudagi "Uy" tugmasini bosish orqali o'tishimiz kerak. Keling, masalan, “2-2-2-sahifa”ga, keyin “2-2-1-sahifaga”, keyin “3-sahifa” va “4-bet” sahifalariga oʻtamiz. Va endi teskari tartibda: "3-sahifa", "2-2-1-bet", "2-2-2-sahifa" va asosiy sahifaga.

Albatta, bu tugmani veb-saytingizga joylashtirishingiz shart emas, lekin brauzeringizda oddiy o'qlardan foydalaning. Ammo veb-saytingizda bunday tugma bo'lishini istasangiz, unda siz buni shu yo'llar bilan qilishingiz mumkin ... Va maqolaga havola ushbu video ostida bo'ladi. Ana xolos. Dmitriy Shapovalov siz bilan edi. Ushbu videoga layk bosing, kanalga obuna bo'ling, pastda komentariya yozing va keyingi video darslargacha siz bilan xayrlashaman.

Ushbu maqolada biz kerakli joyda "Orqaga qaytish" tugmachasini qanday yaratishingiz mumkinligini ko'rib chiqamiz. Menimcha, tugmachaning nomidan uni bosganingizda nima bo'lishi allaqachon aniq. Bunday tugma toifaga ham, materialning o'ziga ham kiritilishi mumkin. Hamma narsa juda oddiy tarzda amalga oshiriladi.

Tugmani qanday qo'shishning bir nechta varianti bor, lekin men shaxsan faqat bitta usuldan foydalandim. Ya'ni, men taklif qilgan uchta variantdan uchinchi variant. Bir oz ko'proq men sizga nima uchun ekanligini aytaman.

Bizda qanday variantlar bor:

Uchinchi variantning afzalligi shundaki, agar siz tugmadagi matnni tahrirlashingiz yoki uslublar sinfini o'zgartirishingiz/qo'shishingiz kerak bo'lsa, siz faqat modulning o'zini tuzatishingiz kerak bo'ladi va tugmani u joylashgan barcha joylarda tuzatmaysiz.

Shunday qilib, saytlarimdan birida men uchinchi variantdan foydalandim:

“HTML kodi” moduli yaratildi va u yerda “Sourcerer” kengaytmasi yordamida tugma kodi kiritildi, bu materialga istalgan kodni qo‘shish imkonini beradi.

Mening ishlaydigan tugma kodim:

Ortga qaytish

Matn Bootstrap 3 komponentlari yordamida biroz o'q bilan bezatilgan va tugmaning o'zi CSS orqali yaratilgan.

Ko'pgina foydalanish imkoniyatlarini o'rganish shuni ko'rsatadiki, foydalanuvchilar (yangi va tajribali) ko'pincha brauzerda "orqaga qaytish" tugmasidan foydalanadilar. Afsuski, front-end dizaynerlari va sotuvchilari ilovalar, animatsiya, video va boshqalardan foydalanadigan zamonaviy veb-dizayn modellarini hisobga olgan holda, bu foydalanish qulayligiga qanday ta'sir ko'rsatishi mumkinligini kamdan-kam hisobga oladi. Ko'pincha, ushbu tartiblarning texnik tuzilishi "orqaga qaytish" funktsiyasiga to'g'ri javob bermaydi, foydalanuvchining aqliy naqshini buzadi va ularning tajribasini pasaytiradi.

Buning oqibatlari dahshatli bo'lishi mumkin: tajribalar paytida saytning "orqaga" tugmasini bosishga noto'g'ri munosabati ko'plab foydalanuvchilarning suiiste'mol va nomaqbul sharhlar bilan chiqib ketishiga sabab bo'ldi. Aksariyat hollarda, hatto hurmatli, kulrang sochli sub'ektlar ham dahshatli tarzda o'zlarini yo'qotdilar.

Ushbu maqoladan siz quyidagilarni bilib olasiz:

• foydalanuvchilar "orqaga qaytish" tugmasidan nimani kutishadi;
• eng ko'p uchraydigan 5 ta xato nima;
• bu muammolarga oddiy yechim.

Yechim haqiqatan ham juda oddiy, lekin ko'pincha eng yirik brendlar tomonidan ham e'tibordan chetda qoladi. Bu xatoni tuzatamizmi?

Foydalanuvchi kutishlari

Muxtasar qilib aytganda: foydalanuvchilar oldingi sahifa sifatida qabul qilgan narsalarni ko'rsatish uchun "orqaga qaytish" tugmachasini kutishadi. "Idrok qilish" so'zi juda muhim, chunki oldingi sahifaga o'xshab ko'rinadigan va texnik jihatdan nima o'rtasida katta farq bor.

Savol tug'iladi: foydalanuvchilar yangi sahifa sifatida aynan nimani talqin qilishadi? Ko'pgina hollarda, agar sahifa vizual jihatdan sezilarli darajada farq qilsa, lekin kontseptual jihatdan sayt bilan bog'liq bo'lsa, u yangi deb qabul qilinadi. Shuning uchun, sayt turli interaktiv elementlarni qanday qayta ishlayotganini kuzatish juda muhim: yorug'lik qutilari, shakllar, filtrlar va boshqalar.

Aksariyat tashrif buyuruvchilar texnik jihatlarni tushunishmaydi, lekin faqat resurs qanday ishlashi kerakligi haqidagi intuitiv g'oyalarga tayanadilar. Shuning uchun, ular "orqaga" tugmasini bosganlarida, ular allaqachon muhim tajribaga ega bo'lgan sahifani kutishadi, lekin ular biroz o'zgartirilgan interfeysga ega sahifani olishadi.

Quyida eng ommabop interaktiv elementlar va ulardan foydalanuvchi tajribasi va foydalanish qulayligini oshirish uchun foydalanish bo'yicha tavsiyalar keltirilgan.

Qatlamlar va yorug'lik qutilarini qo'llashdan maqsad foydalanuvchiga sahifaning yuqori qismida paydo bo'ladigan elementni ko'rsatishdir. Shuning uchun, foydalanuvchilar bunday elementlarni yangi sahifalar sifatida qabul qiladilar va asl holatiga qaytish uchun "orqaga" tugmasini bosing - lekin ular kutganidan butunlay boshqacha joyda bo'ladi. Bu, ayniqsa, achinarli, chunki layt qutilaridan foydalanish veb-sahifaning salbiy idrokini ko'paytiradi - ko'pchilik foydalanuvchilarga onlayn xarid qilish saytlarida bu elementlar yoqmaydi.

Filtrlardan foydalanish ko'pincha sahifani o'zgartiradi va odamga yangi tajriba beradi. Shuning uchun, saralashdan so'ng, sahifaga hech narsa yuklanmagan bo'lsa ham, yangi sifatida qabul qilinadi. Buning sababi, har bir tashrif buyuruvchining onlayn-do'kon sahifasi bilan o'zaro ta'siridan so'ng, yangi natija hosil bo'ladi.

Ushbu misol odamlar aniqlashda texnik jihatlarga kirmasligini ta'kidlaydi yangi sahifa, lekin faqat sezgi va shakllangan idrokdan foydalaning.

3. Ro'yxatdan o'tish/to'lov shakli

To'lov sahifalari yangi sahifalar sifatida qabul qilinadi va undan ham yomoni - ko'p bosqichli jarayon sifatida qabul qilinadi, uning har bir bosqichi "orqaga qaytish" tugmasi bilan bekor qilinishi mumkin.

Bunday yondashuv muammolarni keltirib chiqarishi mumkin, oddiy misol, odam kiritilgan ma'lumotlarni tahrirlash uchun arizani to'ldirishda bir qadam orqaga qaytishni xohlaydi. "Orqaga" tugmasini bosish uni savatga qaytaradi va kiritilgan barcha (!) ma'lumotlarni o'chiradi. Tirnashish va saytni tark etish tabiiy ta'sirdir.

AJAX texnologiyasi foydalanuvchi kutganiga javob bermasligi mumkin: har bir AJAX sahifasi texnik jihatdan bir xil URL ostida joylashgan, ammo yangi sahifalar ochilayotganga o‘xshaydi.

Elektron tijorat kontekstida foydalanuvchilar 3-sahifa va 4-sahifalar alohida ekanligi va orqaga tugmasi yordamida 4-sahifadan 3-sahifaga oʻtish mumkinligi haqida aniq tasavvurga ega.

Foydalanuvchilar orqaga tugmasidan voz kechishga tayyor emaslar

Ushbu Internet-brauzer xususiyati qanchalik keng qo'llanilishini hisobga oladigan bo'lsak, foydalanuvchi kutishlari va ishlab chiquvchilarning qarashlari o'rtasidagi nomuvofiqlik masalasi juda muhim bo'lib qoladi va uni engil qabul qilmaslik kerak.

Foydalanuvchilarga ayniqsa "orqaga qaytish" tugmasi yoqdi mobil ilovalar va veb-saytlar. Tadqiqot ko'rsatganidek mobil versiyalari saytlarida ko'pchilik foydalanuvchilar ushbu funksiyadan barcha taklif qilingan resurslarda foydalanganlar. Bundan tashqari, tugmadan foydalanish faqat bitta sahifani orqaga qaytarish bilan cheklanmaydi - ba'zi sub'ektlar uni ketma-ket 15 (!) marta bosgan.

Kompyuter foydalanuvchilari ham tez-tez tugmani bosadilar - lekin mobil telefon egalari kabi emas, chunki foydalanuvchilar ish stoli kompyuterlari Saytda qulay navigatsiya mavjud.

Yechim

Yaxshi xabar shundaki, HTML5 muammoning nisbatan sodda yechimiga ega va u HTML5 History API deb ataladi. Aniqrog‘i, history.pushState() funksiyasi sahifani qayta yuklamasdan URL manzilini o‘zgartirish imkonini beradi. Shunga ko'ra, sayt "orqaga qaytish" tugmachasini bosgan foydalanuvchining kutganiga muvofiq harakat qiladi.

Xayrli kun, menda buyurtma berishda tugmachani qanday qilib orqaga siljitish va keyingi tugmani yoniga qo'yish haqida savolim bor. Endi men uchun shunday ko'rinadi: agar siz uni ko'chirsangiz pastga, u ishlashni to'xtatadi ..

Buning yechimi bor

Assalomu alaykum, kimdir menga orqaga tugmachani, masalan, xarid qilish savatchasida, oldingi sahifaga qaytishi uchun qanday qilishni ayta oladimi?

Shablonning istalgan joyiga tugmani kiriting, masalan, bu

+1

Brauzerdagi orqaga tugmasini bosganimda, sahifani yangilamagunimcha, barcha uslublar yo'qolib ketadi

Salom, men savatda "Orqaga qaytish" tugmachasini yaratdim, hatto tugma ham emas, faqat "Orqaga qaytish" kodi bilan havola. Endi savatga qaytganingizda...

Buning yechimi bor

Xayrli kun! Men quyidagi muammoga duch keldim: savatga biror narsa qo'shsangiz va brauzerda "orqaga" tugmasini bosganingizda, sahifani yangilamaguningizcha savatdagi narsalar (qo'shimcha blokda) haqida ma'lumot saqlanmaydi. Bular. saytga kiring, boring...

Siz ko'rsatgan sayt savat uchun plagindan foydalanmoqda. O'zgartirishlar bilan siz tovarlarni?html=1ga emas, balki?html=1&items=1;ga yuborishdan foydalanishingiz mumkin arava.

Xayrli kun. To'lov paytida har bir qadamda "Keyingi" tugmasi ko'rsatilgan "Suprime" mavzusida men tugma kodini topdim.