SlideShare uma empresa Scribd logo
1 de 64
Baixar para ler offline
Plone 6 Theming from
Scratch
Plone Conference Online 2020
Good morning*
*or afternoon or evening or night or whatever
Good afternoon
• Stefan Antonelli
• Works for operun
• Twitter @stefanantonelli
• GitHub at santonelli
What is this talk about?
What is this talk about?
• Theming for Plone 6 Classic UI
• Built from scratch
• No dependencies to Barceloneta
• No Diazo needed
Bootstrap
Bootstrap
• One of the most popular
• Typography, Forms, Buttons, Tables
• everything we need for Plone
Create
Create
$ mrbob -O plonetheme.munich bobtemplates.plone:addon
Some questions
--> Author's name [Stefan Antonelli]:
--> Author's email [stefan.antonelli@operun.de]:
--> Author's GitHub username: santonelli
--> Package description [An add-on for Plone]: A Theme for Plone 6
--> Do you want me to initialze a GIT repository in your new package? (y/n) [y]:
--> Plone version [5.2.1]:
--> Python version for virtualenv [python3.7]:
--> Do you want me to activate VS Code support? (y/n) [y]:
https://github.com/collective/
plonetheme.munich
Bootstrap
$ python3 -m venv .
$ ./bin/pip install -r requirements.txt
Cleanup
Cleanup
• Remove what’s not necessary
• Remove tests / constraints for 4.x and 5.x
Extend
• https://raw.githubusercontent.com/plone/buildout.coredev/6.0/versions.cfg
• https://raw.githubusercontent.com/plone/buildout.coredev/6.0/sources.cfg
• https://raw.githubusercontent.com/plone/buildout.coredev/6.0/checkouts.cfg
• https://raw.githubusercontent.com/plone/buildout.coredev/6.0/plips/plip-2967-
barceloneta-lts-source-checkouts.cfg
./bin/buildout
Start
Add theme structure
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
https://github.com/collective/
plonetheme.munich
Compile
Compile
• Compile SASS to CSS
• yarn install (dependencies from package.json)
• yarn dist to compile SASS to CSS
First startup
Is Plone broken now?
Yes! It’s Plone
Plone 6 Theming from Scratch
Good News, Everyone!
Good News, Everyone!
• Not everything is broken
• Plone core components just work!
• Patternslib, Toolbar, Portlets, Forms
Tweak
Theming is fun again
Bootstrap Variables
• Basic behaviour like rounded corners
• Fonts, Colors, Shadows
• https://github.com/twbs/bootstrap/blob/main/scss/
_variables.scss
Plone 6 Theming from Scratch
Templates
Templates
• Add z3c.jbot overrides
• Copy Templates to customize
• Add custom views for your story
Columns
Portlets must die!
Showcase
plonetheme.munich
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
plonetheme.tokyo
plonetheme.tokyo
• Everything is Bootstrap
• No Columns
• No Portlets
• Responsive (really)
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
Toolbar
What about Toolbar?
• Yes, we dropped Toolbar
• Bring editing features and navigation together
• Toolbar + Navigation is new feature called Sidebar
collective.sidebar
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
Plone 6 Theming from Scratch
collective.sidebar
• Bring toolbar and navigation together
• Drop-in replacement for Plone’s toolbar
• One template to customize
• https://github.com/collective/collective.sidebar
Plone 6 Theming from Scratch
Questions?
Thank you!
• Twitter @stefanantonelli
• GitHub at santonelli
• https://github.com/collective/plonetheme.munich
• https://github.com/collective/plonetheme.tokyo
• https://github.com/collective/collective.sidebar

Mais conteúdo relacionado

Semelhante a Plone 6 Theming from Scratch

CentOS Stream at Facebook
CentOS Stream at FacebookCentOS Stream at Facebook
CentOS Stream at FacebookDavide Cavalca
 
Welcome to the Cheese Shop: setuptools, virtualenv and PyPUG
Welcome to the Cheese Shop: setuptools, virtualenv and PyPUGWelcome to the Cheese Shop: setuptools, virtualenv and PyPUG
Welcome to the Cheese Shop: setuptools, virtualenv and PyPUGdwvisser
 
Essential Plone development tools - Plone conf 2012
Essential Plone development tools - Plone conf 2012Essential Plone development tools - Plone conf 2012
Essential Plone development tools - Plone conf 2012Kim Chee Leong
 
Tox as project descriptor.
Tox as project descriptor.Tox as project descriptor.
Tox as project descriptor.Roberto Polli
 
Building community with CentOS Stream
Building community with CentOS StreamBuilding community with CentOS Stream
Building community with CentOS StreamDavide Cavalca
 
Django Dev Environment Howto
Django Dev Environment HowtoDjango Dev Environment Howto
Django Dev Environment HowtoTzu-ping Chung
 
PyCon Taiwan 2013 Tutorial
PyCon Taiwan 2013 TutorialPyCon Taiwan 2013 Tutorial
PyCon Taiwan 2013 TutorialJustin Lin
 
PyCourse - Self driving python course
PyCourse - Self driving python coursePyCourse - Self driving python course
PyCourse - Self driving python courseEran Shlomo
 
Git 101: Git and GitHub for Beginners
Git 101: Git and GitHub for Beginners Git 101: Git and GitHub for Beginners
Git 101: Git and GitHub for Beginners HubSpot
 
Upgrading CentOS on the Facebook fleet
Upgrading CentOS on the Facebook fleetUpgrading CentOS on the Facebook fleet
Upgrading CentOS on the Facebook fleetDavide Cavalca
 
The Latest Status of CE Workgroup Shared Embedded Linux Distribution Project
 The Latest Status of CE Workgroup Shared Embedded Linux Distribution Project The Latest Status of CE Workgroup Shared Embedded Linux Distribution Project
The Latest Status of CE Workgroup Shared Embedded Linux Distribution ProjectYoshitake Kobayashi
 
Buildout: creating and deploying repeatable applications in python
Buildout: creating and deploying repeatable applications in pythonBuildout: creating and deploying repeatable applications in python
Buildout: creating and deploying repeatable applications in pythonCodeSyntax
 
Christian Strappazzon - Presentazione Python Milano - Codemotion Milano 2017
Christian Strappazzon - Presentazione Python Milano - Codemotion Milano 2017Christian Strappazzon - Presentazione Python Milano - Codemotion Milano 2017
Christian Strappazzon - Presentazione Python Milano - Codemotion Milano 2017Codemotion
 
Contributing to an os project
Contributing to an os projectContributing to an os project
Contributing to an os projectLasse Schuirmann
 
yocto_scale_handout-with-notes
yocto_scale_handout-with-notesyocto_scale_handout-with-notes
yocto_scale_handout-with-notesSteve Arnold
 
Open Source Tools for Leveling Up Operations FOSSET 2014
Open Source Tools for Leveling Up Operations FOSSET 2014Open Source Tools for Leveling Up Operations FOSSET 2014
Open Source Tools for Leveling Up Operations FOSSET 2014Mandi Walls
 
Learning Python from Data
Learning Python from DataLearning Python from Data
Learning Python from DataMosky Liu
 

Semelhante a Plone 6 Theming from Scratch (20)

CentOS Stream at Facebook
CentOS Stream at FacebookCentOS Stream at Facebook
CentOS Stream at Facebook
 
Welcome to the Cheese Shop: setuptools, virtualenv and PyPUG
Welcome to the Cheese Shop: setuptools, virtualenv and PyPUGWelcome to the Cheese Shop: setuptools, virtualenv and PyPUG
Welcome to the Cheese Shop: setuptools, virtualenv and PyPUG
 
Essential Plone development tools - Plone conf 2012
Essential Plone development tools - Plone conf 2012Essential Plone development tools - Plone conf 2012
Essential Plone development tools - Plone conf 2012
 
Tox as project descriptor.
Tox as project descriptor.Tox as project descriptor.
Tox as project descriptor.
 
Hacking on WildFly 9
Hacking on WildFly 9Hacking on WildFly 9
Hacking on WildFly 9
 
Python+gradle
Python+gradlePython+gradle
Python+gradle
 
Building community with CentOS Stream
Building community with CentOS StreamBuilding community with CentOS Stream
Building community with CentOS Stream
 
Django Dev Environment Howto
Django Dev Environment HowtoDjango Dev Environment Howto
Django Dev Environment Howto
 
PyCon Taiwan 2013 Tutorial
PyCon Taiwan 2013 TutorialPyCon Taiwan 2013 Tutorial
PyCon Taiwan 2013 Tutorial
 
PyCourse - Self driving python course
PyCourse - Self driving python coursePyCourse - Self driving python course
PyCourse - Self driving python course
 
Git 101: Git and GitHub for Beginners
Git 101: Git and GitHub for Beginners Git 101: Git and GitHub for Beginners
Git 101: Git and GitHub for Beginners
 
Upgrading CentOS on the Facebook fleet
Upgrading CentOS on the Facebook fleetUpgrading CentOS on the Facebook fleet
Upgrading CentOS on the Facebook fleet
 
The Latest Status of CE Workgroup Shared Embedded Linux Distribution Project
 The Latest Status of CE Workgroup Shared Embedded Linux Distribution Project The Latest Status of CE Workgroup Shared Embedded Linux Distribution Project
The Latest Status of CE Workgroup Shared Embedded Linux Distribution Project
 
Buildout: creating and deploying repeatable applications in python
Buildout: creating and deploying repeatable applications in pythonBuildout: creating and deploying repeatable applications in python
Buildout: creating and deploying repeatable applications in python
 
Christian Strappazzon - Presentazione Python Milano - Codemotion Milano 2017
Christian Strappazzon - Presentazione Python Milano - Codemotion Milano 2017Christian Strappazzon - Presentazione Python Milano - Codemotion Milano 2017
Christian Strappazzon - Presentazione Python Milano - Codemotion Milano 2017
 
Contributing to an os project
Contributing to an os projectContributing to an os project
Contributing to an os project
 
yocto_scale_handout-with-notes
yocto_scale_handout-with-notesyocto_scale_handout-with-notes
yocto_scale_handout-with-notes
 
CICD_1670665418.pdf
CICD_1670665418.pdfCICD_1670665418.pdf
CICD_1670665418.pdf
 
Open Source Tools for Leveling Up Operations FOSSET 2014
Open Source Tools for Leveling Up Operations FOSSET 2014Open Source Tools for Leveling Up Operations FOSSET 2014
Open Source Tools for Leveling Up Operations FOSSET 2014
 
Learning Python from Data
Learning Python from DataLearning Python from Data
Learning Python from Data
 

Último

Communication Accommodation Theory Kaylyn Benton.pptx
Communication Accommodation Theory Kaylyn Benton.pptxCommunication Accommodation Theory Kaylyn Benton.pptx
Communication Accommodation Theory Kaylyn Benton.pptxkb31670
 
ISO 25964-1Working Group ISO/TC 46/SC 9/WG 8
ISO 25964-1Working Group ISO/TC 46/SC 9/WG 8ISO 25964-1Working Group ISO/TC 46/SC 9/WG 8
ISO 25964-1Working Group ISO/TC 46/SC 9/WG 8Access Innovations, Inc.
 
The Real Story Of Project Manager/Scrum Master From Where It Came?!
The Real Story Of Project Manager/Scrum Master From Where It Came?!The Real Story Of Project Manager/Scrum Master From Where It Came?!
The Real Story Of Project Manager/Scrum Master From Where It Came?!Loay Mohamed Ibrahim Aly
 
MARINE DIESEL ENGINES & Engine in DSV.pptx
MARINE DIESEL ENGINES & Engine in DSV.pptxMARINE DIESEL ENGINES & Engine in DSV.pptx
MARINE DIESEL ENGINES & Engine in DSV.pptxSarath40652
 
Communication Accommodation Theory Kaylyn Benton.pptx
Communication Accommodation Theory Kaylyn Benton.pptxCommunication Accommodation Theory Kaylyn Benton.pptx
Communication Accommodation Theory Kaylyn Benton.pptxkb31670
 
Dynamics of Professional Presentationpdf
Dynamics of Professional PresentationpdfDynamics of Professional Presentationpdf
Dynamics of Professional Presentationpdfravleel42
 

Último (6)

Communication Accommodation Theory Kaylyn Benton.pptx
Communication Accommodation Theory Kaylyn Benton.pptxCommunication Accommodation Theory Kaylyn Benton.pptx
Communication Accommodation Theory Kaylyn Benton.pptx
 
ISO 25964-1Working Group ISO/TC 46/SC 9/WG 8
ISO 25964-1Working Group ISO/TC 46/SC 9/WG 8ISO 25964-1Working Group ISO/TC 46/SC 9/WG 8
ISO 25964-1Working Group ISO/TC 46/SC 9/WG 8
 
The Real Story Of Project Manager/Scrum Master From Where It Came?!
The Real Story Of Project Manager/Scrum Master From Where It Came?!The Real Story Of Project Manager/Scrum Master From Where It Came?!
The Real Story Of Project Manager/Scrum Master From Where It Came?!
 
MARINE DIESEL ENGINES & Engine in DSV.pptx
MARINE DIESEL ENGINES & Engine in DSV.pptxMARINE DIESEL ENGINES & Engine in DSV.pptx
MARINE DIESEL ENGINES & Engine in DSV.pptx
 
Communication Accommodation Theory Kaylyn Benton.pptx
Communication Accommodation Theory Kaylyn Benton.pptxCommunication Accommodation Theory Kaylyn Benton.pptx
Communication Accommodation Theory Kaylyn Benton.pptx
 
Dynamics of Professional Presentationpdf
Dynamics of Professional PresentationpdfDynamics of Professional Presentationpdf
Dynamics of Professional Presentationpdf
 

Plone 6 Theming from Scratch