Support will be provided with delays until 3 June. We are sorry for the inconvenience.
We offer professional Design/Code Customisation and Website Optimisation Service Request Customisation
  • Status: Closed
  • Closed by: Marek (marek)
  • Closed on: 04.04.17, 19:22
  • Reason: Closed
  • Comment: Glad to help!

Ticket #10275 - Loading speed and responsive version.

Hi, Im having problems with my loading speed and responsive version. Is there any suggestion on what should I do to better the loading speed and to fix how the page should behave in responsive? Thank you so much.

This ticket does not depend on any other tickets.

Marek (marek) 02 Mar 2017, 22:27

First of all you need to compress your images. Total homepage weight is 23Mb, it's incredibly high. Look at this screenshot too see images weight: {{}} Since you will compress your images we will move to the next step to make it work faster

Juan (j.s.rivera) 02 Mar 2017, 22:29

Alright, I'll get on it. Mind telling me where to find that list of image size so I can see which need editing?

Marek (marek) 02 Mar 2017, 22:34

In google chrome you can go to "View" > "Developer" > "Developer Tools" and click "Network" tab {{}}

Juan (j.s.rivera) 15 Mar 2017, 19:59

Hi Marek, Ive compressed the pictures like you said and the total page weight should be way less. What should I do next for the page to start loading faster and the responsive version to work properly?

Marek (marek) 15 Mar 2017, 21:49

Next step is to use cache plugin for wordpress. Here is detailed manual how to configure it!/performance But this step recommended to start since you will finish to configure your website.

Juan (j.s.rivera) 15 Mar 2017, 22:12

Should I download this? Because the performance tap doesn't show up on my wordpress admin menu. And another question. Running the site through google page insight it says the JS should be compressed.. Is this posible or will it affect in anyway?

Marek (marek) 15 Mar 2017, 22:26

Yes, you need to install that plugin. Go to Plugins and just find it in search bar That plugin will solve the issue with uncompressed JS

Juan (j.s.rivera) 15 Mar 2017, 23:28

About the JS it says in the manual you sent, that this option "Minify" will be used with cloudfare and not W3. Should I download this plug in as well?

Juan (j.s.rivera) 16 Mar 2017, 00:07

I found it.. Can I ask your opinion on something: You think its a good idea to pay for the upgrade for the W3? does it really make it that much faster?

Marek (marek) 16 Mar 2017, 10:19

I didn't use paid vesrion, so I can't compare. But there are a lot of options available in free version, and it should be enough for the first time

Juan (j.s.rivera) 16 Mar 2017, 14:41

Hi Marek, Thanks for giving me your opinion. I have enable cloudfare and did all that you told me on the performance tab. I feel the page could load a bit faster. can you check it out and tell me what you think? Also wanted to ask you about the responsive version cause its not working properly. Juan,

Marek (marek) 16 Mar 2017, 20:34

Yes, it works faster, but still not fast. As for me, the best way is to remove some elements from homepage, because it's still to heavy.

Juan (j.s.rivera) 16 Mar 2017, 20:56

Ok. Ill work on the homepage elements. Can you tell me how can I make the responsive version work better.

Marek (marek) 16 Mar 2017, 20:57

What's wrong with responsive?

Juan (j.s.rivera) 16 Mar 2017, 23:41

All the content is showing up wrong. you can check out the homepage and you'll see the titles are not responsive in the category grid and the menu is not working. On the shop the widgets are not showing up on the arrow tab like the demo and the single product page is not showing up as it should. Its messy. Maybe you can check it out and let me know? Juan,

Juan (j.s.rivera) 21 Mar 2017, 15:57

Hi Marek.. Csn you help me?

Marek (marek) 21 Mar 2017, 22:06

Sorry, I missed this ticket. I'll try to help you with that tomorrow

Marek (marek) 22 Mar 2017, 10:35

Something wrong with your website. Please check it out

Juan (j.s.rivera) 22 Mar 2017, 15:10

DOn't know what happened.. it was working just fine yesterday night. I can get into the admin page in wordpress but the actual page wont load. Any idea of what can I do?

Marek (marek) 22 Mar 2017, 15:15

It works fine for me now. I didn't touch anything

Juan (j.s.rivera) 22 Mar 2017, 15:15

I was about to write the same to you.

Juan (j.s.rivera) 22 Mar 2017, 21:05

Hi Marek, Wanted to know if you ha the time to check things out?

Marek (marek) 22 Mar 2017, 21:07

Yes, I'm here, and back to you as soon as I'll finish one critical ticket. Today :)

Juan (j.s.rivera) 22 Mar 2017, 21:16

Dont worry.. Im aware youve helped me plenty

Marek (marek) 22 Mar 2017, 21:18

Thank you for understanding

Marek (marek) 22 Mar 2017, 23:04

Responsive version should be much better now. Please check it out

Juan (j.s.rivera) 23 Mar 2017, 19:28

Hi Marek, Yes, its working better but I still see some details that maybe you can help me with. On the single product page things are a bit mixed around. Im sending you a couple of screenshots from my page and your demo so you can see he difference. On your the product pics appear bigger and the description appears below it. Also the rating tab looks like its overlapping.

My single product page.png (264.7 KiB)
My single product page 2.png (49.5 KiB)
single product page demo.png (303.7 KiB)
single product page demo 2.png (207.9 KiB)
rating tab.png (56.6 KiB)
Juan (j.s.rivera) 23 Mar 2017, 20:56

Sorry Marek, I forgot to mentioned that the menu is also showing up wrong. its showing up incomplete.

menu responsive..JPG (33.3 KiB)
Marek (marek) 24 Mar 2017, 12:00

Hi Juan. single page issues has been fixed Regarding menu it looks fine for me: {{}}

Juan (j.s.rivera) 25 Mar 2017, 17:09

Hi Marek, Dont know if your available today but still wanted to leave this comment. About the Menu; it is working but somehow its being cut in the single product page. Also I would like to ask you for your help on a little issue: 1.In the responsive version on the category grid on the homepage the buttons are not sliding up completely and are being cut, so on some categories its shows up, on others it shows half a button and on some it just doesn't appear. Can you help me out? 2.on this same category grid I would like to ask you if theres anything I can do to fix the "Tienda" title, the one that slides up when you hover the category, and the titles for each category box because its showing up just fine in font size on the desktop version but on responsive its not shrinking to fit the screen. thank you,

responsive menu single produc... (22.7 KiB)
buttons on categry grid home.... (30.5 KiB)
titles on category box.JPG (31.1 KiB)
Marek (marek) 26 Mar 2017, 12:33

Here is the fix for menu <code>@media (max-width:768px) { header#masthead { position:relative; z-index:999 } }</code>

Marek (marek) 26 Mar 2017, 12:41

Here is the fix for buttons and "Tienda" title: <code> @media (max-width:768px) { body #page .cat_img_wrap .cat-title { margin-bottom:0 } .cat_img_wrap .cat-separator {display:none} .cat_img_wrap strong {margin-bottom:0} .body .woo_categories-container .plugin-title {font-size:4em} } </code>

Juan (j.s.rivera) 27 Mar 2017, 02:53

Hi Marek, Thank you for your help. It did help my menu on the single product page and also it helped with the buttons on the category box, however the title for "tienda" and the category titles are still not responsive.. Any idea of what i might need to do?

Marek (marek) 27 Mar 2017, 11:24

Try to use "!important", like this <code>@media (max-width:768px) { .body .woo_categories-container .plugin-title {font-size:4em !important} } </code>

Juan (j.s.rivera) 27 Mar 2017, 15:31

Still not working... you mind checking it out?

Juan (j.s.rivera) 27 Mar 2017, 18:33

Hi Marek, I also found another thing in the lookbook page on the responsive version. Ill send you an attachment so you see whats up.

lookbook responsive.JPG (25.9 KiB)
Marek (marek) 28 Mar 2017, 11:34

It should be much better now

Juan (j.s.rivera) 28 Mar 2017, 15:26

Yes its much better now. I think you got to fixing the title for "tienda" in the responsive version. Thanks for the help. Maybe you can help me out with the category box titles that still showing up to big?

category title responsive.JPG (35.8 KiB)
Juan (j.s.rivera) 28 Mar 2017, 16:05

Hi Marek, Also wanted to ask you: In my responsive version on the category shop the products are showing in 1 column. Is there a way to show them in tow columns? Also is there a way to take the page numbers that appear on top to only show up only at the bottom?

category shop responsive.JPG (32.3 KiB)
Juan (j.s.rivera) 28 Mar 2017, 19:56

Hi Marek, I figured out the code for the category box title for it to be smaller on responsive. so don't worry about that. Although I still need help with my last comment on the category shop and the items being shown in responsive.

Marek (marek) 29 Mar 2017, 11:33

The fix for page navigation is following: <code>@media (min-width:1600px) { .woocommerce nav.woocommerce-pagination ul li a{ line-height:30px } .woocommerce nav.woocommerce-pagination ul li { width:34px; height:34px; margin-left:5px; } } </code>

Juan (j.s.rivera) 29 Mar 2017, 14:38

Hi Marek, good morning. The code isnt changing anything on my category shop in responsive. The shop still showing up in a list of only one column and the page number still is showing up on top. What i want is for the products to show up in a 2 column list on responsive and for the page number tab to be only at the bottom.. is it possible? Check out my attachment for my second to last comment.

Juan (j.s.rivera) 29 Mar 2017, 19:08

Something like the picture in the attachment. This is a print screen of how its showing up on an ipad.

Screen Shot 2017-03-29 at 12.... (703.4 KiB)
Marek (marek) 29 Mar 2017, 22:48

I'm sorry, my mistake. I forgot to change the max-width. Please change "@media (min-width:1600px) {" to "@media (max-width:768px) {"

Juan (j.s.rivera) 29 Mar 2017, 23:09

Hi, I did just that but still no change. Can you check it out? Maybe tomorrow if its too late.

Marek (marek) 29 Mar 2017, 23:09

Let me try

Marek (marek) 29 Mar 2017, 23:13

Here is how i see it {{}}

Juan (j.s.rivera) 29 Mar 2017, 23:23

Oh. My mistake if I didnt make my self clear. English is not my first language. Besides that which by the way thank you i wanted it to look like that. I also was wondering if its possible to show product 2 at a time like the attachment i sent you from the ipad version.. If you see in responsive, on a telephone screen the shop shows up in a list of 1. Ill send you attachment for how it is and how i want it (if possible)

how it is.JPG (30 KiB)
how i want it.JPG (29.4 KiB)
Marek (marek) 29 Mar 2017, 23:25

But there is really little place for such view

Juan (j.s.rivera) 29 Mar 2017, 23:27

the thing is that when i see it in my phone (iphone 6) the pictures show up so big and the full space button make it difficult to scroll down. Can you show me how to do it so i can check it out and see how it shows up? or maybe you have any idea of how could i make it better?

Marek (marek) 30 Mar 2017, 09:57

Now it should be ok.

Juan (j.s.rivera) 30 Mar 2017, 14:06

Can I ask you to teach me how to change it from 1 column to a 2 columns in case i want it back? Just to learn how to cause I love how it looks now

Marek (marek) 30 Mar 2017, 22:38

Here is it: {{}} col-xs-12 - 1 column col-xs-6 - 2 column

Juan (j.s.rivera) 31 Mar 2017, 14:35

Wow! thank you for the help

Juan (j.s.rivera) 01 Apr 2017, 03:19

Hi Marek, Can you help me with this problem: my cart is showing up way big.

Screen Shot 2017-03-31 at 8.1... (1.26 MiB)
Marek (marek) 01 Apr 2017, 09:57

Strange, but I see it like this: {{}}

Juan (j.s.rivera) 01 Apr 2017, 13:53

Yes, my bad. Forgot to mentioned that it shows up like i showed you on the single product page and on the store.

Marek (marek) 03 Apr 2017, 11:52

Try this fix: <code>@media (max-width:768px) { #page .woocommerce ul.cart_list li a, #page .woocommerce ul.product_list_widget li a {display:flex;align-items:center} #page .woocommerce ul.cart_list li a img, #page .woocommerce ul.product_list_widget li a img {width:100px} }</code>

Juan (j.s.rivera) 03 Apr 2017, 14:23

I put down the code you gave me but the problem persist. What should i do?

Marek (marek) 04 Apr 2017, 09:50

That was my mistake. Now it works

Juan (j.s.rivera) 04 Apr 2017, 14:15

Not working..

cart how it shows in shop.png (1.19 MiB)
cart how it shows in home.png (0.99 MiB)
Marek (marek) 04 Apr 2017, 18:42

I just enabled that fix for all devices, please check it out

Juan (j.s.rivera) 04 Apr 2017, 18:44

The cart is working now. still it makes the screen a little bigger when it pops up, so i have to scroll it a little to the right to see it fully

Marek (marek) 04 Apr 2017, 19:03


Juan (j.s.rivera) 04 Apr 2017, 19:04

thank you