I’m working on a WordPress site and I’m having trouble adjusting the size of images and text on my pages. Right now, the images appear too small, and there’s a lot of unused space around them. I’d like to make the gallery section wider so that the images and text have more room to breathe.
I’m using a block-based editor, and the gallery is wrapped inside a .wp-block-group.alignfull container. Additionally, I have a MetaSlider, which is also affected by the layout limitations. However, in editor everything appears to be bigger.
Here’s the code I’m using on this page:
<!-- wp:group {"align":"full","className":"hostinger-ai-gallery-1 hostinger-ai-fade-up","layout":{"type":"default"}} -->
<div class="wp-block-group alignfull hostinger-ai-gallery-1 hostinger-ai-fade-up"><!-- wp:group {"align":"full","className":"hostinger-ai-fade-up","style":{"spacing":{"padding":{"top":"var:preset|spacing|60","bottom":"var:preset|spacing|60"}}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group alignfull hostinger-ai-fade-up" style="padding-top:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--60)"><!-- wp:heading {"textAlign":"center","className":"hostinger-ai-title","style":{"spacing":{"margin":{"top":"0","bottom":"var:preset|spacing|20","left":"0","right":"0"}},"elements":{"link":{"color":{"text":"var:preset|color|light"}}}},"textColor":"light","fontSize":"x-large"} -->
<h2 class="wp-block-heading has-text-align-center hostinger-ai-title has-light-color has-text-color has-link-color has-x-large-font-size" style="margin-top:0;margin-right:0;margin-bottom:var(--wp--preset--spacing--20);margin-left:0">Galeria Fotografii</h2>
<!-- /wp:heading -->
<!-- wp:paragraph {"align":"center","className":"hostinger-ai-description","style":{"spacing":{"margin":{"top":"0","bottom":"0"}},"elements":{"link":{"color":{"text":"var:preset|color|light"}}}},"textColor":"light","fontSize":"medium"} -->
<p class="has-text-align-center hostinger-ai-description has-light-color has-text-color has-link-color has-medium-font-size" style="margin-top:0;margin-bottom:0">Odkryj nasze wyj?tkowe obrazy i produkty fotograficzne w minimalistycznym stylu.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->
<!-- wp:metaslider/slider {"slideshowId":732} -->
<div class="alignnormal">[metaslider id="732"]</div>
<!-- /wp:metaslider/slider -->
<!-- wp:group {"className":"hostinger-ai-fade-up","layout":{"type":"constrained"}} -->
<div class="wp-block-group hostinger-ai-fade-up"><!-- wp:group {"align":"full","className":"alignwide hostinger-ai-fade-up","layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull alignwide hostinger-ai-fade-up"><!-- wp:image {"id":503,"sizeSlug":"full","linkDestination":"none","className":"hostinger-ai-image hostinger-index-2","style":{"border":{"radius":"8px"}}} -->
<figure class="wp-block-image size-full has-custom-border hostinger-ai-image hostinger-index-2"><img src="https://images.unsplash.com/photo-1647884440187-574c6c77c7e7?q=85&w=800&h=400&fit=crop" alt="" class="wp-image-503" style="border-radius:8px"/></figure>
<!-- /wp:image -->
<!-- wp:image {"id":504,"sizeSlug":"full","linkDestination":"none","className":"hostinger-ai-image hostinger-index-3","style":{"border":{"radius":"8px"}}} -->
<figure class="wp-block-image size-full has-custom-border hostinger-ai-image hostinger-index-3"><img src="https://images.unsplash.com/photo-1609814634675-51ff11599922?q=85&w=300&h=400&fit=crop" alt="" class="wp-image-504" style="border-radius:8px"/></figure>
<!-- /wp:image --></div>
<!-- /wp:group -->
<!-- wp:group {"align":"full","className":"alignwide hostinger-ai-fade-up","style":{"spacing":{"margin":{"bottom":"var:preset|spacing|20"}}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"center"}} -->
<div class="wp-block-group alignfull alignwide hostinger-ai-fade-up" style="margin-bottom:var(--wp--preset--spacing--20)"><!-- wp:image {"id":504,"sizeSlug":"full","linkDestination":"none","className":"hostinger-ai-image","style":{"border":{"radius":"8px"}}} -->
<figure class="wp-block-image size-full has-custom-border hostinger-ai-image"><img src="https://images.unsplash.com/photo-1593421986221-661584df8820?q=85&w=300&h=400&fit=crop" alt="" class="wp-image-504" style="border-radius:8px"/></figure>
<!-- /wp:image -->
<!-- wp:image {"id":503,"sizeSlug":"full","linkDestination":"none","className":"hostinger-ai-image hostinger-index-1","style":{"border":{"radius":"8px"}}} -->
<figure class="wp-block-image size-full has-custom-border hostinger-ai-image hostinger-index-1"><img src="https://images.unsplash.com/photo-1692726502700-1f98e3bbe784?q=85&w=800&h=400&fit=crop" alt="" class="wp-image-503" style="border-radius:8px"/></figure>
<!-- /wp:image --></div>
<!-- /wp:group --></div>
<!-- /wp:group --></div>
<!-- /wp:group -->
<!-- wp:group {"align":"full","className":"hostinger-ai-resume-1 hostinger-ai-fade-up","layout":{"type":"constrained"}} -->
<div class="wp-block-group alignfull hostinger-ai-resume-1 hostinger-ai-fade-up"><!-- wp:group {"align":"wide","className":"hostinger-ai-fade-up","style":{"spacing":{"padding":{"top":"var:preset|spacing|60","bottom":"var:preset|spacing|60"}}},"layout":{"type":"grid","columnCount":2,"minimumColumnWidth":null}} -->
<div class="wp-block-group alignwide hostinger-ai-fade-up" style="padding-top:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--60)"><!-- wp:group {"className":"hostinger-ai-fade-up","layout":{"type":"constrained"}} -->
<div class="wp-block-group hostinger-ai-fade-up"><!-- wp:image {"id":18,"sizeSlug":"full","linkDestination":"none","className":"hostinger-ai-image","style":{"border":{"radius":"8px"}}} -->
<figure class="wp-block-image size-full has-custom-border hostinger-ai-image"><img src="https://images.unsplash.com/photo-1601490702107-f101b2eaaf87?q=85&w=584&h=650&fit=crop" alt="" class="wp-image-18" style="border-radius:8px"/></figure>
<!-- /wp:image --></div>
<!-- /wp:group -->
<!-- wp:group {"className":"hostinger-ai-fade-up","style":{"spacing":{"blockGap":"0px","padding":{"right":"var:preset|spacing|60","left":"var:preset|spacing|60"}},"layout":{"columnSpan":1,"rowSpan":1}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"left","flexWrap":"nowrap","verticalAlignment":"center"}} -->
<div class="wp-block-group hostinger-ai-fade-up" style="padding-right:var(--wp--preset--spacing--60);padding-left:var(--wp--preset--spacing--60)"><!-- wp:heading {"className":"hostinger-ai-title","style":{"elements":{"link":{"color":{"text":"var:preset|color|dark"}}},"spacing":{"margin":{"bottom":"var:preset|spacing|20"}}},"textColor":"dark","fontSize":"x-large"} -->
<h2 class="wp-block-heading hostinger-ai-title has-dark-color has-text-color has-link-color has-x-large-font-size" style="margin-bottom:var(--wp--preset--spacing--20)">Moje zdj?cia</h2>
<!-- /wp:heading -->
<!-- wp:paragraph {"className":"hostinger-ai-description","style":{"spacing":{"margin":{"top":"0","bottom":"var:preset|spacing|70"}},"elements":{"link":{"color":{"text":"var:preset|color|dark"}}}},"textColor":"dark","fontSize":"medium"} -->
<p class="hostinger-ai-description has-dark-color has-text-color has-link-color has-medium-font-size" style="margin-top:0;margin-bottom:var(--wp--preset--spacing--70)">Oferuj? szeroki wybór produktów fotograficznych, w tym obrazy, kalendarze oraz kursy online, które odzwierciedlaj? moj? pasj? do fotografii krajobrazowej.</p>
<!-- /wp:paragraph -->
<!-- wp:heading {"className":"hostinger-ai-title hostinger-index-1","style":{"spacing":{"margin":{"bottom":"var:preset|spacing|30"}}},"fontSize":"x-large"} -->
<h2 class="wp-block-heading hostinger-ai-title hostinger-index-1 has-x-large-font-size" style="margin-bottom:var(--wp--preset--spacing--30)">Portfolio</h2>
<!-- /wp:heading -->
<!-- wp:paragraph {"className":"hostinger-ai-subtitle hostinger-index-1 hostinger-ai-font-bold"} -->
<p class="hostinger-ai-subtitle hostinger-index-1 hostinger-ai-font-bold">Zobacz moje prace</p>
<!-- /wp:paragraph -->
<!-- wp:paragraph {"className":"hostinger-ai-description hostinger-index-1","style":{"spacing":{"margin":{"bottom":"var:preset|spacing|50"}}}} -->
<p class="hostinger-ai-description hostinger-index-1" style="margin-bottom:var(--wp--preset--spacing--50)">Przegl?daj moje najlepsze zdj?cia i projekty, które pokazuj? moj? wizj?.</p>
<!-- /wp:paragraph -->
<!-- wp:paragraph {"className":"hostinger-ai-subtitle hostinger-index-2 hostinger-ai-font-bold"} -->
<p class="hostinger-ai-subtitle hostinger-index-2 hostinger-ai-font-bold">Us?ugi</p>
<!-- /wp:paragraph -->
<!-- wp:paragraph {"className":"hostinger-ai-subtitle hostinger-index-2"} -->
<p class="hostinger-ai-subtitle hostinger-index-2">Us?ugi</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:group --></div>
<!-- /wp:group -->
<!-- wp:group {"align":"full","className":"hostinger-ai-customer-reviews-2 hostinger-ai-fade-up","style":{"spacing":{"padding":{"top":"var:preset|spacing|60","bottom":"var:preset|spacing|60"}}},"backgroundColor":"color2","layout":{"type":"constrained"}} -->
<div class="wp-block-group alignfull hostinger-ai-customer-reviews-2 hostinger-ai-fade-up has-color-2-background-color has-background" style="padding-top:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--60)"><!-- wp:columns {"className":"alignfull"} -->
<div class="wp-block-columns is-not-stacked-on-mobile alignfull"><!-- wp:column -->
<div class="wp-block-column"><!-- wp:image {"id":715,"width":"412px","height":"auto","sizeSlug":"full","linkDestination":"none","align":"center","className":"hostinger-ai-testimonial-image hostinger-index-2","style":{"border":{"radius":"8px"}}} -->
<figure class="wp-block-image aligncenter size-full is-resized has-custom-border hostinger-ai-testimonial-image hostinger-index-2"><img src="https://images.unsplash.com/photo-1640738960969-c50af172f4a1?q=85&w=400&h=450&fit=crop" alt="" class="wp-image-715" style="border-radius:8px;width:412px;height:auto"/></figure>
<!-- /wp:image --></div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"center"} -->
<div class="wp-block-column is-vertically-aligned-center"><!-- wp:group {"className":"hostinger-ai-fade-up","style":{"spacing":{"blockGap":"0px","padding":{"right":"0","left":"0"}},"layout":{"columnSpan":1,"rowSpan":1}},"layout":{"type":"flex","orientation":"vertical","justifyContent":"left","flexWrap":"nowrap","verticalAlignment":"center"}} -->
<div class="wp-block-group hostinger-ai-fade-up" style="padding-right:0;padding-left:0"><!-- wp:paragraph {"className":"hostinger-ai-subtitle","style":{"spacing":{"margin":{"top":"0","bottom":"var:preset|spacing|20"}},"elements":{"link":{"color":{"text":"var:preset|color|light"}}}},"textColor":"light","fontSize":"medium"} -->
<p class="hostinger-ai-subtitle has-light-color has-text-color has-link-color has-medium-font-size" style="margin-top:0;margin-bottom:var(--wp--preset--spacing--20)">Opinie klientów</p>
<!-- /wp:paragraph -->
<!-- wp:paragraph {"className":"hostinger-ai-testimonial-text hostinger-ai-font-bold hostinger-index-2","style":{"spacing":{"margin":{"top":"0","bottom":"var:preset|spacing|50"}},"elements":{"link":{"color":{"text":"var:preset|color|light"}}},"typography":{"fontSize":"21px"}},"textColor":"light"} -->
<p class="hostinger-ai-testimonial-text hostinger-ai-font-bold hostinger-index-2 has-light-color has-text-color has-link-color" style="margin-top:0;margin-bottom:var(--wp--preset--spacing--50);font-size:21px">”Korzysta?em z us?ug Adam Gieraltowski Photography i jestem zachwycony jako?ci? zdj?? oraz profesjonalizmem. Zdecydowanie polecam ka?demu, kto szuka wyj?tkowych produktów.”</p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->I’ve tried modifying CSS, such as increasing max-width and adjusting display: flex, but the changes don’t seem to have the desired effect. Any suggestions on how I can expand the available space for the gallery and improve image scaling?
Thanks in advance for your help!
]]>I have WordPress running in php-nginx containers on AWS ECS and sitting behind a Load Balancer. When I try to register a new webhook it is submitting to port 8080. which is the port that the container is running on rather than the standard HTTPS port.
Is there a work around for this?
]]>I’m having issues on this particular web page where the text overflows the main body of the page on mobile, and I’m unable to fix it with CSS.
Any help would be appreciated.
Cheers 
I’ve just installed the theme and need help with a few things.
Inconsistent capitalization in site header and menu
I’ve noticed that the typography formatting for the site header changes from page to page, and I’m not sure why. When I go to my home page, the site name is in block capitals. But when I go to other pages, like the About Me page, the site name is in title case (a mix of upper and lower case). How do I ensure the capitalization is consistent?
Likewise, when I try to customize my site, the menu appears in title case, but when I visit the live site, the menu is in block capitals. How do I keep it as title case all the time?
Odd container size on About Me page
When I go to my home page or a regular blog post, the size of the main post container and the side bar widgets are normal. But on the About Me page, the post container and the widgets are both much smaller, so there’s a lot of empty space on the left side of the page. How do I fix this?
Odd grey banner on Archives page
On my Archives page, the page title shows up in a weird grey banner block at the top of the page. None of the other pages or posts on my site have this banner. How do I remove it?
Social media icons
I’d like to add links to BlueSky, Mastodon and RSS in my menu. However, the social icons list for the menu doesn’t include these options. Can they be added in?
]]>I’m using the Astra WordPress theme and using Elementor to build my website. I’ve encountered an issue where the height and width of my Elementor container won’t stretch to the full height and length of the page on certain pages of my site.
I think this may be due to a restriction within the starter template I originally used, as when I’ve selected a new starter template it came with this functionality to stretch to the full height/width as can be seen from my homepage https://novellusproperties.co.uk/
I’m trying to replicate this on my other existing pages, an example where the Elementor container won’t stretch to the full length/width (it will only start at the end of the header rather than go over the header) can be seen on this page https://novellusproperties.co.uk/property-management/
Please help! Thank you
]]>I’m using the Astra WordPress theme and using Elementor to build my website. I’ve encountered an issue where the height and width of my Elementor container won’t stretch to the full height and length of the page on certain pages of my site.
I think this may be due to a restriction within the starter template I originally used, as when I’ve selected a new starter template it came with this functionality to stretch to the full height/width as can be seen from my homepage https://novellusproperties.co.uk/
I’m trying to replicate this on my other existing pages, an example where the Elementor container won’t stretch to the full length/width (it will only start at the end of the header rather than go over the header) can be seen on this page https://novellusproperties.co.uk/property-management/
Please help! Thank you
]]>