How can I change the color of the 'Show More' button in the Dawn theme?

GaijinGarageLLC
New Member
4 0 0

I added the Product Type filter from the Search & Discovery App into my Shopify store. However, when you go to scroll through the list, it randomly ends after it displays 10 product type categories. There is no scroll wheel option, but there is a + Show More option. 

 

The issue is the + Show More button is not visible. You have to highlight a section of your screen if you want to find the button. What do I need to do to change the color of the + Show More button? For reference, I am using the free "Dawn" theme from the shopify library until my business gets on it's feet. I looked in the theme section but I'm not seeing an option to change the color of the text or make it to where it doesn't require you to highlight a section of the page to see the button.

 

Please Help.

 

https://www.gaijinperformance.com/collections/shop-parts?sort_by=best-selling&filter.v.price.gte=&fi...

 

Before Highlighting the section where the button should be

GaijinGarageLLC_1-1676597616602.png

 

 

After Highlighting the section where the button should be

GaijinGarageLLC_0-1676597574220.png

 

Replies 4 (4)

GemPages
Shopify Partner
5604 1261 1224

Hello @GaijinGarageLLC

It's GemPages support team and glad to support you today.


1. Go to Online Store -> Theme -> Edit code

GemPages_1-1676608654763.png

 

2. Open your theme.liquid file, paste the below code before </body>

<style>
  #Show-More-3-template--17713803460897__product-grid{
    color: inherit;
  }
</style>

 

I hope the above is useful to you.


Kind & Best regards, 
GemPages Support Team

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center

infoatcodelab7
Shopify Partner
593 141 147

Hello @GaijinGarageLLC 

to make show more / show less text visible

 

1. In your Shopify Admin go to online store > themes > actions > edit code

2. Find Asset > base.css and paste this at the bottom of the file:

 

#main-collection-filters .label-show-more,
 #main-collection-filters .label-show-less {
	color: #000;
}

 

Hope this works for you as well.

Want to modify or develop new website, Hire us.
If helpful then please Like and Accept Solution .
Email: info@codelab7.com

PageFly-Victor
Shopify Partner
7865 1785 3073

Hi @GaijinGarageLLC 

This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

 

Online Store ->Theme ->Edit code

Assets ->Base.css

.button-show-more.link underlined-link.no-js-hidden {
   color: #000 !important;
}

Hope you find my answer helpful!

Best regards,

Victor | PageFly

GaijinGarageLLC
New Member
4 0 0

All,

 

I am still having the issue. It fixed the problem when I had a single page that listed every part. However, I've changed it to where each vehicle make has a sub category model. In each of those models, the + Show More button isn't visible unless you highlight the general vacinity. How do I fix this across my entire site? I tried all 3 of the fixes suggested & none of them have fixed the issue for me.