Applying better the list and grid view of the products

  • Impression eStudio
  • Topic Author
  • Offline
  • Premium Member
  • Premium Member
More
4 months 3 weeks ago - 4 months 3 weeks ago #162722 by Impression eStudio
Applying better the list and grid view of the products was created by Impression eStudio
Hi, 

In the administration area of the Eshop, there is the option to select if the products will display as list or grid. (Obviously the grid is the most used option.)

Maybe I am wrong but if I select the list view, then the page with the products is painted instantly in the browser.
But if I select the grid view then I see a flickering of the products each time the page is loaded. 
This is also happening in the demo.
I think this means that the HTML code defines the products to be displayed using the listing view, and then the Javascript code changes the view to grid. This cause the products to be rearranged when using the grid view each time the page is loaded.
Obviously this is not good for the users and Google.
So it would be good if this option was coded in the HTML code and not in Javascript.

Thanks
Last edit: 4 months 3 weeks ago by Impression eStudio.

Please Log in or Create an account to join the conversation.

  • Giang Dinh Truong
  • Offline
  • Administrator
  • Administrator
More
4 months 4 days ago #163024 by Giang Dinh Truong
Replied by Giang Dinh Truong on topic Applying better the list and grid view of the products
Hello,

That setting option only allows you to select default view when products list showing at the first time.

Sincerely, Giang

Please Log in or Create an account to join the conversation.

  • Impression eStudio
  • Topic Author
  • Offline
  • Premium Member
  • Premium Member
More
3 months 3 weeks ago - 3 months 3 weeks ago #163217 by Impression eStudio
Replied by Impression eStudio on topic Applying better the list and grid view of the products
Hi,

I agree that this option allows to select the default view of the products for the first time and the view can change by the user.
The key point is how the selected view is applied.
The list view is applied by html code but the grid view is applied through Javascript.
So, if as a test, you disable/block Javascript in the website, then even when grid view is selected, it will show the list view.
Obviously none will disable Javascript, but this means that the appearance of each product list using the grid view is completed after Javascript is executed.
This is a known disadvantage, as Google says many times, for having a good website performance.
So the solution is to apply both the list or grid view, for the first time used, in the html code and use Javascript only for the change. I think this means that you need to use ajax to pass the selected option to PHP session in order the html code to include the correct class.

In case you want to avoid this extra effort, maybe you could make the grid view as the standard view because it is used in the 90% of the eshops.

Thanks
Last edit: 3 months 3 weeks ago by Impression eStudio.

Please Log in or Create an account to join the conversation.

  • Giang Dinh Truong
  • Offline
  • Administrator
  • Administrator
More
3 months 2 weeks ago #163411 by Giang Dinh Truong
Replied by Giang Dinh Truong on topic Applying better the list and grid view of the products
Thank you for giving me more information.

I will take the time to check more on this.

Sincerely, Giang

Please Log in or Create an account to join the conversation.

Moderators: Giang Dinh Truong