Hello @divinital,
Thank you for choosing Hestia and reaching out.
I have checked the link that you provided and I am not able to view the homepage of your site, it is showing a notice that the “website not found”. You can view that using this link.
Thank you and have a nice day!!
Apologies, I decided to point the website to a new domain name…
Please use http://www.thirteenstarsbakery.com as the website in question.
Lastly, I decided to change the color of the middle section to white instead of grey, removing the need to get rid of that “bar” in between the sections I was mentioning. Therefore all I need to do is extend the lower sections to the edge of the page to remove that sort of stationary background effect.
-
This reply was modified 3 years, 9 months ago by
divinital.
Hello @divinital,
Thanks for providing the link to your site.
I don’t see an Extra white bar on your website’s homepage above the Get in touch section (See here).
Can you provide some screenshots of your website’s page so that we can have a look at it?
Thanks
Here is an image link to the problem in question… I want to extend the sections all the way to the edge of the screen so it doesn’t display the floating main-page background image.
https://ibb.co/8m5qztM
I updated the website, and now I have the two issues.
How can I increase the space between the photos/descriptions in the about section? It seems too crammed.
Lastly, how can I expand the page border (boxed above in red) on each side to the edge of the screen, so it will get rid of the static background scrolling effect? I want it to look like there is no background image.
Hello @divinital,
1- Go to pages and edit the page of the site where those columns are present. On that page, select the column options and there you can change the image and description alignment and spacing according to your needs.
2- You can extend the section by going to Customizer > Appearance settings > General settings. There you will find an option for Boxed layout, disable that option by unticking the option and the layout will be transformed to your desired needs. (https://prnt.sc/EUH4j5s7iNlh)
Please let me know if your problem is solved.
Thank you and have a nice day!
Second tip worked.
I still cannot figure out the first. My editing page does not seem to be relegated to some sort of column configuration. It’s all just in one long list.
When I click an image they’re all listed as “no alignment” selected.
Here is the entire of the code I have for the “About” section in the middle of the home page. I have absolutely no idea what I did, I am not particularly familiar with this code.
I cannot space the three columns out in and for some reason the first column has its text out of horizontal alignment with the others.
<!-- wp:cover {"customOverlayColor":"#ffffff","align":"full","className":"hestia-clear-top-padding"} -->
<div class="wp-block-cover alignfull has-background-dim hestia-clear-top-padding" style="background-color: #ffffff;">
<div class="wp-block-cover__inner-container">
<h1 class="has-text-align-center has-text-color" style="color: #3c4858; font-size: 50px;">Revolution! Take the flour back!</h1>
<div class="wp-block-columns container">
<div class="wp-block-column">
<figure class="wp-block-image size-large is-style-rounded">
<figure class="aligncenter size-full"><img src="http://thirteenstarsbakery.com/wp-content/uploads/2021/07/IMG_0473-1-edited.webp" alt="" class="wp-image-113 alignnone aligncenter" width="800" height="800" /></figure>
<h3 class="has-text-align-center has-black-color has-text-color" style="font-size: 30px; text-align: center;">Flour to the People!</h3>
<p class="has-text-align-center has-text-color" style="color: #333333; font-size: 18px; text-align: center;">Like coffee beans, grains are best used when freshly ground. Their nutritional content and taste deteriorate once the protective layers are broken. Nothing is added, and nothing is removed.</p>
<p> </p>
</figure>
</div>
<div class="wp-block-column" style="text-align: center;">
<div class="wp-block-image is-style-rounded">
<figure class="aligncenter size-full"><img src="http://thirteenstarsbakery.com/wp-content/uploads/2021/08/IMG_0854-300x225.jpg" alt="" class="wp-image-76 aligncenter" width="800" height="800" /></figure>
</div>
<h3 class="has-text-align-center has-black-color has-text-color" style="font-size: 30px;">Food = Medicine</h3>
<p class="has-text-align-center has-text-color" style="color: #333333; font-size: 18px;">Organic foods are becoming a necessity as Earth's soils and lands are destroyed. These ancient practices create a healthy balance within the soil, allowing it to be used year after year. "Let your food be your medicine and your medicine be your food". Bonus: your family won't be eating extra helpings of carcinogenic pesticides!</p>
<p> </p>
</div>
<div class="wp-block-column">
<div class="wp-block-image is-style-rounded" style="text-align: center;">
<figure class="aligncenter size-full"><img src="http://thirteenstarsbakery.com/wp-content/uploads/2021/07/IMG_0266-edited.jpeg" alt="" class="wp-image-76 aligncenter" width="800" height="800" /></figure>
</div>
<h3 class="has-text-align-center has-black-color has-text-color" style="font-size: 28px;">With Great Flour, Comes Great Responsibility</h3>
<p class="has-text-align-center has-text-color" style="color: #333333; font-size: 18px;">Knowledge is power. The more you learn, the more you can do for yourself and for those you care about. At RMK, I practice a zero waste and self-sustaining philosophy.</p>
</div>
</div>
</div>
</div>
<div style="height: 0px;" aria-hidden="true" class="wp-block-spacer"></div>
<!-- /wp:paragraph -->
Hi @divinital!
Please add the code below in the Additional CSS section within the Customizer. It should add more space between those columns and align the text from the first one with the others.
.hestia-about-content .wp-block-columns.container {
column-gap: 30px !important;
}
.wp-image-113 {
margin-bottom: 24px !important;
}
Have a nice day!
