[Resolved] Building a website from scratch using GenerateBlocks

[Yvon-Pierre]

I’d like to build one of the starter site that relies on GenerateBlocks and for which there is a walkthrough video – doesn’t matter which one.

To achieve this goal, I think I need to install GP Premium first but I’m not sure which modules to activate and how to set them up. For example, I think I have to turn on the Disable Elements module in order to turn off the built-in header and footer but I don’t even know how to do that. There might be other GP Premium modules to activate and setup as well.

If you could provide a step by step guide of what needs to be done in a brand new WordPress install with GP Premium to get to the point where I can build with GB, that would be a tremendous help. I could then follow the walkthrough video to reverse engineer the starter site and re-build it, learning a ton along the way.

Is this something possible?

[Leo]

Hi there,

I would not start by disabling the header for sure – usually, the header and navigation are still handled by the theme itself and not GenerateBlocks unless you have some special requirements.

Can you tell me which site from the site library you’d like to achieve?

Another good way to learn is to simply import a site you are interested in a staging site environment then you can see how everything was built – with our guidance of course 🙂

[Yvon-Pierre]

Hello Leo,

Thanks for your offer. I studied Full Site Editor using Gutenberg and know how to build pages and posts with WP’s block editor. What I want to learn now is how to use GP Premium and GB to build a site similar to one of your starter sites.

Looking at the description of the seven starter sites for which you created a walkthrough video, it seems that the following five were built using mainly GB: Search, Dev, Crypto, Geek & Donate. If I get this right, then any of these would work but since you ask for a specific one, let’s go with Donate.

Can you please provide a step by step guide of what needs to be done on a brand new website after WordPress, GP Premium & GB have been installed to get to the point where I can start to build the Donate starter site by following your walkthrough video? What has to be done in the WordPress dashboard, which GP Premium modules have to be activated, what else that has to be done so that I can start following your video walkthrough and build the Donate starter site from scratch? If such a guide could be provided, it would a tremendous help to go from “what the heck am I supposed to do” to “I can build a starter site using GP & GB”!

[Leo]

Have you considered just importing the Donate site first?

That really would be the simplest way to go.

[Yvon-Pierre]

I know that I could simply import the starter site but this is not what I’m after. I’m looking for a guide for beginners but you don’t have one. But I think I found the next best thing, clever in a way, if you don’t mind me saying so, for you guys to fix this missing gap in your training. Even Tom Usborne admitted in an interview on the The Admin Bar YouTube channel that one of your company’s challenge was to bridge the gap in between complete beginners and your products. Well, what I’m suggesting here could be a relatively simple step in that direction and it ties well to the training resources that are currently available.

If you create a guide describing what has to be done after WordPress, GP Premium and GB have been installed, meaning all the settings that have to be applied in order to be in a position to reproduce one of your starter site, one built mainly with GB and for which you have a video walkthrough, then anybody could follow this guide and then your video walkthrough to reproduce (reverse engineer) this starter site and most importantly, learn along the way how to use GP and GB. That would provide a great learning experience for beginners. And it plugs right into your current resources!

If you don’t want to produce such a guide, I’ll have to figure it out myself. Without such a guide, it will take me a lot more time but I’m confident that I’ll eventually get there because I’m tenacious and motivated. And every other beginners who look into GP and GB will have to figure it out for themselves as well but not all of them will have the motivation to go through this process and will simply look for something easier elsewhere.

Do you see what I’m suggesting? There might be a better way but it seems to me that producing such a guide or tutorial would be a tremendous learning experience for beginners. Plus it would be a great addition to your starter sites video walkthroughs. Maybe Tom has better plans to bridge the training gap in between beginners and your products. Can you please forward him this post? I’d like to hear his thinking on this.

Thanks!

[Leo]

It will take a long time and lots of replies but I’m happy to guide you through the options used in Donate.

Do you have a clean install setup? If not that will be the first step.

Once you have a staging site set up, install and activate GP Premium and activate the following modules:
https://www.screencast.com/t/kyr2Otr8B

Let me know when that is done and I’ll provide the next step 🙂

[Yvon-Pierre]

YES, perfect! Thank you so much Leo! Sorry to reply late, it’s been a busy day today.

Since my “practice” host doesn’t offer staging, I created a sub domain and I’ve done a clean install of WordPress, GP Premium and GB. I left all posts, pages, plugins and settings installed by WordPress as is.

I activated the modules shown in the screen shot. By the way, the “Site Library” module in your screen shot is activated but there’s no red arrow beside it. I activated it but can deactivate if not needed.

Looking forward to the next step!

[Leo]

The site library module is not needed as we won’t be importing a template here.

Here are some next steps:

– Set your home page to be a static page:
https://wordpress.org/support/article/settings-reading-screen/

– Maybe create the same pages as you see in Donate and create a menu:
https://docs.generatepress.com/article/using-the-wordpress-menu-builder/

– Upload a logo in the customizer:
https://docs.generatepress.com/article/adding-header-logo/

– Set the navigation location to Float right:
https://docs.generatepress.com/article/navigation-location/

Can you also provide a link to the site you are building so I can see if something isn’t right?

[Yvon-Pierre]

Hello Leo,

I’ve done the steps and I think I got it right.

I’ve added the same pages that I see in Donate (all blank pages). From the WordPress install, I sent “Sample Page” to trash but didn’t delete it in case it’s needed later on. I kept “Privacy Policy” page and “Hello World” post.

I chose a static page, set Homepage to “Home”, Posts page to “Blog”, number of posts to “10”, each post in a feed to “Excerpt”, and selected to Discourage search engines from indexing this site.

When I set the navigation to Float right, the menu shows on the right side of the header logo. Maybe the logo container should be full width? I’ll wait for your feedback.

The website is located here: https://donate.max4uni.com/wp_donate/ Do you need admin access?. Please have a look when you have a chance and let me know if I have to change something.

I’m ready for the next steps.

This is great Leo. Thank you so much for your guidance.

[Leo]

The site logo should be this image: https://gpsites.co/donate/wp-content/uploads/sites/83/donate-logo.svg

And then you can style the Donate Today now button in the navigation using this method here:
https://docs.generatepress.com/article/adding-buttons-navigation/

[Yvon-Pierre]

Hello,

I presume the site logo should be the heart shape followed by the word “donate”. Unfortunately, I get a blank page when I click on https://gpsites.co/donate/wp-content/uploads/sites/83/donate-logo.svg.

I’ll work on the button style ASAP and let you know how it goes

[Leo]

That’s not a blank page – it’s just a white logo with a white background so you can’t see it.

You just have to open up the link, right-click and Save as to download the SVG file.

[Yvon-Pierre]

Ha ha, now that you say it, it makes perfect sense! Sorry for not noticing it!

[Yvon-Pierre]

Which plugin do you recommend to upload SVG files? I found these two online: Safe SVG and SVG Support.

[Leo]

I usually use SafeSVG but both should work.

[Author]

Posts