Nueva plantilla twenty twenty three

Hola Amigos!,
Estoy migrando el sitio actual (casadelamujersi.org.ar) a la nueva plantilla por defecto. El sitio anterior no estaba realizado en bloques, y estoy aprendiendo acerca de esto. El problema es que quisiera cambiar el menú actual por el logo en el medio del menú y no veo como hacerlo. Si alguno tiene algún tutorial de como hacer esto o bien documentación que me sirva para leer y aprender desde ya agradecida. La nueva versión está en casadelamujersi.org.ar/wpnuevo.
Mil gracias de antemano por la ayuda
Vicky

Hola, vos lo que buscas es que en el medio del menu aparezca el logo, o sea el logo entre los botones Sede Boulogne y Sede San Isidro?
te comento que estoy utilizando los bloques con el tema Astra, y un plugin que trae Astra para bloques que se llama Spectra y te deja hacer mas cosas, y los sitios son realmente livianos y podes trabajar con los bloques.

2 Me gusta

Hola lo voy a ver al tema que me mencionas. Sí, busco poder poner el logo en el medio del menú. Veo que tiene algunas limitaciones todavía. Mi versión anterior no estaba programada con bloques lo que lo hace muy pesado.
Muchas gracias!

Una sugerencia para que todo fluya y sobre todo en version movil, pone el logo arriba centrado y el menu como esta, y va a quedar bien, al queres jugar con el logo y el menu se te va a complicar, o vas a tener que codear a mano para acomodar las cosas.
el tema Astra tampoco te lo va a dejar hacer a eso que queres.
Lo importante es lo que queres comunicar.

Muchas gracias! @ggcoirini. Estoy recién aprendiendo lo de los bloques, por casualidad hay alguna documentación al respecto que pueda leer?

Gutemberg: DISEÑO de PORTADA con GUTENBERG - CURSO de WordPress 2021 #13 - Tutorial en Español - YouTube
Astra y Spectra: Cómo crear tu página web con Gutenberg | Tutorial Spectra - YouTube

Una pregunta para que la opción de menú elegida ej (nuestra historia) cambie de color cuando la elija que codigo tengo que usar? porque por defecto aca no la encuentro
Gracias!!!

uso este codigo y no funciona no se porque a:hover {color: red;}

Prueba con:
a:hover {color: red!important;}
y cambia el red por el color hexadecimal por las dudas.

1 me gusta

Hola Victoria, te prepare un codigo Css que centra el logo y acomoda el menu, ademas te cambiay las barras del menu hamburguesa que son por un circulo con 3 barras y la palabra menu. Los editores de bloque se basan como todo wordpress en Css te recomiendo algun tutorial de de html y css y vas a entender mucho mas como funciona el modelo de bloques o cajas.
Por otro lado me tome el atrevimiento de revisar tu anterior web y no veo que tenga un mal rendimiento del todo, por lo que veo hay cosas para optimizar pero nada grave. Lo que si da un mal rendimiento en PageSpeed pero es solo una metrica que se puede mejorar. Muchas paginas grandes dan en PageSpeed metricas horribles pero cuando las probas realmente son super rapidas.
Igualmente veo que hay varias cosas que se pueden hacer para optimizar tu web en terminos de optimizacion pero esto tambien te seguiria pasando en la web nueva.
En el proximo comentario te dejo el codigo css para que puedas copiar y pegarlo.
Cualquier duda que tengas avisame.
Saludos!!

body > div.wp-site-blocks > header > div > div{
float: none !important;
display: flex !important;
justify-content: center !important;
}

body .is-layout-constrained > .alignleft{
margin: 0px !important;
}

body > div.wp-site-blocks{padding-top: 10px !important}

body > div.wp-site-blocks > header > div > nav{margin-top: 10px !important;}

body > div.wp-site-blocks > header > div > nav > button{
background-image: url(“data:image/svg+xml,%3Csvg id=‘b05c7745-5bec-4c29-82f1-a4be454d82ba’ data-name=‘Capa 1’ xmlns=‘SVG namespace’ viewBox=‘0 0 108.8 30’%3E%3Cg id=‘b92081c7-5b66-40a1-8f78-1326aa31b682’ data-name=‘Layer 5’%3E%3Cpath d=‘M-121.3-10.3a15,15,0,0,1-15-15,15,15,0,0,1,15-15,15,15,0,0,1,15,15A15,15,0,0,1-121.3-10.3Zm0-28a13,13,0,0,0-13,13,13,13,0,0,0,13,13,13,13,0,0,0,13-13A13,13,0,0,0-121.3-38.3Z’ transform=‘translate(136.3 40.3)’/%3E%3Cpath d=‘M-116.3-24.3h-10a1.1,1.1,0,0,1-1-1,1,1,0,0,1,1-1h10a.9.9,0,0,1,1,1A1,1,0,0,1-116.3-24.3Z’ transform=‘translate(136.3 40.3)’/%3E%3Cpath d=‘M-116.3-29.3h-10a1.1,1.1,0,0,1-1-1,1,1,0,0,1,1-1h10a.9.9,0,0,1,1,1A1,1,0,0,1-116.3-29.3Z’ transform=‘translate(136.3 40.3)’/%3E%3Cpath d=‘M-116.3-19.3h-10a1.1,1.1,0,0,1-1-1,1,1,0,0,1,1-1h10a.9.9,0,0,1,1,1A1,1,0,0,1-116.3-19.3Z’ transform=‘translate(136.3 40.3)’/%3E%3C/g%3E%3Cpath d=‘M-99.6-33h3.3v1.4h-.3l-3-.4Zm0,15.7,2.6-.3h.5l2.5.3v1h-5.6ZM-97.3-33h1l.2,7.4v9.3h-1.2Zm0,0h2.2L-89-18h-.8L-84-33h1.3l-6.5,16.7h-1.2Zm11.4,15.7,3-.3h.5l3.2.3v1h-6.7Zm2.2-6.7v-9h2.2v16.7h-2.3C-83.7-18.8-83.7-21.4-83.7-24Zm1-9h3.5v1l-3.2.4h-.3Z’ transform=‘translate(136.3 40.3)’/%3E%3Cpath d=‘M-76.9-32v-1h3.5v1.4h-.3Zm3.5,14.4v1.3h-3.5v-1l3.2-.3Zm-1.1-7.7c0-2.5,0-5.1-.1-7.7h2.4c-.1,2.5-.1,5.1-.1,7.7v1c0,2.9,0,5.5.1,8h-2.4c.1-2.5.1-5.1.1-7.7Zm8-7.7,1.1,1.2h-8V-33h8.9l.2,4.4h-1.4Zm-1.3,8.8h-5.6v-1.2h5.6Zm4,3.5-.2,4.4h-9.4v-1.2h8.5L-66-16.3l.8-4.4Zm-4.8-4.4.4-2.7h1.1v5.9h-1.1l-.4-2.7Z’ transform=‘translate(136.3 40.3)’/%3E%3Cpath d=‘M-61.9-17.3l2.6-.3h.5l2.9.3v1h-6Zm1.5-14.9,1.6.6-3-.4v-1h3.7l10.4,14.3v2.6h-.8Zm.6-.8,1.2,1v15.7h-1.2Zm8.2,0h6v1l-2.5.4h-.5l-3-.4Zm2.7,0h1.2v16.9l-1.2-1.2Z’ transform=‘translate(136.3 40.3)’/%3E%3Cpath d=‘M-43.8-32v-1h7v1l-3.3.4h-.5Zm8.5,14.4c2.9,0,4.4-1.7,4.4-6.1V-33h1.2v9.9c0,5.3-2.5,7.2-5.9,7.2s-6.1-2-6.1-6.7v-2.7c0-2.5,0-5.1-.1-7.7h2.4v9.7C-39.4-19-37.8-17.6-35.3-17.6Zm1-19.4c.7-.7,1.1-.9,1.5-.9a.9.9,0,0,1,1,.8c0,.4-.4.8-1.3,1.4l-3.1,1.6-.4-.6Zm3.5,5.4-2.7-.4v-1h6v1l-2.8.4Z’ transform=‘translate(136.3 40.3)’/%3E%3C/svg%3E”);

    background-repeat:no-repeat;
    height:60px;
    width:90px;
    background-size: 80px 80px;
    background-position:center;
    margin-top: 0px !important;
}

body > div.wp-site-blocks > header > div > nav > button > svg{display: none !important;}

@media (max-width:600px){#wp–skip-link–target{margin-top: 10px !important}}