Forum
A few sites I've created with Perch
I've use Perch on all my web builds since I've been a freelancer. I've got quite a list forming now, below are a few I've done over the past 9 months. They all use a range of 'levels' of Perch integration which goes to show how flexible the system is.
One Bespoke London - https://onebespokelondon.co.uk/
A one page site for a luxury tailoring brand in London. Perch is just used for the form and editing blocks of text content. A great example of Perch complimenting a static site to allow the client some content control without a huge overhead.
World Wide Pictures - https://www.worldwidepictures.tv
A video and digital media company. Perch allows them to update all the content, especially new Case studies and News (using Blog App) regularly themselves. The Case Studies are set up using list and details pages as documented here: https://solutions.grabaperch.com/architecture/how-do-i-create-list-detail-pages They can feature 6 case studies on the homepage which uses a checkbox Perch if option. Feedback I've received from them recently is how easy they are finding using Perch compared to their previous system. They are very pleased with it.
Royal Docks CrossFit - https://royaldockscrossfit.com
A CrossFit Gym in London. All page contents content can be edited. Uses Blog and Form App. Plus Google Map and YouTube Fieldtypes.
Man with a Van - https://manwithavan.co.uk/
One of the more in-depth Perch builds I've done as the client manages the majority of the site themselves so needed quite a bit of control. Master Pages are set up for all the different types of pages, and I've used a lot of Perch If statements to give the client options on how/what content gets displayed. A week after it went live enquiries had doubled.
Design and Quality - https://www.designandquality.co.uk/
D&Q sources originally designed brands from Scandinavia to represent them in the UK retail market. So the site needed to be a portfolio for the agent and a showcase for the brands she represents. The site uses the Form App. A Master page has been set up so she can easily create new Brand pages, along with existing content region edits.
Naturally Sassy - https://www.naturallysassy.co.uk/
This was a site that I launched last year but I've recently updated it due to it's growth. It now makes uses a couple of Blog Sections and quite a lot of categories to help section the content. I also now has the Events App installed.
Nice examples Sarah. Did you design these sites as well as the Perch development?
Yes I don't tend to take on projects which are just builds. My background is Design and I like an even split of Design and Front-end dev.
Hi Sarah
I'm interested how you coded your logo image template uploads in worldwidepictures.tv - I have a site I am working on at the moment that will have an equally diverse set of logos (in terms of height/width) and am looking at options for the client doing them for themselves (without any outside intervention).
Did you size the logos first and then import them in a regular square format, or do it using some form of cropping at the import stage?
cheers in advance
Ben
These are awesome, Sarah.
Would you be able to advise on how you achieved the map functionality on the WWP.tv website?
Thank you
Ben - The company had an in-house video guy who has Photoshop skills. So I was able to give him a PSD template of the square logo template where I had set up guides so he could place it nicely in the middle in proposition.
Originally I had tried to be clever and use flexbox to centre the logo image so any type of image size dimensions could be uploaded, but you still can't control if they upload something with a lot of white space and therefore it would look smaller than the others.
I'm a firm believer in limiting what the client can do to protect the look of the site. I've seen far too many examples during my agency days where clients were given too much control in their CMS.
I've also placed a max number on the Perch repeater at 30 so the grid would never have an odd one at the different breakpoints. Plus it stops them getting carried away and adding 100s.
Rich - This uses the Google Map API. I found another site which had a similar feature to what I was doing and I learnt from their code.
This is a good resource for doing Google Map related bits without getting too much into the API - https://mapbuildr.com/
Hi Sarah
Ah... ok I have tried being clever too... didn't work for exactly the same reason!
I think clients and logos is always a bit of a nightmare - in the past I have ended up producing the logos myself to avoid people uploading huge/tiny/stretched etc.
If you have someone who is able to produce a suitable image that's an enormous bonus - I also like the idea of limiting the number that can be uploaded to maintain the integrity of the grid.
Really nice work.
cheers
Ben
Great examples Sarah!
Great examples. I am new to Perch so looking around.
These are very nice sites and designs. Was wondering what css framework/tool you are using to create the layout designs?
Thanks for sharing those, Sarah. I took a good look at Worldwide Pictures and Design and Quality on my laptop and phone.
A magnificent (and diverse) selection of sites you have there!
What client workflow did you decide on for the Naturally Sassy recipes pages (e.G. https://www.naturallysassy.co.uk/recipes/ginger-lemon-turmeric-dhal)? In particular, how and where can your client insert images? Do you use blocks for layout control, or are the image positions fixed and limited to a certain number? Same for the ingredient lists…
Best regards, Jannis
@Jim - I use my own grid framework with the help of Susy (sass) The actual design work I always do with graphic software before coding, with Sketch App being my preferred choice.
@Jannis - the recipe pages are now using Perch Blocks. She can add images as blocks within the body content and there's always one set at the top of the post which is also used as a listing thumbnail.
For Ingredients I have up to two fields for this as some recipes may just need one and others two (ie the main ingredients and the sauce) with a Perch repeater so she can add as many ingredient as needed.
Thanks for the explanation!