[Usuarios Plone] Theme de Plone basado en Twitter Bootstrap

Lur Ibargutxi libargutxi at codesyntax.com
Wed Nov 21 16:17:21 UTC 2012


muchas gracias por la explicación. Algun dia me paso por Barcelona y
hablamos sobre el tema :-)

El 21 de noviembre de 2012 17:06, Ramon Navarro Bosch
<ramon.nb en gmail.com>escribió:

> El bàsico és un tema genèrico ... per ejemplo en el caso de eke.org:
>
> El "tema" diazo seria un index.html basico con la cabezera i el pie
> renderizando en la parte del contenido el #content de plone. En el css del
> diazo estarian definidos los estilos de los elementos especificos que hay
> en el site (h1, p, portletXXX, .... ) però las estructuras html serian las
> de plone dentro del content. Dicho de otra manera no importamos el css de
> Plone sino redefiminos el css bàsico en funcion del disseño.
>
> Para poder tener la web que comentais se necesitarian view.pt/z3c.jbotespecificos para cada elemento (calendario, listado, search, vistas de
> contenido, con su css especifico )
>
> Seria un hibrido, maqueta principal en diazo, estructura y semantica en
> zpt :)
>
> R
>
>
> 2012/11/21 Lur Ibargutxi <libargutxi en codesyntax.com>
>
>> Mirando un poco vuestro "PSD to Plone" veo que el básico cubre la
>> estructura general de Plone (es asi verdad?). Si por ejemplo en ese Plone
>> tenemos un noticiero saldra con el estilo por defecto de Plone verdad?
>>
>> esta web que he desarrollado tenemos varias plantillas con diferentes
>> diseños:
>> http://www.eke.org/es Portada diferente por cada idioma (mirar en y eu)
>>  http://www.eke.org/es/agenda
>>
>> http://www.eke.org/es/actores-culturales/herriak/agglomeration-cote-basque-adour/baiona
>>
>> http://www.eke.org/es/actores-culturales/herriak/agglomeration-cote-basque-adour
>>
>> http://www.eke.org/es/actores-culturales/partaideak/maiatz-en-literatur-solasaldiak
>> http://www.eke.org/es/kultura/entrevistas?category=b-01
>>
>> http://www.eke.org/es/kultura/entrevistas/jean-christian-irigoyen-galtxetaburu
>> http://www.eke.org/es/actores-culturales/partaideak/cat?set_language=es
>>
>> http://www.eke.org/es/kultura/ondarea/ahozko_ondarea/eleketa_itsas_ondarea/lekukoak?set_language=es
>> ...
>>
>> Algo asi no es viable hacerlo con Diazo verdad?
>>
>> El 21 de noviembre de 2012 13:56, Ramon Navarro Bosch <ramon.nb en gmail.com
>> > escribió:
>>
>> Como decia un compañero professor que tenia en la Universidad : Depende :)
>>>
>>> Poder hacer un site usando grok (para los views / homepage ), dexterity
>>> y con una sola maqueta bien pensada usando Diazo ahorra mucho trabajo y
>>> facilita mucho las cosas (si solo quieres tema para view). Para hacer un
>>> template diazo por tipo o entorno de edición... en mi opinion, no vale la
>>> pena.
>>>
>>> Hace un tiempo definimos un producto PSD to Plone, conseguimos un
>>> processo para hacer economico (ahorrar trabajo) para ofrecer-lo a un precio
>>> barato : http://iskra.cat/ca/que-fem/psd-to-plone
>>>
>>> Ramon
>>>
>>>
>>> 2012/11/21 Lur Ibargutxi <libargutxi en codesyntax.com>
>>>
>>>> la utilizacion de Diazo ya se como funciona y podria tirar con multitud
>>>> de ejemplos que tenemos en collective. Mi duda era si utilizar Diazo nos
>>>> ahorraria trabajo y facilitaria las cosas para nuestros diseñadores
>>>>
>>>>  El 21 de noviembre de 2012 12:49, Gus Urban <gusunavarro en gmail.com>escribió:
>>>>
>>>> Disculpen mi pregunta... pero para empezar con diazo, por aqui estaria
>>>>> bien
>>>>>
>>>>> http://docs.diazo.org/en/latest/quickstart.html
>>>>>
>>>>> gracias
>>>>> Gus
>>>>>
>>>>> El 21 de noviembre de 2012 05:55, Ramon Navarro Bosch <
>>>>> ramon.nb en gmail.com> escribió:
>>>>>
>>>>> Normalmente dejamos un sunburst para el entorno de edición con lo que
>>>>>> el view.pt és un compromiso entre verse en el plone nativo i en el
>>>>>> tema diazo. Para eso miramos de tener mucho cuidado en definir una
>>>>>> estructura muy bàsica en los view.pt ( semanticamente hablando ),
>>>>>> definir bien los identificadores css i buscar elementos comunes en las
>>>>>> distintas vistas de forma que con css se pueda solventar el 80% de los
>>>>>> renders en Diazo.
>>>>>>
>>>>>> Dicho de otra manera :
>>>>>>
>>>>>> El view.pt tiene una estructura muy bàsica (semantica
>>>>>> (sections/hX/p/span/...) y de estructura de columnas (span/rows)):
>>>>>>
>>>>>> <section id="xxx" class="row-fluid">
>>>>>> <div class="span12">
>>>>>>   <h1>YYY</h1>
>>>>>>   <p>bla bla bla</p>
>>>>>> </div>
>>>>>> </section>
>>>>>>
>>>>>> De forma que en la edicion plone lo trata bien, luego en el Diazo
>>>>>> buscamos con CSS buscamos definir tanto como se sea possible estandard en
>>>>>> toda la web quedando una pequeña parte de especificación con css selectors
>>>>>> depeniendo del tipo de objecto/seccion/...
>>>>>>
>>>>>> Lo más importante és que el proceso de diseño sea homogenio en la
>>>>>> web, si se entiende el comportamiento de Diazo, saber que trabajas con
>>>>>> bloques "estandards" la implementación puede ser muy fàcil y sin tener que
>>>>>> recurrir a centenares de ifs ( que como sabemos son muy ineficientes en
>>>>>> Diazo ). Para nuestra salud mental nos és muy importante tener claro que la
>>>>>> estructura de los bloques contenido y la semantica siempre estan en los "
>>>>>> view.pt", la brocha para el contenido en css de diazo y que el
>>>>>> index.html de diazo és el "bootstrap" del sitio, el main_template, el
>>>>>> envoltorio.
>>>>>>
>>>>>> Para el 20% restante de los renderes de Diazo vale la pena aprender
>>>>>> XSLT para hacer reglas especificas que inyecten codigo HTML donde necesites
>>>>>> ( siempre con cuidado de no passar-te ). Para eso el uso de portlets y
>>>>>> viewlets és una gran herramienta.
>>>>>>
>>>>>> Por último, creo, que si tienes un proyecto donde cada tipo necessita
>>>>>> una maqueta distinta, hay un problema en el diseño. Maquetas muy distintas
>>>>>> tienden a ser poco usables en el sin de un web. En un caso, hicimos 10
>>>>>> templates de diazo para un web por exigencia del cliente ( el diseño fue
>>>>>> externo ) y el sitio nunca vio la luz por poca usabilidad (10 diazo
>>>>>> templates son 10 maquetas globales distintas!! ). En ese caso montamos una
>>>>>> maqueta básica html i varios html que permitian generar los 10 templates de
>>>>>> forma anindada con las funciones XSLT de composicion.
>>>>>>
>>>>>> Ramon
>>>>>>
>>>>>>
>>>>>>
>>>>>> 2012/11/21 Lur Ibargutxi <libargutxi en codesyntax.com>
>>>>>>
>>>>>>> Hola Ramon!
>>>>>>>
>>>>>>> te respondo punto por punto.
>>>>>>>
>>>>>>> El 20 de noviembre de 2012 18:01, Ramon Navarro Bosch <
>>>>>>> ramon.nb en gmail.com> escribió:
>>>>>>>
>>>>>>> Hola Lur,
>>>>>>>>
>>>>>>>> Nosotros tenemos unas 3 maneras de trabajar en Diazo :
>>>>>>>>
>>>>>>>> * html/type + homepage  - linkamos el content-type con una maqueta
>>>>>>>> distinta cuando es necessario ( con un if.... ) ( o sea cada tipo requiere
>>>>>>>> una màqueta distinta a las demas ( casos muy extremos )
>>>>>>>>
>>>>>>>
>>>>>>> muchos proyectos de los que desarrollamos tienen estas
>>>>>>> caracteristicas por lo que nos obliga a hacer muchos ifs.
>>>>>>>
>>>>>>>>
>>>>>>>> * Una sola maqueta - con css adaptamos las necesidades especificas
>>>>>>>> a cada tipo ( pequeñas cosas ) y creamos una default view ( con grok el
>>>>>>>> view.pt del tipo concreto ) para poder renderizar la "ficha" del
>>>>>>>> tipo concreto
>>>>>>>>
>>>>>>>
>>>>>>> mi pregunta es, por que no se crea directamente la maqueta en la
>>>>>>> vista de grok (el view.pt) y que la diseñadora trabaje sobre eso?
>>>>>>> De este modo nos ahorrariamos el escribir el index.html y el rules.xml y
>>>>>>> solo tendriamos que crear el view.pt de grok
>>>>>>>
>>>>>>>>
>>>>>>>> * Una maqueta básica + homepage - En caso de tener una vista
>>>>>>>> inicial muy distinta al interior montamos una view con un css id especifico
>>>>>>>> de forma que creamos una maqueta diazo para la home.
>>>>>>>>
>>>>>>>
>>>>>>> Este es el caso donde veo factible Diazo (para nuestros casos).
>>>>>>> Creamos una maqueta basica y si es preciso creamos algo diferente para la
>>>>>>> home.
>>>>>>>
>>>>>>>
>>>>>>>> Ramon!
>>>>>>>>
>>>>>>>>
>>>>>>>> 2012/11/20 Lur Ibargutxi <libargutxi en codesyntax.com>
>>>>>>>>
>>>>>>>>> Es evidente que todo el mundo esta utilizando Diazo y que resulta
>>>>>>>>> mas fácil, al parecer, diseñar de esta manera. Como decía Mikel, nuestros
>>>>>>>>> dos últimos proyectos los estamos haciendo con Diazo para aprender y para
>>>>>>>>> buscar facilidades para los diseñadores.
>>>>>>>>>
>>>>>>>>> Respecto a esto, tengo una duda de cual seria la forma correcta de
>>>>>>>>> trabajar. Supongamos que tenemos un Plone con varios tipos de objetos. Por
>>>>>>>>> cada tipo de objeto es preferible crear una plantilla html y su respectivo
>>>>>>>>> rules.xml? Imaginemos que es así y creamos un html para que la diseñadora
>>>>>>>>> lo ponga bonito. Una vez hecho esto creamos la vista para ese tipo de
>>>>>>>>> objeto sacando toda la información necesaria (utilizamos el base_view de
>>>>>>>>> toda la vida?) y por ultimo creamos un rules.xml para aplicar el diseño. Es
>>>>>>>>> así como trabajais con Diazo?
>>>>>>>>>
>>>>>>>>> no se si me he explicado :-)
>>>>>>>>>
>>>>>>>>> muchas gracias
>>>>>>>>>
>>>>>>>>>
>>>>>>>>>
>>>>>>>>> El 16 de noviembre de 2012 09:01, Danilo Dellaquila <
>>>>>>>>> ddellaquila en gmail.com> escribió:
>>>>>>>>>
>>>>>>>>>  Si, efectivamente.
>>>>>>>>>>
>>>>>>>>>> Como decía, yo soy más  sistemista que programador, aunque
>>>>>>>>>> conozco algunas de las viejas "best-pratices" me resulta más sencillo con
>>>>>>>>>> Diazo.
>>>>>>>>>>
>>>>>>>>>> Danilo
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>> On 16/11/12 07:50, Mikel Larreategi wrote:
>>>>>>>>>>
>>>>>>>>>> Esta web está echa con Diazo, ¿no?
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>>  Mikel
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>> 2012/11/15 Danilo Dellaquila <ddellaquila en gmail.com>
>>>>>>>>>>
>>>>>>>>>>>  Gracias Mikel,
>>>>>>>>>>>
>>>>>>>>>>> si que se necesitaba el Bootstrap pero con las viejas
>>>>>>>>>>> "best-practices".
>>>>>>>>>>>
>>>>>>>>>>> Yo también uso el Bootstrap pero con el Diazo, ya que no son tan
>>>>>>>>>>> bueno desarrollador y la unión de los dos me permite de hacer las cosas más
>>>>>>>>>>> rápidamente.
>>>>>>>>>>>
>>>>>>>>>>> Por ejemplo lo usé, sin cambiar casi nada, para PloneThemes.org
>>>>>>>>>>> que publiqué hace poco más de un més:
>>>>>>>>>>>
>>>>>>>>>>>   http://plonethemes.org/free-themes/plonetheme.bootstrap
>>>>>>>>>>>
>>>>>>>>>>> Como ves ya he probado el  plonetheme.bootstrap y lo he subido a
>>>>>>>>>>> la web ;-)
>>>>>>>>>>>
>>>>>>>>>>> Saludos,
>>>>>>>>>>>   Danilo
>>>>>>>>>>>
>>>>>>>>>>>
>>>>>>>>>>> On 15/11/12 09:23, Mikel Larreategi wrote:
>>>>>>>>>>>
>>>>>>>>>>>  Buenas:
>>>>>>>>>>>
>>>>>>>>>>>  Ya sé que la moda y lo estándar ahora es usar Diazo para hacer
>>>>>>>>>>> theming de un Plone, pero nosotros seguimos trabajando "a la vieja usanza".
>>>>>>>>>>>
>>>>>>>>>>>  Hace unas semanas descubrí plonetheme.bootstrap que integraba
>>>>>>>>>>> la plantilla de Twitter Bootstrap [1] en Plone. He actualizado las
>>>>>>>>>>> plantillas a la última versión de Twitter Bootstrap (2.2.1) y he hecho un
>>>>>>>>>>> release del producto.
>>>>>>>>>>>
>>>>>>>>>>>  Seguro que no está integrado todo lo de Twitter Bootstrap,
>>>>>>>>>>> pero la mayoría de las cosas sí. He integrado el CSS "responsive" para que
>>>>>>>>>>> la web se vea corréctamente en dispositivos móviles y he actualizado la
>>>>>>>>>>> main_template para que funcione como la plantilla básica de Plone, con una
>>>>>>>>>>> vista que decide la anchura de las columnas (dado que Twitter Bootstrap
>>>>>>>>>>> utiliza un grid similar al de Plone).
>>>>>>>>>>>
>>>>>>>>>>>  He personalizado, del mismo modo, varias de las plantillas de
>>>>>>>>>>> Plone (logo, menú principal, breadcrumb, ...) para adaptarlas al estilo de
>>>>>>>>>>> Bootstrap.
>>>>>>>>>>>
>>>>>>>>>>>  El producto está preparado para utilizarse "as is" y también
>>>>>>>>>>> para basar themes en él (que es para lo que lo utilizaremos nosotros en
>>>>>>>>>>> CodeSyntax).
>>>>>>>>>>>
>>>>>>>>>>>  Las preguntas, dudas, críticas, solicitudes serán bienvenidas:
>>>>>>>>>>>
>>>>>>>>>>>  http://pypi.python.org/pypi/plonetheme.bootstrap
>>>>>>>>>>>
>>>>>>>>>>>  Saludos,
>>>>>>>>>>>
>>>>>>>>>>>
>>>>>>>>>>>  Mikel
>>>>>>>>>>>
>>>>>>>>>>>
>>>>>>>>>>>  [1] http://twitter.github.com/bootstrap/
>>>>>>>>>>>
>>>>>>>>>>>  --
>>>>>>>>>>> Mikel Larreategi
>>>>>>>>>>> mlarreategi en codesyntax.com
>>>>>>>>>>>
>>>>>>>>>>> CodeSyntax
>>>>>>>>>>> Azitaingo Industrialdea 3 K
>>>>>>>>>>> E-20600 Eibar
>>>>>>>>>>> Tel: (+34) 943 82 17 80
>>>>>>>>>>>
>>>>>>>>>>>
>>>>>>>>>>>   _______________________________________________
>>>>>>>>>>> Usuarios-Plone mailing listUsuarios-Plone en lists.plone.orghttps://lists.plone.org/mailman/listinfo/plone-usuarios-plone
>>>>>>>>>>>
>>>>>>>>>>>
>>>>>>>>>>> --
>>>>>>>>>>> Danilo Dellaquila
>>>>>>>>>>> Director Técnico
>>>>>>>>>>> K-Gigas Computers S.L.
>>>>>>>>>>> ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
>>>>>>>>>>> Empresa: http://www.k-gigas.es
>>>>>>>>>>> Hosting: http://www.k-gigas.com
>>>>>>>>>>> Blog:    http://danilodellaquila.com
>>>>>>>>>>>
>>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>>  --
>>>>>>>>>> Mikel Larreategi
>>>>>>>>>> mlarreategi en codesyntax.com
>>>>>>>>>>
>>>>>>>>>> CodeSyntax
>>>>>>>>>> Azitaingo Industrialdea 3 K
>>>>>>>>>> E-20600 Eibar
>>>>>>>>>> Tel: (+34) 943 82 17 80
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>> --
>>>>>>>>>> Danilo Dellaquila
>>>>>>>>>> Director Técnico
>>>>>>>>>> K-Gigas Computers S.L.
>>>>>>>>>> ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
>>>>>>>>>> Empresa: http://www.k-gigas.com
>>>>>>>>>> Plone:   http://plonethemes.org
>>>>>>>>>> Blog:    http://danilodellaquila.com
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>> _______________________________________________
>>>>>>>>>> Usuarios-Plone mailing list
>>>>>>>>>> Usuarios-Plone en lists.plone.org
>>>>>>>>>> https://lists.plone.org/mailman/listinfo/plone-usuarios-plone
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>
>>>>>>>>>
>>>>>>>>> --
>>>>>>>>> Lur Ibargutxi
>>>>>>>>> libargutxi en codesyntax.com
>>>>>>>>>
>>>>>>>>> _______________________________________________
>>>>>>>>> Usuarios-Plone mailing list
>>>>>>>>> Usuarios-Plone en lists.plone.org
>>>>>>>>> https://lists.plone.org/mailman/listinfo/plone-usuarios-plone
>>>>>>>>>
>>>>>>>>>
>>>>>>>>
>>>>>>>>
>>>>>>>> --
>>>>>>>> Ramon a.k.a bloodbare
>>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>> --
>>>>>>> Lur Ibargutxi
>>>>>>> libargutxi en codesyntax.com
>>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>> --
>>>>>> Ramon a.k.a bloodbare
>>>>>>
>>>>>> _______________________________________________
>>>>>> Usuarios-Plone mailing list
>>>>>> Usuarios-Plone en lists.plone.org
>>>>>> https://lists.plone.org/mailman/listinfo/plone-usuarios-plone
>>>>>>
>>>>>>
>>>>>
>>>>
>>>>
>>>> --
>>>> Lur Ibargutxi
>>>> libargutxi en codesyntax.com
>>>>
>>>
>>>
>>>
>>> --
>>> Ramon a.k.a bloodbare
>>>
>>
>>
>>
>> --
>> Lur Ibargutxi
>> libargutxi en codesyntax.com
>>
>
>
>
> --
> Ramon a.k.a bloodbare
>



-- 
Lur Ibargutxi
libargutxi en codesyntax.com
------------ pr?xima parte ------------
Se ha borrado un adjunto en formato HTML...
URL: <http://lists.plone.org/pipermail/plone-usuarios-plone/attachments/20121121/750c5550/attachment-0001.html>


More information about the Usuarios-Plone mailing list