It’s been a while since I last wrote on how to create a Plone site for my film festival, the Roze Filmdagen, and the Internet has moved on.
So, in today’s responsive times, this is what I did, given the obvious limitations of
- zero budget
- limited time
- lots of content
Of course I started out with Plone, and then added some stuff using add-ons. The ones that are my best-loved friends are:
collective.cover, for easy composite pages. Lovely, works out of the box.
sc.social.like because, well, social media.
eea.facetednavigation to create a way people can quickly sort through the programme and find their favorite genre.
redturtle.imagedevent as the basic ‘screening’ event.
ftw.sliderto make nice sliders. It’s the cleanest, least intrusive one in my book.
And then a bunch of behind-the-scenes things to make it nicer to work with, like wildcard.foldercontents and quintagroup.dropdownmenu. Oh, and collective.ptg.contentflow for an awesome ‘pictorial history' effect.
So, how to do the pretty-making bits?
Well, a bit of lending and grabbing here and there. You can find most of it in the theme package. One of the key things to get right was reconciling collective.cover with the bits of bootstrap I was using (not the whole, but a custom small subset of bootstrap). Luckily, there is this gist with the correct Diazo rules
Then, you want icons. So fontawesome to the rescue. And some googlefonts to spice it up.
The Good, The Bad and the Ugly
So, what’s the experience in total for someone like me, who is not particularly skilled in the art of css?
Overall: good. The site is clean, was filled up with all content rapidly, and gets positive feedback from the users. Things like Diazo make it super easy to do little things like move the sc.social.like buttons from the top to the bottom, without harming viewletmanagers.
Bad: I know I shouldn’t, but some things are just easier to do using the ZMI. Yes, I use portal-viewlet-customizations and the ‘custom’ folder to insert little things like <i fancyschmansy-icon-class></i>. So sue me.
Really ugly: the handling of dates still is a mess. Setting a date format is insanely frustrating: one place for archetypes, one for dexterity, and neither works completely, or without idiotic assumptions that my time format should match my language code. No, it doesn’t and no it shouldn’t.
And somehow, somewhere, somebody thought it was a great idea to embellish every date/time with an annoying little link that shows the time in GMT format. Just so that every screenreader user out there is told: not only do you have a visual impairment, we will go out of our way to break the flow of navigation for you because you probably don’t know which time zone you’re in… Because we’re engineers, and want to be pedantic. Or so.
Which leads to painful constructs like
<span tal:replace=”python:toLocalizedTime(context.start())”>
Start Date Time</span><br />
<span metal:define-macro=”startdatesame-field-view”
tal:define=”kss_class python:getKssClasses(‘startDate’,
templateId=templateId, macro=’startdatesame-field-view’);”
id=”parent-fieldname-startDate”
tal:attributes=”class string:$kss_class dtstart;
title python:context.start().ISO8601()”
>
<span tal:replace=”python:toLocalizedTime(context.start(), time_only=1)”>Start Time</span>
</span><br />
Really?
Gotchas
One skeleton in the closet: run Google Webmaster tools on your site, and you will find that it gets very sad, and more than a little upset, about all those semi-automated links to “image_view_fullscreen”. Even if you’re not actually using them, because you catch them with a nice lightboxy one. But the googlebot still sees them. And complains (very rightly so!) about a complete lack of Viewport declarations or any sign that the web has moved on since 1992.
This needs fixing, since it will affect your site ranking for mobile users.
Oh, and one other thing. Really, having just a single favicon.ico is soooo 2011. What you normally do is get a 256 size PNG, and run imagemagick on it. Or, for the command-line-challenged, use a web service. But really, we have all the tools already in Plone. This is something the system should handle itself, as a nice gesture. Because we can.
But hey, let’s end positive: site delivered, at no cost, and quite well usable on tablets and phones. Hurray for Plone! Now all I need to do is find the right outfit for the Opening Night…