My first fully Blocs-built WordPress site is live

https://lekkerekeuken.com is the recipe-website of my girlfriend. It was fully designed and built in Blocs, using the WordPress theming capabilities of Blocs Plus.

All feedback is very welcome :slight_smile:

8 Likes

Delicious :yum:
Unfortunately my Dutch isn’t that good to cook these dishes :smile:

Check out the image on this post (not header, the second image) with a iPhone in portrait mode (so smaller device screen size than the image), it doesn’t look like it’s responsive to the smaller screen size. Landscape mode is correct.

Cheers
Jannis

1 Like

Thanks for the input. I’ll fix that. We’ve actually chosen to remove the second image on the dishes, since it’s just a repetition of the one in the header. So that one might have escaped my corrections :wink:

PS: I’ll translate the recipe and I’ll send it to you via DM. My girlfriend makes the absolute best pancakes you’ve ever tried :wink:

1 Like

Pannekoeken, lekker! Met stroop uiteraard! nom, nom, nom :yum: :yum:

2 Likes

We’ll get you there. :grin:

2 Likes

I will try :grinning_face_with_smiling_eyes: thanks!

1 Like

Awesome @brechtryckaert, care to also share your experience, maybe some tips with using Blocs for WP?

1 Like

Hey @brechtryckaert,

Cool website, great work!!

I didn’t know we had so much in common! :slight_smile: We have both built the Blocs 4 Plus WP website for our girlfriend/wife for sharing recipes ))

3 Likes

Absolutely. Once I actually got my head wrapped around the workflow of crafting themes in Blocs, I was a pretty straightforward process.

First and foremost I couldn’t have done it without watching (and following along with) the video series on creating a WordPress theme: Building a Wordpress Theme - Section 1 - Introduction - YouTube
This clarifies the basics of crafting a theme in quite a nice, condensed manner.

Initially, the “WP Content” bric sufficed for me. But after a while, I wanted more control over the way the content on the “single”-page is being displayed. At this point I started experimenting with the tremendous amount of shortcodes Norm has provided within Blocs Plus.
For all of you interested, you can find those here (as the hidden gem within the knowledge base that they turned out to be): Wordpress Short Codes – Blocs – User Documents
It’s with these shortcodes that Blocs Plus really shows its strenght. This allows you for example to add the author and used tags under your post subject, something that doesn’t happen when you use the default “WP Content” bric.

Of course, as you can see, I’ve kept the layout fairly simple. I’ve intentionally not used the comments implementation and kept all animations and such to a very bare minimum. This is more because I’m very performance/speed focussed.

I do have a theme coming, also built with Blocs Plus, that has a bunch more custom pages, uses the custom post types functionality and has a lot more animation too.

The only thing I’m missing in Blocs Plus right now is a way to define custom sections in the customizer (enable/disable a specific div, editing a fixed text field, editing a photo that isn’t the “featured image”). I’ve suggested these “nice to haves” to Norm. Besides this, Blocs Plus has everything I want, but it already has 100% of the features I need.

4 Likes

Words like this, coming from the veritable Blocs Master, are a true compliment. Thank you very much Eldar!

And yes, so it seems :wink: Yours is amazing by the way.

2 Likes

Thanks! I also wanted to keep it simple, so it’s easy for my wife to manage! In any case, thanks for sharing your experience with Blocs 4 Plus and WP. It is quite similar to mine.

Cheers,
Eldar

1 Like

I find the header image a bit scary, maybe use one with cake. :hocho: :drop_of_blood:

1 Like

I’ll take that into account, thanks!

1 Like

Says the one with the probably scariest profile pic on this forum after my own :rofl:

1 Like

@brechtryckaert cool site, very nice performance!

How did you go about the WordPress loops?
Are you using posts, custom posts or is it simply “hardcoded” into the html?

I found a bug (reported and fixed in the next version already by Norm) which pulled the wrong archive title in wp archives
But besides that, I found the dynamic loop building in blocs a bit confusing at first

Since a loop loops over items you can’t build a (example) 3 col row the “normal” way as used to in blocs but instead have to set the loop on the container and then design only ONE column so when it is in the loop, it loops over that one column html to produce the actual loop with repeating columns

This was a bit confusing at first because in the builder it’ll look like “you missed to design the other columns”. Of course it’s obvious if one knows how usual loops work, but I think it could be challenging for someone not knowing what happens in a loop. Perhaps a new way to “lock” the all but the first item in such loops (so you can’t even attempt to design them in the app) would make sense.

What is also a bit new for me is that the “head” section is added to each template - in WP themes usually you have the head section in the header which gets called with php on each template - for me this is weird because in php you try to DRY (don’t repeat yourself), and having the same head html in each template to me seems a bit undry :stuck_out_tongue_closed_eyes:

But other than that I agree, it’s very good so far, helps to quickly layout templates and entire themes

What I also miss are features to build more complex searches - this would be a killer addon for blocs
Currently I use toolset or wp grid builder for that - which means I can’t really style or design it in the app. Of course this is rather something not used on every single site so it’s an acceptable limitation.

Support for custom user and term fields, as well as custom taxonomy are something I’ll miss on most projects…

Finally I’d really love if the app could “import” changes I made to the theme (after exporting, for example small html changes or customizations to php), because each time I do a tiny change in the app, and re-export, it overwrites the changes made in the previous export
But again this is no big deal and probably pretty hard, close to impossible to implement in the app, as it might probably have difficulty to deal with eventual unsupported customizations

Ps, the customizer API in WP is rather simple (it requires some php understanding thou) - if you want to extend that for your own site I mean.
Start here Theme Customization API « WordPress Codex
I think the blocs app also adds one “example” you could use to the functions (the logo if I recall right).
It might help to get a few more settings done.

Or, you can use plugins like ACF or MetaBox to create your 100% own options, which then can be used in small php conditions in your templates.
I’ve a plugin somewhere around that also shows and helps how to do this, I’ll see if I still have that code so I can share here. Often times in WP it’s all about understanding the first approach which can take a bit of time and trial/failure, then you just repeat the same for other options or settings… similar to blocs :crazy_face:

The header php template section can be removed from any page by disabling the top Global Area :+1:

I think I misexplained
I don’t want to remove the header, or header section.
I mean the html that gets added in each template with keyword, title tag, etc.
In other words the html it puts in head - that could just be added to the header.php instead - and load globally.
Or does the option you mention disable that? I thought it disables the actual header.php file - which would disallow for global menu etc

Am I wrong?
Sorry for not just trying, I’m on mobile right now…

Ah ok yes that’s correct, that portion is hard wired. In case keywords or other values are added in page settings.

1 Like