Solved

View All Button - Collection Section for Mobile

amac95
Tourist
7 0 2

My view all button for my collection page does not display correctly on mobile.  On desktop the view all button sits as a proper button below images.  However on mobile its just a "view all" text under the title.  How can I replicate the same button on mobile as I have on desktop.

 

CollectionsMobile.PNG

Collectionsdesktop.PNG

  

Accepted Solution (1)
codexecom
Shopify Partner
57 9 13

This is an accepted solution.

Hi, 
    Please follow these instruction 

 

Step: 1 Go to Online Store  --> Themes
Step: 2 Click on three dots placed before publish Button  --> Edit Code
Step: 3 Search this file "base.css"
Step: 4 At the last  Paste this code and save file

            @media (max-width:749px){
                  .title-wrapper-with-link a {
                       display: none;
                  }
                  .collection-list-view-all.small-hide.medium-hide {
                        display: block !important;
                   }
            }

 

codexecom_0-1697823729775.png

 

Need Freelance Shopify Developer, Designer or For further Discussion
Reachout me on whatsapp:+91 919721741072 or , Skype: https://join.skype.com/invite/sDrWRlIVb20I

View solution in original post

Replies 5 (5)

codexecom
Shopify Partner
57 9 13

Please share website link

Need Freelance Shopify Developer, Designer or For further Discussion
Reachout me on whatsapp:+91 919721741072 or , Skype: https://join.skype.com/invite/sDrWRlIVb20I
amac95
Tourist
7 0 2

Hi @codexecom, link is Products – Pawfectly Pawsome

 

Password is Buddy

codexecom
Shopify Partner
57 9 13

This is an accepted solution.

Hi, 
    Please follow these instruction 

 

Step: 1 Go to Online Store  --> Themes
Step: 2 Click on three dots placed before publish Button  --> Edit Code
Step: 3 Search this file "base.css"
Step: 4 At the last  Paste this code and save file

            @media (max-width:749px){
                  .title-wrapper-with-link a {
                       display: none;
                  }
                  .collection-list-view-all.small-hide.medium-hide {
                        display: block !important;
                   }
            }

 

codexecom_0-1697823729775.png

 

Need Freelance Shopify Developer, Designer or For further Discussion
Reachout me on whatsapp:+91 919721741072 or , Skype: https://join.skype.com/invite/sDrWRlIVb20I
amac95
Tourist
7 0 2

Thanks so much @codexecom.  That worked!  I don't suppose you could help with my other issue I have on my product page with my filter colour?

 

Re: My filters are missing on mobile due to text colour - Shopify Community

PageFly-Richard
Shopify Partner
4302 975 1629

Hi @amac95 

This is Richard from PageFly - Shopify Page Builder App, I’d like to suggest this idea:
Online Store ->Theme ->Edit code
Assets ->Base.css

@media (max-width:767px){
.title-wrapper-with-link a {
    display: none !important;
}
.collection-list-view-all.small-hide.medium-hide {
    display: block !important;
}
}

Hope you find my answer helpful!
Best regards,
Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.