How to make a back button on a web page. Create a "go back" button Script on the original page
Good afternoon, there was a question how to move the button back and put it next to the button next when placing an order. Now it looks like this for me. Https://yadi.sk/i/_ZNvGrvEhqSk3If you move it down, it stops working. The code responsible for. ..
There is a solution
Greetings, who can tell you how you can make a back button, for example, in the shopping cart, so that a person can return to the previous page?
Insert a button into the template where you want, for example, this
+1
When I press the back button on the browser, all the styles seem to fly off until I refresh the page The default theme should show as in the screenshot below) Tell me what the problem is
Hello, I made a "Go back" button in the cart, not even a button, but just a link with a code Go back Now when you go back in the cart ...
There is a solution
Good afternoon! Faced the following problem: when adding an item to the cart and clicking the "back" button in the browser, information about the items in the cart (in the additional block) is not saved until you refresh the page. Those. go to the site, go ...
The site you specified uses a plugin for the cart. As an option with modifications, you can use sending the addition of goods not to? Html \u003d 1, but to? Html \u003d 1 & items \u003d 1, this will return the entire contents of the cart.
Good afternoon. At each step during checkout, the "Next" button is indicated. In the "Suprime" topic, I found the button code: There is a solution
Hello, we will be happy to help: [email protected]
Mr. X
Good afternoon! Faced a problem. The site has an atypical design and partially (most of the functions are preserved) the source code - the shopping cart is implemented in the form of a pop-up window. The site took it into operation as it is - without documentation, explanations, links to ...
Someone came across the admin panel terribly slows down, especially when you edit a product or template. For example, in the template, you need to insert or replace the code you select with the mouse, then the selection occurs with a delay, in the rate of the new code also with a delay. AT...
+4
Pay attention https: //site/forum/386/predlozheniy ... point number two is still not implemented, but you try to edit the lists with 500-1000 products by scrolling the loaded list further, the problem which is again related to the point ...
Shop-Script update 6.2.1
Shop Script 6.2.1 was released today. What's new: 1. Added the ability to disable lazy loading of product lists in the backend to enable pagination. In the store settings in the "General settings" section added ...
Good afternoon, there was such a problem - an undefined error in the admin panel, they will not save, part of the menu has disappeared, when adding new blocks to WYSIWYG it gives an undefined error I did not update because I changed a lot in pkhp Please tell me what ...
+19 Done
It is necessary to do in the site admin panel, the option of loading products in categories by page, and not by a loading list. For example, I have 21,000 positions and they need to be edited (added to various categories, etc.). But if, for example, the browser hangs ...
Hello, I ran into such a problem when working with the WebAssyst Shop-Script system: when entering the website of an online store, instead of the number 0, the amount of money is displayed next to the Cart, while the cart itself is empty. When you click on the link "Cart" so ...
Good afternoon. On all pages of the store there is a module that shows the amount of goods in the cart. The task is to show the number of items in the cart. The template is default. I changed the code in the index.html file like this: (if $ wa-\u003e shop)...
Good afternoon. How can you make the user display information in the frontend about how many items they currently have in the cart? That is, how to make a numeric counter near the basket, which will grow as you increase ...
The question is: how to make the cart window display the total amount of goods put into it, and where can you write the word "amount:" or the phrase "goods for the amount:" before the displayed amount?
There is a solution
I have the following code: Display the link everywhere except the main one: (if $ wa_url! \u003d $ Wa-\u003e currentUrl (0,1)) ... (/ if) And I need not to display the link on three pages, this is on the main , on / cart / and on / checkout / Please tell me what else needs to be added to this ...
In this article, we will look at how you can create a "Go Back" button in any place you need. I think from the very name of the button it is already clear what will happen when you click on it. Such a button can be inserted both into the category and into the material itself. Everything is done quite simply.
There are several options for how you can add a button, but I personally only used one method. Namely, the third option out of the three proposed by me. A little further I will tell you why he is.
What options do we have at all:
- Edit Jooml template files.
- Just paste the button code where you want.
- Create a "HTML code" module, insert the button code there, and then display this module in the right place.
The plus in the third option is that if you need to edit the text on the button or change / add a style class, then you will need to correct the module itself, and not fix the button in all places where it stands.
So, on one of my sites I used the third option:
The module "HTML-code" was created and there, using the "Sourcerer" extension, which makes it possible to add any code to the material, the button code was inserted.
My working button code:
The text is slightly decorated with an arrow, using components from bootstrap 3, and the button itself is styled through CSS.
Many usability studies show that users (both novice and experienced) often use the back button in their browser. Unfortunately, front-end designers and marketers rarely give a thought to the usability implications of this, given the current web design models that apps, animations, videos, and more use. Often, the technical structure of such layouts does not respond well to the go back function, which breaks the user's mental template and degrades their experience.
The consequences of this can be dire: during the experiments, the site's inadequate response to pressing the "back" button was the reason for many users to leave, and with abuse and unflattering reviews. In most cases, even the respectable, gray-haired test subjects lost their temper terribly.
In this article, you will learn:
- what users expect from the back button;
- what are the 5 most common mistakes;
- a simple solution to these problems.
The solution is really very simple, but it is often neglected even by the biggest brands. Shall we fix this error?
User expectations
In short: Users expect the back button to show them what they perceive as the previous page. The word "perceive" is very important, because there is a colossal difference between what appears to be the previous page and what is technically it.
The question arises: what exactly do users interpret as a new page? In most cases, if a page is significantly different visually, but at the same time is conceptually related to the site, then it is perceived as new. Therefore, it is very important to track how the site handles various interactive elements: lightboxes, forms, filters, and more.
Most of the visitors do not understand technical issues, but rely only on intuitive ideas about how the resource should work. So when they click the back button, they expect a page that has already gained important experience, and they get a page with a slightly redesigned interface.
Below are some of the most popular interactive elements and how to use them to maximize user experience and usability.
The purpose of embedding overlays and lightboxes is to show the user an element that appears on top of the page. Therefore, users perceive such elements as new pages, and press the back button to return to their original position - but they do not go where they expected. This is especially unfortunate, because the use of lightboxes only multiplies the negative perception of the web page - most users do not like these elements on online store sites.
Using filters often transforms the page and gives the person a new experience. Therefore, the page after sorting is perceived as new, even if nothing was loaded on it. This is because after each interaction of the visitor with the page of the online store, a new display of results is obtained.
This example emphasizes that people do not go into technical aspects when defining a new page, but use only intuition and formed perception.
3. Form of registration / payment
The payment page is perceived as new pages, and even worse - as a multi-stage process, each stage of which can be canceled with the "go back" button.
This approach can bring problems, a simple example - a person wants to go back a step in filling out a form in order to edit the information entered. Pressing the "back" button returns it to the basket, and deletes all (!) Entered data. Irritation and leaving the site is a natural effect.
AJAX technology may not live up to user expectations: Technically, every AJAX page is under the same URL, but it looks like new pages are opening.
In an e-commerce context, users have a clear perception that page 3 and page 4 are separate, and that the fourth to the third can be navigated by using the back button.
Users are not ready to give up the back button
Given the widespread use of this feature of the Internet browser, the issue of mismatching user expectations with the vision of developers becomes critical - not to be taken lightly.
The "go back" button was especially liked by users of mobile applications and websites. As shown by the study of mobile versions of sites, the majority of users used this function on all the proposed resources. Moreover, the use of a button is not limited to rolling back one page - some subjects pressed it up to 15 (!) Times in a row.
PC users often press a button too - but not in the same way as mobile users, as desktop users can easily navigate the site.
Decision
The good news is that HTML5 has a relatively simple solution to the problem, and it's called the HTML5 History API. More specifically, the history.pushState () function allows you to change the URL without reloading the page. Accordingly, the site will behave adequately to the expectations of the user who has pressed the "go back" button.
