Personal tools
Skip to content. | Skip to navigation
This is Plone 4’s default theme “Sunburst” reimplemented with Diazo.
Barceloneta is the name of the Plone 5 default theme. It's named after the Barcelona beach and neighbourhood. Barceloneta is a Diazo theme made from scratch using modern frontend technologies. It's responsive and spans throught all the Plone UI including the CMS backend part. It's based on Bootstrap 3, but it's not dependent of it in any way. Although it reuses some of the structure and good practices of the original Bootstrap, it has its own personality and is fully adapted to Plone. Structure Barceloneta uses LESS as a pre-processor to generate the resultant stylesheet. The LESS resources live in the plonetheme.barceloneta egg in the plonetheme/barceloneta/theme/less directory: plonetheme/barceloneta/theme/less ├── accessibility.plone.less ├── alerts.plone.less ├── barceloneta-compiled.css ├── barceloneta-compiled.css.map ├── barceloneta.css ├── barceloneta.plone.export.less ├── barceloneta.plone.less ├── barceloneta.plone.local.less ├── behaviors.plone.less ├── breadcrumbs.plone.less ├── buttons.plone.less ├── code.plone.less ├── contents.plone.less ├── controlpanels.plone.less ├── deco.plone.less ├── discussion.plone.less ├── dropzone.plone.less ├── event.plone.less ├── fonts.plone.less ├── footer.plone.less ├── forms.plone.less ├── formtabbing.plone.less ├── grid.plone.less ├── header.plone.less ├── image.plone.less ├── loginform.plone.less ├── main.plone.less ├── mixin.borderradius.plone.less ├── mixin.buttons.plone.less ├── mixin.clearfix.plone.less ├── mixin.forms.plone.less ├── mixin.grid.plone.less ├── mixin.gridframework.plone.less ├── mixin.images.plone.less ├── mixin.prefixes.plone.less ├── mixin.tabfocus.plone.less ├── modal.plone.less ├── normalize.plone.less ├── pagination.plone.less ├── pickadate.plone.less ├── plone-toolbarlogo.svg ├── portlets.plone.less ├── print.plone.less ├── roboto ├── scaffolding.plone.less ├── search.plone.less ├── sitemap.plone.less ├── sitenav.plone.less ├── sortable.plone.less ├── states.plone.less ├── tables.plone.less ├── tablesorter.plone.less ├── tags.plone.less ├── thumbs.plone.less ├── toc.plone.less ├── tooltip.plone.less ├── tree.plone.less ├── type.plone.less ├── variables.plone.less └── views.plone.less They are divided by base styling, layout, function, components and views, so they could be easily reusable and extended from other themes. The main LESS resource that imports all the others is barceloneta.plone.less. It has a set of LESS variables that can be overriden either through the web using the Theming control panel or by reusing it in your own theme. They include colors, sizes, fonts and other useful parameters. Barceloneta makes use of the new Diazo bundle to expose its resources to Plone using the Resource Registries. As it is a pure Diazo theme, it keeps a low profile being Plone agnostic and only containing the theme itself. Changes from previous versions of Plone Regarding markup and comparing to the previous versions of Plone, Barceloneta introduced lots of changes in the default Plone markup to modernize it and make it more accessible. There are few parts of rendering Plone that were not updated. However, any class or id that was stripped away from Plone was done with the purpose of making upgrades and adaptations of existing Diazo themes easy. Whenever possible additional classes and ids were introduced being always domain namespaced plone-*.
Diazo Rules may operate on content that is fetched from somewhere other than the current page being rendered by Plone, by using the href attribute to specify a path of a resource relative to the root of the Plone site: <!-- Pull in extra navigation from a browser view on the Plone site root --> <after css:theme-children="#leftnav" css:content=".navitem" href="/@@extra-nav" /> The href attribute can be used with any rule apart from <drop /> and <strip />, and can reference any URL, for example to an existing browser view configured for your site. However, it is often desirable to generate some dynamic content specifically for the purpose of constructing a particular theme. In this scenario, you can use fragments.
This package extends the standard theming middleware of Diazo to add the ability to read the location of a rules XML file from the WSGI environment. This means, amongst being able to read a rules location from the environment for the local user, that an upstream service (such as a web server, reverse proxy, caching proxy, etc) is able to control the theme the middleware is using – and change this for any given request. This contrasts with the configuration-based approach taken by Diazo’s standard middleware, which requires a fixed path to be specified for the middleware. So, this means with the right WSGI configuration, you could conceivably have one Diazo instance serving any number of themes without needing to explicitly configure paths, urlmaps or the like. If you combine this with a suitable front-facing tool (such as a configurable web server like Apache, Nginx, Cherokee, or any other), then you can have this one Diazo instance theming any number of applications, and theming differently based upon any condition your web server supports – such as incoming host name, HTTP vs HTTPS, specific URLs or regex, headers, IP addresses, and more. To achieve this, all you need to do is set the right HTTP header – which is the path to your rules file – and ensure this is sent to your middleware based upon your various conditions.
.. contents::Introduction Shows addthis_ links below the article's text... _addthis: code will be wrapped in divraptus-article-addthis for including the addthis code with diazo. If the component is activated (and addthis_active is set to True in the raptus properties (see Configuration_) the addthis buttons are shown below the text.Configuration First register at addthis_ and get the most...
Propertyshelf Vanilla Theme This installable Diazo Theme product delivers a general and mobile-ready implementation of a html5 template for Plone with activated Listing embedding tools. It is intended to deliver a library of standard features, which can be re-used in different customized variations.Platform - Plone CMS > 4.3Features - mobile-ready - configurable via Diazo Parameters -...
Features Responsive mobile first theme for Plone No Dependencies to Barceloneta No Diazo Rules No Toolbar No Portlets Plone patterns still persistent Default Bootstrap 4 for form fields and views Bootstrap 4 components and JavaScript Bootstrap icons available
This package offers a simple way to develop and deploy Plone themes using the Diazo theming engine. If you are not familiar with Diazo, check out the Diazo documentation <>_.It comes with a user guide, reproduced below, available through the theming control panel. plone.app.theming manual This guide provides an overview of Diazo theming in Plone versions 4.3 and higher... contents:: Contents...
Diazo - We Write XSLT, So You Don't Have To Diazo allows you to apply a theme contained in a static HTML web page to a dynamic website created using any server-side technology. With Diazo, you can take an HTML wireframe created by a web designer and turn it into a theme for your favourite CMS, redesign the user interface of a legacy web application without even having access to the original...