Cambiar el HTML producido por los paneles: ¿es posible?

Me gusta usar paneles, sin embargo, los paneles son difíciles de diseñar debido a la gran cantidad de div que genera. Además, las clases que aplica a esos divs no tienen sentido y también son demasiado voluminosas. Causando confusión entre mis compañeros de frente.

Para mostrarle la salida que generan:

El problema es que estoy usando 960.gs y paneles agrega sus propias clases y estructura div voluminosa, por lo que tengo que anular sus clases. Esto es algo que no quiero hacer, quiero limpiar los divs. ¿Hay alguna forma de hacer esto?

Editar:

Lo que hice para limpiar algunos div que consideraba inútiles:

Comenzando desde la línea # 388 en flexible.inc (paneles / complementos / diseños / flexible)

$output = '';     
//$output = "<div class=\"panel-flexible " . $renderer->base['canvas'] . " clearfix\" $renderer->id_str>\n";
    //  $output .= "<div class=\"panel-flexible-inside " . $renderer->base['canvas'] . "-inside\">\n";

      $output .= panels_flexible_render_items($renderer, $settings['items']['canvas']['children'], $renderer->base['canvas']);

      // Wrap the whole thing up nice and snug
      //$output .= "</div>\n</div>\n";

Realmente hice una copia del diseño flexible y la edité, pero si tuviera más tiempo en este proyecto, crearía un complemento más limpio para esto.

Nota: Esta no es la mejor solución, esta fue la ruta más rápida posible para lograr mi objetivo. Crear su propio complemento pequeño es la mejor manera de hacerlo, siempre puede usar uno de los complementos existentes como base.

He investigado este problema antes. Aquí está el problema que quieres leer . Al principio parece una locura, pero en realidad hay buenas razones para que sea así.

En pocas palabras: piense en los diseños flexibles de paneles como una herramienta de creación de prototipos . Úselo para probar y redactar ideas en desarrollo, puesta en escena, pruebas de usuario, etc., luego, cuando haya firmado el diseño perfecto, impleméntelo para la producción con HTML limpio, nítido y optimizado a mano como un diseño de paneles personalizado (más en los de abajo).

Aquí hay un resumen rápido de por qué es así, basado en ese problema al que me vinculé:

• La salida HTML de los paneles necesita todo ese marcado loco para poder acomodar los diseños flexibles más locos que cualquiera pueda desear: piense en un montón de fluidos anidados y regiones fijas lado a lado.
• Nada generado automáticamente será lo suficientemente bueno para los puristas de HTML, por lo que los chicos de los paneles no han tratado de mantenerlos contentos con la función de diseños flexibles . Por lo tanto, no hay un algoritmo optimizador de HTML que intente reducir al mínimo el HTML generado por su diseño, porque no importa cuán bueno sea, aún no sería el mejor HTML estándar.
• Algo que no mencionan: si hubiera un optimizador de este tipo, ciertos cambios en el diseño causarían que los divs y clases ahora redundantes desaparecieran. Si colgó CSS ​​de estos, necesitaría volver a escribir su CSS la mayoría de las veces que realice un pequeño cambio en el diseño flexible de los paneles. Esto significa que si intentaron (y no lograron) hacer que los diseños flexibles de paneles sean una herramienta de producción con los mejores estándares, también lo habrían debilitado como herramienta de creación de prototipos.
• Puede obtener una salida HTML limpia y esbelta de paneles . El flujo de trabajo esperado, leyendo entre líneas, es que creo algo como esto:
  • Utiliza diseños flexibles de paneles durante el desarrollo inicial, mientras prueba ideas.
  • Una vez que se haya decidido por un diseño en particular, si desea limpiar HTML, lo implementará utilizando un diseño personalizado, utilizando solo la cantidad precisa de marcado HTML que ese diseño necesita con las clases, semánticas, etc. adecuadas para su sitio (cómo hacerlo a continuación )

Si bien no me gustó al principio, en la reflexión creo que tiene sentido. En lugar de tratar de hacer lo imposible y crear una herramienta que sea perfecta tanto para la creación de prototipos como para los mejores estándares en un contexto de producción, que tienen necesidades muy diferentes y solo podrían resultar en una compresión que tampoco era adecuada para ellos, Se ha ido con una herramienta que es ideal para la creación de prototipos y otra herramienta separada (diseños personalizados) que es ideal para la producción ajustada.

Esto significa que puede obtener lo mejor de ambos, a costa de un poco más de trabajo que implica su diseño final como una plantilla basada en HTML de los mejores estándares, pero un purista de HTML querrá hacer ese poco de trabajo extra de todos modos para obtener Su salida perfecta.

¿Cómo crear diseños de paneles personalizados? Hay una guía detallada en la documentación sobre cómo hacerlo . Aquí hay un resumen básico rápido:

1. Copie un diseño existente de /sites/all/modules/panels/plugins/layoutspara convertirse/sites/all/themes/[your_theme_name]/layouts/[new_unique_layout_machine_name]
2. Cambie el nombre de los archivos en la nueva copia para que coincida con su nuevo nombre de carpeta. Tenga en cuenta que el .tpl.phparchivo debe tener guiones en lugar de guiones bajos.
3. Agregue una línea al archivo de información del tema: plugins[panels][layouts] = layoutsesto le dice a los paneles que tiene diseños personalizados en este tema y dónde están (reemplace la cadena layoutssi no es la ruta desde su tema a su carpeta de diseños personalizados)

4. Edite los archivos con sus HTML y CSS perfectos, elegantes, mínimos y semánticos.

   • No olvide actualizar también el .incarchivo con información sobre su diseño como nombre, categorías, nombres de archivo, etc.
   • themeen el archivo .inc debe coincidir con el .tpl.phpnombre del archivo, sin la extensión. Cualquier guión bajo que ingrese aquí en el themevalor se convertirá en guiones.
   • También considere editar el .pngicono para reflejar mejor su diseño real.
5. Limpia el caché. Su nuevo diseño aparece como una opción en los paneles con el nombre, categoría, etc. que especificó en el .incarchivo. Úsalo.

También puede considerar el módulo Clean Markup Drupal 7 para controlar la salida de marcado para los paneles.

Busqué esta página en el navegador y no encontré ninguna mención, incluida la muy buena respuesta completa dada por el usuario568458.