Need help adjusting rich text to full width

Solved
Highlighted
New Member
8 0 0

Hey everyone! I am using the empire theme and having an issue where the rich text is the only section on our home page where it is super narrow and not using up the entire width of the website like the other sections. Does anyone have an idea or coding that could fix this issue? Appreciate your help in advanceScreen Shot 2020-04-09 at 9.04.00 AM.png

0 Likes
Highlighted

Hello @ty2kman,

Can you please share your site url

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
New Member
8 0 0

......com

0 Likes
Highlighted

Success.

@ty2kman,

Go to Online Store->Theme->Edit code->Asset->theme.scss.liquid->paste bellow code in bottom of file

.rich-text--section .rich-text-regular {
    max-width: 100%;
}
Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
New Member
8 0 0

@oscprofessional Awesome thanks so much for your help! Is there a way also to make the text much smaller so it isn't as prevalent on the website?

0 Likes
Highlighted

@ty2kman,

You want to decrease the font size of text

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
New Member
8 0 0

@oscprofessional yes that is correct or make it where the rich text works on its on scroll so this way it has a set area of size and any text now in the rich text box would have its own area to scroll down the text (and not the actual page). Whichever one you think is easier or know how to do I will take. Again really appreciate your help!

0 Likes
Highlighted

@ty2kman,

If you want to add scroll then please add below css

#shopify-section-1586393905679 .rich-text-content.rte {
    height: 94px;
    overflow-y: scroll;
}

If you want to decrease the font size then please add below css

#shopify-section-1586393905679 .rich-text-content {
    font-size: 14px;
}

Also Instead of scroll you can add "Read More" and "Read Less" button also

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
New Member
8 0 0

@oscprofessional Looks like that broke my website lol. I tried deleting that code and the first one you sent me and now it is messed up, how do I fix this?

0 Likes
Highlighted
New Member
8 0 0

I fixed it but I'm not a coding expert. Are you able to write the 100% width feature you posted first with the scroll feature together exactly how it should be pasted into the liquid file? Also, will be reaching out to you regarding another project we may have you knock out for us.... @oscprofessional 

0 Likes