Jimmi

Finally I found it! This code is working in theme.json:

{
"styles": {
"css": " .wp-block-page-list ul { padding-left: 10px; } "
}
}

Good, thanks again for your patience ??

Thanks @bcworkz , I get the point now. The instructions for the logo and title worked perfectly.

A question: it change anything if I insert my custom css in the blocks section like this:

{
"styles": {
blocks: {
"core/site-title": {
"css": " @media (max-width: 780px) { ... } "
}
}
}
}

The switchover of the navigation icon still does not work, I think I need more time to test your solution.

Sorry for being late, I’ll pay more attention in future ??

Finally I understood that everything was caused by small mistakes in the code, that caused the theme to behave different in the 2 environments. I adjusted the code and finally the results aligned between local docker env and Hostinger.

I’m sorry to bother you for nothing.

It looks like something related to the docker environment. Once I loaded the theme on Hostinger the problem disappear, but in docker on different machines with different OS the problem replicates. It seems that the instruction ′fontSize’ has no effect when I use header.html part, either with x-large or small, but it works if I point the pattern in home.html

The code is:

home.html

<!-- wp:template-part {"slug":"header","area":"header","tagName":"header"} /-->
<!-- wp:pattern {"slug":"7girello/header"} /-->
<!-- wp:group {"tagName":"main","style":{"spacing":{"blockGap":"0","margin":{"top":"0"}}},"layout":{"type":"default"}} -->
<main class="wp-block-group" style="margin-top: 0">
?<!-- wp:pattern {"slug":"7girello/page-home-blogging"} /-->
</main>
<!-- /wp:group -->
<!-- wp:template-part {"slug":"footer","area":"footer","tagName":"footer"} /-->

header.php

<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"20px","bottom":"0px"}}},"backgroundColor":"base","layout":{"type":"constrained"}} -->
<div
?class="wp-block-group alignwide has-base-background-color has-background"
?style="padding-top: 20px; padding-bottom: 0px"
>
???<!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|20"},"layout":{"selfStretch":"fit","flexSize":null}},"layout":{"type":"flex"}} -->
???<div class="wp-block-group">
?????<!-- wp:site-logo {"width":60} /-->
?????<!-- wp:group {"style":{"spacing":{"blockGap":"0px"}}} -->
?????<div class="wp-block-group">
???????<!-- wp:site-title {"level":0,"fontSize":"x-large"} /-->
?????</div>
?????<!-- /wp:group -->
???</div>
???<!-- /wp:group -->
???<!-- wp:group {"layout":{"type":"flex","flexWrap":"wrap","justifyContent":"left"}} -->
???<div class="wp-block-group">
?????<!-- wp:navigation {"ref":4,"icon":"menu","style":{"spacing":{"margin":{"top":"0"},"blockGap":"var:preset|spacing|20"},"layout":{"selfStretch":"fit","flexSize":null}},"layout":{"type":"flex","justifyContent":"left","
orientation":"horizontal","flexWrap":"wrap"}} /-->
???</div>
???<!-- /wp:group -->
</div>
<!-- /wp:group -->
I’ll try to investigate more…

hi @iflairwebtechnologies , thanks for your suggestions.

Before changing the code I searched for block properties avaiable but I cannot find in the documentation, this is why I give a try following some example from other contexts. Do you know where I can find these details?

I give a try to the example you sent me but neither of them gave any result, positive or negative.

The first suggestion, add Custom CSS in theme.json, is exactly the same method I used, I inserted my code in style -> blocks sections, so I just replaced:

"style": {
"indent": "1px"

with:

"spacing": {
"padding": "0 1rem"

btw I believe “0 1” is a typo, I changed with 1, ans also 0 but there was not any change in the website.

The second example did not changed anything too. May you direct me to documents that I may read to understand which properties are avaiable for the blocks?

Thanks again for your patience.

I was using Twenty Twenty Four. The problem was somewhere in the Docker container, but I could not understand where.

I found this amazing tutorial and now everything works like a charm ??

Next challenge is to built my first block theme, I think you may hear soon from me…

As I supposed the problem is in China, however I managed to solve it ??

Now WordPress is running, I can navigate in the dashboard an edit the articles, but the Theme Editor does not work, it stays blank and hangs forever, and also the plugins have some problems. I installed the plugin to create block themes but does not work.

Am I missing something?

• This reply was modified 3 months, 3 weeks ago by Jimmi.
• This reply was modified 3 months, 3 weeks ago by Jimmi.
• This reply was modified 3 months, 3 weeks ago by Jimmi.

thanks @bcworkz

Searching in the Docker site I found this sample that I suppose should be also fine:

awesome-compose/official-documentation-samples/wordpress at master · docker/awesome-compose · GitHub

Unfortunately after the command: docker compose up -d the pull process holds until timeout. I live in China and I suspect that the Great Firewall has something to do with this problem, anyone has similar experience?

• This reply was modified 3 months, 3 weeks ago by Jimmi.

Thanks @dhruvkb to share it ??

I found a downside using imported (child?) themes. Apparently if I use imported template parts the option ‘Replace’ disappears from the menu of block editor. Has this something to do with the fact that the template part is an html file?

Thanks George, my bad for not exporting before ask.

Now if I transfer them they will be html file instead of stored in the DB. Is there any difference from the 2 options in terms of performance or else?

Shame on me. I did several mistakes, and the conclusion is that you were right: the reason is only the https connection.
Once I put the correct address in the WordPress address option everything went good.

Thanks again
Jimmi

WordPress address and blog address in the options are without www, nevertheless without it the applets don’t work.
SSL is working in the administration panel, except for this topic ??