Taking text and box out of slide show also adding another slide DAWN

Solved

Taking text and box out of slide show also adding another slide DAWN

Tyra1
New Member
4 0 0

Hi! I was wondering if someone could help me please I'm trying to have a slide show on my homepage however I can't seem to find a code to get rid of the text and box blocking the slide. I'd also like to add a third slide iff possible too please. Thank you!

Accepted Solutions (2)

BSS-TekLabs
Shopify Expert
449 143 156

This is an accepted solution.

- Here is the solution for you
- Please follow these steps:

step.png

- Then find the base.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

.slideshow__text-wrapper.banner__content {
display: none !important;
}

- Here is the result you will achieve:

BSSTekLabs_0-1719227877491.png

 

 

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution .
For give Gift to customers and Upsell in Cart, check out Salepify: Free Gifts with purchase

Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency

View solution in original post

parth_ghelani
Shopify Partner
74 11 12

This is an accepted solution.

Hello @Tyra1 

As i understand what you were saying is that you want to hide the content box from the slide and want to add third slide. Am i right ??

If yes then i found the best and simple solutions to make it happen.

To do it, you just need to follow below steps

1. Go to admin > themes > open the customisation of your theme

parth_ghelani_0-1719232237415.png

2. After opening Customisation, click on slideshow section so you can see the settings just like below image.

parth_ghelani_1-1719232362302.png

 

3. Click on the Image slide, so you can see another settings for image slide.

parth_ghelani_2-1719232482297.png

4. In the settings for Image slide, scroll down and find the checkbox says "Show container on desktop".

parth_ghelani_3-1719232568982.png

5. If the checkbox is checked already, then just uncheck it so the content box from image is removed as background.

parth_ghelani_4-1719232680404.png

6. after the backgound is removed, just remove the content like heading, subheading and button label from settings in same panel

parth_ghelani_5-1719232801458.png

7. By doing this, your main problem is solved and to add new and third slide, just click on add slide in slideshow section at left hand slide.

parth_ghelani_6-1719232879495.png

 

Don't forget to save the changes from top right corner in customisation.

It is just simple and you can do it by yourself.

 

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

 

Parth Ghelani

View solution in original post

Replies 8 (8)

Moeed
Shopify Partner
4304 1105 1354

Hey @Tyra1 

 

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

 

Best Regards,
Moeed

Need a Shopify Specialist? Chat on WhatsApp


- Custom Design | Advanced Coding | Store Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
Tyra1
New Member
4 0 0
Hi! The password is leemaz
And the URL is
https://venchago.com

Thank you so much!
Moeed
Shopify Partner
4304 1105 1354

Hey @Tyra1 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

 

<style>
.banner__content.banner__content--middle-center {
    display: none !important;
}
</style>

 

RESULT:

Moeed_0-1719226155863.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify Specialist? Chat on WhatsApp


- Custom Design | Advanced Coding | Store Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
Tyra1
New Member
4 0 0

Hi! Thank you so much! I can't seem to find where to put it I've tried adding it at the bottom where I've just put the XXXXXX but when I click preview it doesn't seem to work as I can't find a code where it says  </body> tag Just the body bit sorry! Is that the correct bit for me to add it? Thanks! Tyra

 

window.accessibilityStrings = {
imageAvailable: `{{ 'products.product.media.image_available' | t: index: '[index]' }}`,
shareSuccess: `{{ 'general.share.success_message' | t }}`,
pauseSlideshow: `{{ 'sections.slideshow.pause_slideshow' | t }}`,
playSlideshow: `{{ 'sections.slideshow.play_slideshow' | t }}`,
recipientFormExpanded: `{{ 'recipient.form.expanded' | t }}`,
recipientFormCollapsed: `{{ 'recipient.form.collapsed' | t }}`,
};
</script>

{%- if settings.predictive_search_enabled -%}
<script src="{{ 'predictive-search.js' | asset_url }}" defer="defer"></script>
{%- endif -%}

XXXXXXXXXXXXXX
</body>
</html>

Rahul_dhiman
Shopify Expert
204 40 37

Hello @Tyra1 
Go to online store ---------> themes --------------> actions ------> edit code-------> assets-------> section-image-banner.css -------> line number 7
add this code

.banner__box.gradient {
  transform: perspective(0);
  display: none;
}

and the result will be

14.png

If you find this helpful, please like and mark the job as completed.
Thanks

Was I helpful?

Buy me a coffee



Want to modify or custom changes or bug fix on store . Or Need help with your store? Or -Want Complete Storefront
Email me -rahul@prowebcoder.com - Skype: live:dhiman.639
Checkout Some Free Sections Here
Tyra1
New Member
4 0 0

Hi! Thank you! It's still not working unfortunately I've tried pasting it in different placements too sorry! is there any other way to make it work? Thank you! Tyra

BSS-TekLabs
Shopify Expert
449 143 156

This is an accepted solution.

- Here is the solution for you
- Please follow these steps:

step.png

- Then find the base.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

.slideshow__text-wrapper.banner__content {
display: none !important;
}

- Here is the result you will achieve:

BSSTekLabs_0-1719227877491.png

 

 

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution .
For give Gift to customers and Upsell in Cart, check out Salepify: Free Gifts with purchase

Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency

parth_ghelani
Shopify Partner
74 11 12

This is an accepted solution.

Hello @Tyra1 

As i understand what you were saying is that you want to hide the content box from the slide and want to add third slide. Am i right ??

If yes then i found the best and simple solutions to make it happen.

To do it, you just need to follow below steps

1. Go to admin > themes > open the customisation of your theme

parth_ghelani_0-1719232237415.png

2. After opening Customisation, click on slideshow section so you can see the settings just like below image.

parth_ghelani_1-1719232362302.png

 

3. Click on the Image slide, so you can see another settings for image slide.

parth_ghelani_2-1719232482297.png

4. In the settings for Image slide, scroll down and find the checkbox says "Show container on desktop".

parth_ghelani_3-1719232568982.png

5. If the checkbox is checked already, then just uncheck it so the content box from image is removed as background.

parth_ghelani_4-1719232680404.png

6. after the backgound is removed, just remove the content like heading, subheading and button label from settings in same panel

parth_ghelani_5-1719232801458.png

7. By doing this, your main problem is solved and to add new and third slide, just click on add slide in slideshow section at left hand slide.

parth_ghelani_6-1719232879495.png

 

Don't forget to save the changes from top right corner in customisation.

It is just simple and you can do it by yourself.

 

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

 

Parth Ghelani