paulwpxp

Try this to adjust logo image size for mobile view.

@media only screen and (max-width: 55.063em) {
	.custom-logo-link  { max-width: 250px; display: block; margin: 16px 16px -16px; }
	.site-title { font-size: 18px; margin: 0 0 0 16px; }
 }

Please note that max-width: 55.063em is the same as what theme uses, it must be. The .site-title is additional, I put it in to make font size smaller so that it don’t overpower the logo. Adjust margin, font-size as you see fit.

To get different logo for subpages (pages other than front home page), just make use of :not() to target “not home” page, and then display-none the default logo image, like this

:not(.home) .custom-logo-link img { display: none; }

then add in the image using :before CSS pseudo element to the link container, like this

:not(.home) .custom-logo-link:before {/***add in the image url as content along with width and height ***/}

Do that 2 times, one for small screen and one for big screen, using the same width (value/unit) of @media query that theme uses.

Use Group Block which is a new feature in latest WP. Just create blocks and then add them to a group block, this acts as a container that we can assign background color to it.

https://www.wpbeginner.com/news/whats-new-in-wordpress-5-3-features-and-screenshots/

You can just make use of Group Block. Create each block separately then select them and group them, then you can style these blocks having the same background.

But if you want to do it manually, it would look something like this, in HTML mode.

<div style="padding: 3em; background: yellow; ">
	<h2>Heading goes here</h2>
	<p>paragraph is here</p>
	[shortcode1]
	[shortcode2]
</div>

Since theme already output both published time and modified time but display-none the latter, in this case we can just use CSS to swap the display-none.

so use this in Child Theme’s stylesheet, or via Appearance > Customize > Additional CSS

/* for post modified */
.entry-date.published { display: none; }
.updated:not(.published) { display: inline-block; }

/* for post that never been modified, theme uses .updated */
.entry-date.published.updated { display: inline-block; }

For reference
https://themes.trac.www.ads-software.com/browser/smart-magazine/1.1.0/inc/template-tags.php#L14

To get same background for multiple block of texts, just do regular paragraph block and use <br>, it’s called soft return (line break), we can just hold shift key and hit enter. This will create a new blank line inside one paragraph, then use Block Settings to assign background color.

Hitting enter without holding shift key is called hard return, and this will create another paragraph. If you want multiple paragraphs inside one block so that it could be assigned the same color, just select all the paragraph blocks and group them. This Group Block is a new feature in latest WP. This means, it works for theme that support it.

You can also manually create that by using HTML, see example below.

<div style="padding: 3em; background: yellow;">
	<p>My 1st block of text goes here</p>
	<p>My 2nd block of text goes here</p>
	<p>My 3rd block of text goes here</p>
</div>

The site uses Elementor plugin, so Twenty Twenty theme is not responsible for this. The plugin’s markup and CSS will win over the theme’s ones.

Please ask this question in Elementor plugin’s forum.
https://www.ads-software.com/support/plugin/elementor/#new-post

I could see this (via browser’s right click > view source)

<style id="wp-custom-css">
.entry-content > p:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
max-width: 800px;
}
.home #site-content .entry-header {
padding-top: 0px;
}
@media (min-width: 800px) {
.site-logo img { max-height: 120px; }
}
</style>

and I see the logo is bigger (the CSS takes effect). So if you don’t see the logo bigger, it’s your browser’s caching (or ISP caching).

One more thing, the code is only for screen bigger than 800px, which is good, we don’t want too big in small screen because we need space for search icon and menu icon on both side. Just so you know that if you view the site using small screen device, you won’t see logo bigger.

The site has caching plugin serving static page. Be sure to delete cache and reload the page.

Additional information here, just so you know there are plugins for this

Post Grid Block
https://gutenberghub.com/blocks/post-grid-block/

The above is just one example, there are many others just look for it.

My opinion, if I were to build that post grid thing only for front page I would use Display Posts Shortcode plugin. Just create columns normally and use this plugin with post id in query parameters for each post. This way I can control what post goes into what position. There are more fancy ways of using this plugin, like using WP markup/CSS-class-id so that the lists of post appears in the same behavior as WP/Theme outputs that blocks.

Display Posts (shortcode)
https://www.ads-software.com/plugins/display-posts-shortcode/

Use this in Apperance > Customize > Additional CSS

@media (min-width: 700px) {
	.site-logo img { max-height: 120px; }
}

and after making changes, be sure to update/clear cache in case of using optimization plugin.

Try this code in Appearance > Customize > Additional CSS

@media (min-width: 600px) {
	.entry-header:first-child {
		margin-top: 6rem; 
		margin-bottom: 4rem; 
	}
}

Multilingual thing is plugin territory. You can use any theme and have this functionality via plugin.

This page has good info on this subject.
https://www.wpbeginner.com/beginners-guide/how-to-easily-create-a-multilingual-wordpress-site/

We get to use (activate) one theme at a time.

In this situation, since the Airi theme has built-in support for WooCommerce, we can just keep using Airi theme and install WooCommerce as a plugin, and that’s it.

If you like Storefront theme and want to keep using your currently in used theme too, just setup a subdomain for shop, it would look like this https://shop.example.com. Keep your main site as usual with a link to your subdomain (shop) site in the menu, keep the design (logo, color scheme) the same between 2 sites. So we have 2 websites with 2 WP installations. There are pro and con of doing this, but more of the pro in my opinion. Before doing this, make sure the hosting package support more than one site.

We can add image in using CSS pseudo elements.

First, upload the logo into your WP system and then get the url to use in this code below. Adjust width and height appropriately, but please note that this code is just for small size logo so it doesn’t have media query for small and big screen (just one set of code fits all). If you were to use big size logo, you need to write up media query for separate screen size.

.home.blog .entry-header h1:before {
	content:url("https://via.placeholder.com/150x150/fff.png");
	display: block;
	width: 150px;
	height: 150px;
	margin: 0 auto 36px;
}

Use the code in Appearance > Customize > Additional CSS

You can restore the whole theme as new via WP admin. Firstly, it should go without saying that if you have any modifications done directly to the theme currently in used, you need to do a backup first. Just temporarily change them, switch to any theme preferably any of WP default ones, then delete Flash theme from your WP system, then re-add Flash theme and then switch back to using this theme.

Another way is to log-in to your server via FTP (or File explorer of your hosting’s cPanel), then just upload a fresh copy of that file to where it belongs.