• Closed by: Marek
  • Closed on: 15.12.13, 22:11
  • Reason: Fixed

Ticket #2422 - Mobile Version

Hey together

I have a question about the Mobile Version of the allysum theme.
I have some problems with the view, because sometimes it looks really buggy.
I have some screenshot to show you what i mean. (iPhone 5 and also one screenshot from HTC One)
Why on the categorie section there first show the best selled products after that the addvertisment and after that the products? Can I delet the part with the best selled products and the add for the mobile version.

Can you help me please. (www.colorcase.ch)

Thanks for your answer.

Comments

Alex 14 Dec 2013, 22:31

Hi.
Add to the end of file /themes/alysum_2.0/css/alysum.css

/* $customer modifications - responsiveness fix */
@media (max-width: 979px) and (min-width: 730px) {
    .sf-menu > li {margin: 0 6px;}
    .sf-menu > li > a, .sf-menu > li > a.sf-with-ul {font-size: 14px;}
    .theme-default .nivoSlider img {width: 728px !important; height: auto !important}
    
}
@media (max-width: 729px) and (min-width: 480px) {
    #header_logo {top: 60px;}
    #pk_customlinks ul li a {font-size: 13px;}
    #pk_customlinks ul li a {padding: 0 5px !important}
    .theme-default .nivoSlider img {width: 450px !important; height: auto !important}
    .sortPagiBar #nbrItemPage {margin-left: 105px;}
}
@media (max-width: 479px) {
    
    #pk_customlinks ul li a {font-size: 16px;}
    #pk_customlinks ul li a {padding: 0 5px !important; margin-bottom: 20px; border: none}
    .theme-default .nivoSlider img {width: 250px !important; height: auto !important}
    #pk_customlinks ul li {width: 100% !important;float: none;}
    #search_block_top {top: 390px;}
    .sf-menu-wrapper {margin-top: 110px}
	#header_user_info {margin: 0 45px !important;position: relative;top:50px;}
    #header_user #shopping_cart {top:-40px;}
   
}

Position of the modules (best selled) this is default behavior of Alysum theme. Maybe you are right. We will think about that in the next update.
For now I can disable it in the mobile version if you need

Denis Solak 14 Dec 2013, 23:12

Hi Alex

Thanks for your quick answer.
The look is now better, but is it possible that you delet the best selled products and the addvertisment on the categorie section for the mobile version? So that there will be at first the products when i click on the categorie e.g. iPhone 5/5s categorie then i will see at first all the products and not the best selled product and the addvertisement (only in the mobile version)

Thank you.

Denis

Marek 15 Dec 2013, 16:51

Hello Denis.
This is not easy. For now I can give you fast solution how to disable that column for mobile devices, if it’s acceptable for you.
Add this css code to the end of alysum.css file.

@media (max-width: 767px) {	
 #category #left_column {display: none}
}
Denis Solak 15 Dec 2013, 17:43

Hi Marek

Yeah now it works really good… I have one question more, why are the pictures on the mobile version so deformed. The pictures are too wide.
How can i cahnge the size of the pictures for the mobile version to a sqauare format?

Thanks for your answer and your help.
Denis

Marek 15 Dec 2013, 17:46

What page are you talking about?

Denis Solak 15 Dec 2013, 18:11

Hi I’m talking about the categorie page where all the products are shown.

Look in the picture below.

Marek 15 Dec 2013, 21:42

Hello Denis.
Just fixed. Please check.

Denis Solak 15 Dec 2013, 22:10

Hello Marek…

Yeah it works now :)

Thank you ;)

Marek 15 Dec 2013, 22:11

Glad to help!