Moving slideshow text to the bottom - Brooklyn Theme

Solved
Highlighted
Tourist
14 0 1

Hi,

I want to move the slideshow text to the bottom of the slideshow.

How would I do this?

Using the Brooklyn Theme

 

Thanks.

0 Likes
Highlighted
Shopify Staff
Shopify Staff
1220 120 308

This is an accepted solution.

Hey there, @thesotman 

 

Bo here from Shopify Support. 

 

That is a fantastic question and thank you for sharing the screenshot with us, it really helps us clarify what it is you are trying to achieve, I appreciate it! 

 

This tutorial is specific to an unedited version of the Brooklyn theme (VERSION 12.0.2). We cannot guarantee results for themes that have been modified with custom coding and/or apps. We suggest hiring a Shopify Expert if you are not comfortable proceeding with the following tutorial, or wish to make any variations to this tutorial.’

 

NB When editing the CSS of your theme it is always a good idea to duplicate your theme first and making the changes on the duplicate. This will prevent any errors from occurring on your live site. We also recommend adding CSS to the bottom of the file as opposed to altering the preexisting code. The new code will overwrite the previous code.

 

To achieve this you will need to do the following:

  • Go to Online Store > Actions > Edit Code.
  • In the Assets folder open up the theme.scss.liquid file:
  • Scroll to the bottom of this file and paste the following code:
  • .hero__text-content {
      
      vertical-align: bottom;
     padding: 15px 30px 45px;
      
    }
  • Click Save. 

Let me know how this goes and if there is anything else I can assist you with, I'm happy to help!

 

All the Best,

Bo

Bo - Social Care @ Shopify


Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution
To learn more visit the Shopify Help Center or the Shopify Blog

2 Likes
Highlighted
Tourist
14 0 1

Thank you so much!

It worked.

1 Like
Highlighted
Excursionist
44 0 7

Hello, 

I read this topic and it's very helpful.

I need a help in the same topic.. This is my website https://presets-market.com ,and I use Debut theme. Can I move the text and the heading to the left because it hides the main image .

And can I put a white frame and no fill  (shop now) button under the text like the one in the image bellow ?

I attached two photos to explain what I want to do.Screen Shot 2019-12-20 at 4.52.13 PM.pngScreen Shot 2019-12-20 at 5.00.28 PM.pngA help would be appreciate!

 

0 Likes
Highlighted
Shopify Staff
Shopify Staff
1220 120 308

Hey there, @Lilas-addas 

 

As this is a different customization for a different theme, I would ask that you start a new thread in the design forum. You can tag me in the thread if you wish and I can take a look into this for you - other developers will also have the opportunity to help you then! 

 

All the Best,

Bo

Bo - Social Care @ Shopify


Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution
To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
Highlighted
Excursionist
12 0 6

Hey there, this worked out fine for me, but I am wondering if I can change the padding to allow for a little bit more wiggle room? Or even if there is an option to just put something along the lines of "middle-bottom" instead of just "bottom"?

0 Likes
Highlighted
New Member
1 0 1

I got my text to move up by changing the 45px to 90px.

Screen Shot 2020-06-16 at 1.40.25 PM.png

1 Like
Highlighted
New Member
1 0 0

Thank you for the solution. However, is there a way to keep the text in its normal position and only change the position of the button

0 Likes