Por defecto el tema Divi para WordPress no permite colocar tu logotipo para que flote entre dos secciones, pero con estos pasos lo harás de manera muy sencilla.

1. Lo primero que tienes que hacer es crear una nueva sección para colocar en ella la imagen flotante. Elige entonces añadir Sección estándar o Sección de anchura completa.

2. En el menú de ajustes de la sección creada añade la clase CSS: espacio-seccion-logo

3. Asegúrate de cambiar el relleno personalizado de la sección y la fila con los valores siguientes: Superior 0 y Base 0 y guarda los cambios.

4. Después de grabar los cambios, inserta una nuevo Módulo de texto.

5. Añade en el módulo tu logotipo o imagen (preferentemente en formato png para que tenga fondo transparente) y cambia la Orientación del texto a Centro. No te preocupes si tu imagen es más grande de lo deseado. Con unos cambios en el archivo CSS lo tendrás solucionado.

6. Todavía en el módulo de texto añade en la pestaña CSS personalizado el Identificador CSS: logo-entremedio y guarda cambios.

7. Copia la sección y pégala donde quieras clonar el mismo efecto pero con la imagen un poco más pequeña.

8. Cambiar el identificador CSS: logo-espacio de la sección recién clonada en la misma pestaña de CSS personalizado. Guarda cambios y mueve la sección o secciones donde quieras que floten.

El efecto que se pretende conseguir es que la primera sección original se sitúe bajo la cabecera y las clonadas entre medio de secciones. Vigila que los fondos de las nuevas secciones tengan el mismo color o imagen de fondo para que el efecto sea perfecto.

9. Ya sólo queda el último paso mágico. Copia y pega el siguiente código CSS en el apartado CSS personalizado de las Opciones del tema de tu plantilla Divi.

/*------------------------------------------------*/
/*-------[Imagen flotante entre secciones]-------*/
/*------------------------------------------------*/
 
/* quitamos todos los padding de sección */
    .espacio-seccion-logo { padding:0px; margin:0 0 -40px 0;}
    .espacio-seccion-logo .et_pb_row, .espacio-logo .et_pb_section  { padding: 0px;}
 
/* logo bajo la cabecera */
    #logo-entremedio {padding: 0px; margin: 0px;}
    #logo-entremedio img {margin-top:-105px; width: 150px; z-index: 1; position: relative;}
 
/* logo bajo secciones estandar */
    #logo-espacio {padding: 0px; margin: 0px;}
    #logo-espacio img {margin-top: -55px; width: 100px; z-index: 1; position: relative;}

Si la imagen la quieres desplazar un poco más arriba o abajo, simplemente cambia los valores de margin-top de los dos identificadores. Valores más negativos desplazará la imagen para arriba y valores más positivos lo hará hacia abajo.

¿Lo has logrado? ¡Bien!

Sino es así te regalo la plantilla ejemplo para que la puedas importar a tus diseños. Sólo requiere una simple acción social.