Help With Shrinking a Section

Solved

Help With Shrinking a Section

BeejFarms0
Tourist
3 0 0

Hi everyone, I wanted to see if there was a way to shrink the height of these sections in our home page.

 

The sections in question are the Rich Text sections that say "Our Three Pillars" and "Welcome To The Farm", I have included screenshots as well. Shopify theme is Narrative version 10.6.1. Thank you for any input!


Url: https://beejfarms.org/

 

Our Three Pillars.png

Farm.png

  

Accepted Solutions (2)

BSSCommerce-HDL
Shopify Partner
2303 847 1061

This is an accepted solution.

Hi @BeejFarms0
Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

BSSCommerceHDL_0-1717893062641.png

 

Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

BSSCommerceHDL_1-1717893067631.png

 

Step 3: Insert the below code at the bottom of the file -> Save

.rich-text {
    padding: 60px 0px !important;
}

Here is result: 

BSSCommerceHDL_2-1717893097455.png

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

Sale banner, pop ups: Customize your sale banner, pop-ups and create countdown bar to boost conversion rate.
Simicart: Transform your Shopify store into a stunning and fully functional mobile app with just a few simple steps.
Product Labels & Badges:
Get more sales with striking labels, badges, and banners from our 10,000+ available templates.

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

View solution in original post

PageFly-Henry
Shopify Partner
1184 335 289

This is an accepted solution.

Hi @BeejFarms0 

This is Henry from PageFly - Landing Page Builder App

 

You can try this code by following these steps: 

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

Step 2: Search file theme.liquid

Step 3: paste bellow code in tag </body> -> save.

 


<style>

.rich-text.rich-text--1652768232550fac9f, .rich-text.rich-text--rich-text  {

    padding: 40px !important;

}

</style>

Hope that my solution works for you.

Best regards,

Henry | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

View solution in original post

Replies 5 (5)

BSSCommerce-HDL
Shopify Partner
2303 847 1061

This is an accepted solution.

Hi @BeejFarms0
Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

BSSCommerceHDL_0-1717893062641.png

 

Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

BSSCommerceHDL_1-1717893067631.png

 

Step 3: Insert the below code at the bottom of the file -> Save

.rich-text {
    padding: 60px 0px !important;
}

Here is result: 

BSSCommerceHDL_2-1717893097455.png

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

Sale banner, pop ups: Customize your sale banner, pop-ups and create countdown bar to boost conversion rate.
Simicart: Transform your Shopify store into a stunning and fully functional mobile app with just a few simple steps.
Product Labels & Badges:
Get more sales with striking labels, badges, and banners from our 10,000+ available templates.

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

BeejFarms0
Tourist
3 0 0

Thank you, we really appreciate it!

PageFly-Henry
Shopify Partner
1184 335 289

This is an accepted solution.

Hi @BeejFarms0 

This is Henry from PageFly - Landing Page Builder App

 

You can try this code by following these steps: 

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

Step 2: Search file theme.liquid

Step 3: paste bellow code in tag </body> -> save.

 


<style>

.rich-text.rich-text--1652768232550fac9f, .rich-text.rich-text--rich-text  {

    padding: 40px !important;

}

</style>

Hope that my solution works for you.

Best regards,

Henry | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

PageFly-Henry
Shopify Partner
1184 335 289

In addition, I realize that the header is quite large, it takes up 1/4 of your page, you should reduce the height of the logo so that the header can be thinner.

PageFlyHenry_2-1717899369651.png

 

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

BeejFarms0
Tourist
3 0 0

Thank you very much for your time.