Image full width in section gallery in venture theme

Solved
Herreraluis14
Excursionist
16 0 4

Hi guys, I hope you can help me.

I currently have the "Venture" theme and I am adding an image in my HomePage via the "Gallery" section.

My problem is that the image is not showing full width (which is what I need). I would like to see it full width on both the desktop and mobile version of the phone.

Also, I have noticed that the height of the image is set, is it possible to make the image taller and not look like a "banner"?

 

Captura222.PNG

 
dmwwebartisan
Shopify Partner
5851 1338 1715

@Herreraluis14 

Please share your website URL and password if any. I will check and provide a solution here.

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
Herreraluis14
Excursionist
16 0 4

Hello @dmwwebartisan,

 

Thanks, my site is www.geekingstore.cl.

0 Likes
LitExtension
Shopify Partner
688 71 124

Hi @Herreraluis14

The width of sections on your site is set by selector class "page-width", but it's set on global. In this case, you need to specify this section, and add a private class for these sections.

The section schema has the "class" propriety. You can find your section and add the custom class there:

Example:

{% schema %}

  {

    "name": "Your section name",

    "class": "shopify-section--your-class",

    ...

  }

{% endschema %}

- Please place this code at the end of the "theme.scss" file.

.index-sections .shopify-section--your-class {

  width: 100%;

  max-width: none;

  padding: 0;

}

Screenshot to refer: https://prnt.sc/118ugtx

https://prnt.sc/11d7uzm

In case you can not do that, you can add me as a staff. I'll check it for you. (My email: tuanthinhit@gmail.com)

Hope this helps.

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!
0 Likes
Herreraluis14
Excursionist
16 0 4

Hello @LitExtension , 

I have tried to do what you said but I can not get the solution, I'll tell you what I did:

I added this code in "theme.scss.liquid":
________________________

.index-sections .shopify-section--gallery {

width: 100%;

max-width: none;

padding: 0;

}
_________________________

If you notice I changed the "your-class" to "gallery" which is the name of the section with which I added the images.

So far it remains the same, I think something is wrong.

 
0 Likes
LitExtension
Shopify Partner
688 71 124

Hi @Herreraluis14

Sorry for replying late, I missed your response. 

And sorry for that, it should: .index-sections.shopify-section--gallery not ".index-sections .shopify-section--gallery". Just remove space between "index-sections" and "shopify-section--gallery"

Hope this helps! 

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!
0 Likes
Herreraluis14
Excursionist
16 0 4

Hi @LitExtension,

thank you for your response. Unfortunately I think it does not work adding the code you mentioned, I attach photo.

Do you know if there is any other alternative? I remind you that the modification applies to the Home page.

Captura.PNG

LitExtension
Shopify Partner
688 71 124

Hi @Herreraluis14

Hope you are doing well. Please add this class "shopify-section--gallery" into the section which you're want to set full width and please place this code at the end of theme.scss:

.index-sections.shopify-section--gallery .page-width {

    width: 100%;

    max-width: none;

    margin: 0 auto;

    padding: 0;

}

Hope this helps! 

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!
0 Likes
dmwwebartisan
Shopify Partner
5851 1338 1715

@Herreraluis14 

 Please add the following code at the bottom of your assets/theme.scss.liquid file.

.index-sections.shopify-section--gallery .page-width {
    width: 100%;
    max-width: none;
    margin: 0 auto;
    padding: 0;
}

Hope this helps! 

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
Herreraluis14
Excursionist
16 0 4

Hi @LitExtension,

What do you mean by "Please add this class "shopify-section--gallery" into the section which you're want to set full width" I did not understand.

The other thing, I have updated the code proposed by you, but it doesn't work, it's a pity.

I remain attentive to your comment.

greetings!

xd.PNG

(current image - added via the gallery section - on the home page).

0 Likes