Twentig

Hi,

To remove the underline on active menu links for Twenty twenty, you can add some custom CSS (Customizer > Additional CSS):

.primary-menu li.current-menu-item > a {
    text-decoration: none;
}
 
.primary-menu li.current-menu-item > a:hover {
    text-decoration: underline;
}

I hope the above is useful to you.
Tom

Hi,

On the Cover block, you’ve selected “Repeated background”. You should turn it off to be able to use the Focal point picker and focus the image on the doctor’s head. If you want to add padding on desktop and remove it on small devices, you can add some custom CSS. To do so:

1. Select the Cover block.
2. Open the sidebar settings and under Additional CSS Class(es), add a new class e.g. mobile-no-padding
3. Then open the Customizer, and inside Additional CSS, paste the following code (adjust the values as you like).

@media (max-width: 651px) {
	.wp-block-cover.mobile-no-padding {
		padding: 0 !important;
	}
}

I hope the above is useful to you.
Tom

Hi,

The navigation phrases are included in the Twenty Twenty-One theme and use the translations from https://translate.wordpress.org/projects/wp-themes/twentytwentyone/, this isn’t related to Twentig. If your language is translated, you need to install the language pack.

I hope the above is useful to you.
Tom

Here’s the code (modified with Media & Text to fit your needs):

<!-- wp:group {"align":"full","style":{"color":{"background":"#e3f2fd"},"spacing":{"padding":{"bottom":"40px"}}}} -->
<div class="wp-block-group alignfull has-background" style="background-color:#e3f2fd;padding-bottom:40px"><div class="wp-block-group__inner-container"><!-- wp:media-text -->
<div class="wp-block-media-text alignwide is-stacked-on-mobile"><figure class="wp-block-media-text__media"></figure><div class="wp-block-media-text__content"><!-- wp:paragraph {"fontSize":"large"} -->
<p class="has-large-font-size">Content</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:media-text --></div></div>
<!-- /wp:group -->

<!-- wp:group {"align":"full","style":{"color":{"gradient":"linear-gradient(0deg,rgb(255,255,255) 0%,rgb(255,255,255) 50%,rgb(227,242,253) 50%,rgb(227,242,253) 100%)"},"spacing":{"padding":{"top":"0px","bottom":"0px"}}}} -->
<div class="wp-block-group alignfull has-background" style="background:linear-gradient(0deg,rgb(255,255,255) 0%,rgb(255,255,255) 50%,rgb(227,242,253) 50%,rgb(227,242,253) 100%);padding-top:0px;padding-bottom:0px"><div class="wp-block-group__inner-container"><!-- wp:columns {"align":"wide"} -->
<div class="wp-block-columns alignwide"><!-- wp:column -->
<div class="wp-block-column"><!-- wp:image {"width":220,"height":172} -->
<figure class="wp-block-image is-resized"><img src="https://demo.twentig.com/orlando/wp-content/uploads/sites/12/2021/03/home-10.png" alt="" width="220" height="172"/></figure>
<!-- /wp:image --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div></div>
<!-- /wp:group -->

<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"40px"}}},"backgroundColor":"white"} -->
<div class="wp-block-group alignfull has-white-background-color has-background" style="padding-top:40px"><div class="wp-block-group__inner-container"><!-- wp:media-text {"mediaPosition":"right"} -->
<div class="wp-block-media-text alignwide has-media-on-the-right is-stacked-on-mobile"><figure class="wp-block-media-text__media"></figure><div class="wp-block-media-text__content"><!-- wp:paragraph {"fontSize":"large"} -->
<p class="has-large-font-size">Content</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:media-text --></div></div>
<!-- /wp:group -->

If you enjoy Twentig, please rate it. It would really help me out 🙂
Tom

Hi,

Twentig uses the dimensions of the uploaded logo to calculate some values for layout purpose. Can you please tell me which method (plugin, custom code…) you’re using to upload an svg file so I can try to replicate the issue on my side?

Thanks,
Tom

Hi,

On your page, I saw that you’ve set a custom padding of 300px for the Cover block. Padding is a WordPress core feature and, unfortunately, isn’t currently responsive.
You can make it responsive by adding some custom CSS. If you need help with the CSS, I would need to see the page (the URL you gave is now not found).

Have a nice day,
Tom

Hi,

Thanks for your message, glad you like our plugin.

Unfortunately, I don’t see how to achieve this kind of layout using the core blocks, even with some custom CSS.

On this demo https://demo.twentig.com/orlando/ at the bottom of the page, we’ve managed to create an overlapping effect using a gradient, but the overlap is between 2 groups ( on your mockup, the overlap is between 2 Media & Text blocks). This is a bit similar to your layout. If you are interested, I can give you the code used on the demo.

Tom

This CSS should do the trick:

.single-post .entry-content {
	margin-top: 0;
}