Hiding Labels in collections

Solved
GregoryKika
New Member
5 0 0

Hello everyone, 

I'm having problems with hiding the "labels" bar in the left side of the page. I would like to be able to use the labels as metadata, without them showing in the webpage.

I basically want to remove the part that says :

COMPRAR POR

I'm using Debut theme.

I already tried using

 

.product-single__meta .single-option-radio__label {
    display: none;
}

 

 

The post I got the code from says I need to use it on the theme.scss.liquid asset section, I did it but it does not appear to work.

GregoryKika_0-1632302309787.png

This it the link to the page, the labels are only in that product because I'm trying to solve the problem first, but the idea would be to have this change affect the whole page.

Link Kika 

0 Likes
dmwwebartisan
Shopify Partner
9165 2124 2891

@GregoryKika 

Please try this code

@media only screen and (min-width: 769px){
 .template-collection .large--four-fifths {
    width: 100%;
}

.template-collection .grid-border--left {
    border-left: 0px solid transparent;
}

.template-collection .large--one-fifth {
    width: 0%;
    display: none;
}
}
If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes

@GregoryKika 
Paste this code on top of the theme.scss file.

aside#collectionFilters {
    display: none !important;
}

Thank You.

If helpful, please Like and Accept Solution.
if you Want to modify or Customize your theme,
Hire us | Whatsapp. or Want to know more. Read our Shopify Blogs.Email us: sales@zworthkey.com
Buy me a coffee ☕ Donate Us
0 Likes

This is an accepted solution.

@GregoryKika ,

Hi

 

 

aside#collectionFilters {
    display: none;
}
 .template-collection .large--four-fifths {
    width: 100%;
}

 

 

Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
GregoryKika
New Member
5 0 0

Hey there, thanks for the answer!
It fixed the problem, but there seems to be an issue with the design now

GregoryKika_0-1632303475654.png

The products don't reach the far end of the page (where it says CARRITOS)

GregoryKika_1-1632303525207.png

This is the design, where it reaches the "end" of the page.

Any idea on how to fix this?

 

 

0 Likes

Hi @GregoryKika ,

On this page the size of the image is different, when you resize it with others then it will look fine !

oscprofessional_0-1632303880671.png

 

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
GregoryKika
New Member
5 0 0

The solution from  worked great!

Thank you very much

0 Likes

@GregoryKika 
Paste this code on top of the theme.scss file.

@media only screen and (min-width: 992px) {
div#CollectionSection {
    width: 133% !important;
    margin-left: -16% !important;
}
}
If helpful, please Like and Accept Solution.
if you Want to modify or Customize your theme,
Hire us | Whatsapp. or Want to know more. Read our Shopify Blogs.Email us: sales@zworthkey.com
Buy me a coffee ☕ Donate Us
0 Likes
dmwwebartisan
Shopify Partner
9165 2124 2891

@GregoryKika 

Please try this code 

.template-collection .wrapper {
    max-width: 100% !important;
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
BootlegCraig
Tourist
4 0 0

Hi there! I'm trying to do the same, but I don't have a "theme.css.liquid" file in my assets folder. What I'm after is to have my collections just be images as the image has the collection name in it so it's not necessary to have the name of the collection in text over them. 

asdfasdf.PNGdafdsa.PNG

0 Likes