Generate Press Tutorial – Free Version: A basic guide for new users

This Generate Press tutorial is about the free WordPress theme. You can buy a premium upgrade.

But this page describes the free theme only.

Most WordPress themes are fairly generic. They have things like a navbar, sidebars and footer widgets etc. In this Generate Press tutorial I’ll concentrate on the special and important features in the free version of the theme.

This is a one minute video overview

To watch the full video of this tutorial scroll to the bottom of this page. Jump To Video

This is what Generate Press free edition looks like…

The arrows and red text in this image highlight some notable features.

Generate Press Tutorial for the Free Theme

Full Width or Contained

You can set Generate Press to span the full browser window or to be contained. The screenshot above shows the theme set to be contained in a boxed layout.

Top Bar widget area

The Top Bar is a widget area that is ideal for displaying your phone number right at the very  top of the page. However, you could put any content in here that suits your own site or business needs.

You Can Use an Image Logo or Text For The Site Title

The header section of this screenshot I made for this Generate Press tutorial shows an image logo. If you prefer you could use text for the site title and add a text tagline. You can align the site title or image logo to the left, right or center.

Social Media Icons

The social media icons are added using the Lightweight Social Icons plugin. After installing the plugin, you just drag the Lightweight Social Icons widget into the header widget area. Then choose an icon from the list, such as Facebook and type your social media page URL in to a box.

Navbar Options

You can position the navigation bar above, below or inside the site header. If you place the navbar inside the header you’d have to move the social media icons to the sidebar or footer.

Go to Customize > Layout > Primary Navigation: and make your changes.

If you have drop down links in the navbar you can set the drop down links to only display when you actually click the top link. This makes your drop down navigation links work better on mobile devices.

Generate Press also has a search feature built into the primary navigation. Just click the search icon in the navbar to open a search box. This search icon is optional. You can see this feature on the demo site I made to go with this Generate Press tutorial.

Featured Images

If you set a featured image as you write your post, that featured image will automatically display at the top of that post.

Footer Widgets

There are five footer widgets available in the Generate Press free theme. You don’t have to use all five. However, make sure you start at the beginning when adding widgets to the footer widget area. Especially if you’re only using two or three of the five footer widgets. You can not, for instance, just place widgets in footer widget areas 3 and 4. You would have to use footer widget area 1 and 2 first.

Footer Bar

The footer bar is a different widget area to the footer widgets, see image above. I made that image especially for this Generate Press tutorial 🙂 The footer bar is an ideal place to put a big bold call to action etc.

Back to Top

You can enable or disable the back to top button. It’s up to you.

Navigating your Way Around Generate Press Free Theme

This is one of the most important sections of this Generate press tutorial, so please take note!

You can find the settings for Generate Press theme in three different places.

  • Dashboard > Appearance > Customize
  • Dashboard > Appearance > Generate Press
  • (and in the WordPress) Post Editor

Generate Press theme options in the Customizer

You get to most of the Generate Press theme settings by going to Dashboard > Appearance > Customize

You then have several options to choose from including…

  • Site Identity
  • Layout
  • Colors
  • Typography
  • Blog

You may have to drill down several layers inside the customizer to find the actual setting you need.

For instance to place the navbar below the header you would go to…

Dashboard > Appearance > Customize > Layout > Primary Navigation > Navigation Location > Below Header.

Primary navigation settings in Generate Press Free theme

I recommend you spend some time exploring the options in Dashboard > Appearance > Customize: and familiarize yourself with the options that are available .

Generate Press theme options in the WordPress post editor

As you write each new post, you’ll notice several options in the sidebar below the publish button. These options include…

  • Sidebar Layout
  • Footer Widgets
  • Page-Builder Container
  • Disable Elements.

You can choose the sidebar layout for each post as you write it. This setting overrides the default sidebar settings which are found in Dashboard > Appearance > Customize > Layout > Sidebars.

You can choose how many of your footer widgets will display on this individual post. Look in the post editor sidebar for the footer widgets option and make your selection.

The Page Builder Container is used when you use a page builder plugin such as Beaver Builder. This looks like a simple and fairly unimportant option in the WordPress post editor sidebar. To find it scroll down below the button you use to publish or save your posts. By selecting the Full Width or Contained button. you make any Beaver Builder page layouts you make span the full browser width, of the viewer’s monitor. Or remain contained in a boxed style page layout. This is a very useful option that few themes have.

Disable Elements, in the free theme you only have one element that you can disable, the post title. This again is very useful when using a page layout plugin like Beaver Builder.

Options available in the post editor when using Generate Press Free theme

The Lightweight Grid Columns plugin

The demo site uses the Lightweight Grid Columns plugin, this plugin was made by the same person who built Generate Press theme. Lightweight Grid Columns plugin enables you to build grid layouts in your pages and posts without having to write the code by hand. It’s a basic and lightweight plugin that does one job well.

Built in Tutorials and Guides

After installing Generate Press free theme go to…

Dashboard > Appearance > Generate Press

Here you’ll find a list of useful guides and tutorials made by the theme developer.

Options available in the Generate Press theme settings page

More information about the Generate Press theme…

My review of the Premium Plugin

Read the reviews of this theme on WordPress.org

See the Free Theme on WordPress.org

See the Upgrade Options

Screenshot of the free version of Generate Press theme

Generate Press Free Theme

With thousands of free themes available, why should you choose Generate Press?

Although Generate Press is a clean and very professional looking theme, it’s real power comes with the premium plugin. So, if you’re sure you’ll never upgrade, is there any point using the free version of Generate Press?

Yes. Because Generate Press integrates seamlessly with page builder plugins such as Beaver Builder.

In fact other than the official, and very pricey, Beaver Builder theme I don’t know of any theme that works so well with Beaver Builder.


You can download the free version of Generate Press Here


So the two big reasons to use Generate Press are…

  • You want to use a page builder plugin
  • You intend to upgrade to the premium version of Generate Press

However, even without the upgrade and without adding a page builder plugin, Generate Press is still one of the best free themes available.


Please Note! In the free theme screenshot, the large image with text is made in an image editor such as PhotoShop. You can NOT put text over the image via the theme settings. (Unless you install the Beaver Builder Plugin 😉

This image was made in PhotoShop - You can't add this text via the WordPress editor in the free version of Generate Press
This image was made in PhotoShop – You can’t add this text via the WordPress editor in the free version of Generate Press

Here are some more reasons to use the free version of Generate Press…

  • It looks clean and professional out of the box
  • You can choose how many footer widgets you want to have
  • You can add an image logo
  • You can choose how wide you want the site container to be
  • You can use color to separate the content and sidebar areas, or a have a single color for the entire content area
  • You can put the navbar above the header, below the header or inside the header, inline with the logo
  • You can add a search button in the navbar
  • You can set drop down links in the navbar to open on hover, or to only open when clicked. This enables people using tablets to activate the drop down links
  • There are two sidebars available and you can choose layouts such as content-sidebar or sidebar-content-sidebar etc. on a site wide basis or on a page by page basis
  • You can set the header and footer sections to be full width or contained. Contained produces the traditional boxed style site layout
  • There’s a back to top button
  • You can change the content background color as well as the color of the text and links
  • You can set the typography for the body element. This affects typography site wide including font family, font size and line height
  • On the blog listing page you can choose to display the full post content or the excerpt

And in your dashboard on the Generate Press settings page, there’s even a set of handy links to pages with instructions showing how to use the options available in the free theme.


You can download the free version of Generate Press Here


These are some screenshots of various settings available in the free version of Generate press

The Generate Press options page has links to the documentation page
The Generate Press options page has links to the documentation page
You'll find these options in the page editor of the free version of Generate Press
You’ll find these options in the page editor of the free version of Generate Press
The customizer page for the free version of Generate Press
The customizer page for the free version of Generate Press
The navigation settings for the free version of Generate Press
The navigation settings for the free version of Generate Press

You can download the free version of Generate Press Here

Colors and typography

Color and Typography for DIY Web Designers

The tools you need

Colorzilla and What Font are two extensions for the Chrome browser.

Colorzilla is a simple color picker tool. When you find a web site with a color scheme you like, you just activate the color picking tool and click the section of the web page that contains the color you like. Make a note of that color and use it in your own designs.

Use Collorzilla to click an element and find the color
Use Collorzilla to click an element and find the color

What Font is similar to Colorzilla but instead of telling you what color is being used it tells you what font is being used. What Font Chrome extension tells you what font family is being used as well as the font size and line height.

I used WhatFont to find the font family and size for this headline
I used WhatFont to find the font family and size for this headline

 

You can’t change every font setting using Generate Press premium plugin. But you can usually change enough to get the look you want.

Customizing the typography using the Premium version of Generate press
Customizing the typography using the Premium version of Generate press

 

If you have the premium version of Generate Press you can apply those settings to your website, all you have to do is go to…

  • Dashboard > Customizer > Typography > Body
  • (or) Dashboard > Customizer > Typography > Content etc.

And apply the same font family, size and line height to your site.
You can find more color picking advice here

Choosing your Colors and Typography

Color and typography are two of the cornerstones of your web design.

Learning all you need to know about color and typography might seem like a daunting task. But there’s a short cut that can give you fantastic results fast.

How to find great color schemes and typography…

Just serf the web and find sites that already have great typography or color schemes and use those colors and fonts on your site too.

You might have heard the term copy like a professional. The idea is simple, all good professionals are inspired by the top designers in their field. You look at their work, absorb it and then use that inspiration in your own designs.

The dividing line between inspiration and copying

This is a decision only you can make. But one good rule of thumb is that if your inspiration comes entirely from one site, you’re probably copying. But if your typography comes from one site, your color scheme comes from another and the layout you use comes from a third website, the end product is much more your own.

Err on the side of caution, you don’t want to get sued!

Generate Press Review: Free Theme and Premium Plugin

What is Generate Press?

Generate Press is a free WordPress theme that has two very special features.

  • It’s designed to work with page builder plugins such as Beaver Builder
  • You can buy an add on that helps you customize the free Generate Press theme

Many other themes work with Beaver Builder to some extent, but few themes integrate with Beaver Builder so well. Generate Press is designed to work with page builder plugins.

Generate Press also has a one click option to make your Beaver Builder page layout span the full browser width, few other themes can do this so well or so easily.

The WordPress page title often looks out of place in a Beaver Builder page layout, but with Generate Press you can remove the page title with one click. Making your Beaver Builder layouts look much more professional.

Used together the free Generate Press theme and the free version of Beaver Builder plugin give you a massive amount of control over the design of your homepage and any inner pages you choose to style.

So far I’ve been talking about the free versions of Generate Press and Beaver Builder plugin.

The premium plugin

The Generate Press Plugin

So why would you buy the Generate Press premium plugin?

The Generate Press premium plugin is designed specifically to enhance the free Generate Press theme. The premium plugin enables you to style the theme and add extra options and elements to your site.

The elements the plugin enables you to style include…

  • Colors
  • Typography
  • WooCommerce
  • Page Sections
  • Menus
  • Page Header Sections
  • The Blog Listing
  • Background (colors and images)
  • Spacing Between Elements
  • Copyright (Footer Credits)
  • You can also Disable Page Elements (to build landing pages etc)
  • Make Hook Boxes (like the Genesis Simple Hooks plugin)

Take a look at these short videos that show each add on in action

Generate Press add-ons
Generate Press add-ons

The Generate Press premium plugin also enables you to…

  • Add hero header sections above your pages, posts and blog page.
  • Disable elements such as the header, footer, navbar and sidebars when you’re building landing pages.
  • Build simple stripy webpages, each stripe can have a different colour or a large image background. For more complex page layout grids I recommend you use the free Beaver Builder plugin.
  • Build grid and masonry blog page layouts.
  • Customize the color and typography of your site.

The easiest way to see just how many extra features the Generate Press premium plugin adds to the Generate Press free theme is to watch the short demonstrator videos on this page.

What do other people think of Generate Press?

If you go to the WordPress.org page for Generate Press you’ll be amazed at the rave reviews this free theme gets.

When I wrote this post there were 458 five star reviews of the free theme. There were just 2 one star reviews.

Replying to the first one star review Tom explained in detail how the reviewer could get the results they wanted. In reply to the second one star review, several independent Generate Press users jumped in to explain why they believed the review was unfair.

The WordPress.org reviews make one thing very clear…


Real users absolutely love this theme, it’s developer and the quality of support he provides


Visit the review page on WordPress.org

This is a real review from a Generate Press user…

“This theme is good. The Premium addon pack is wonderful. The support is AWESOME!”

(click to see this review on WordPress.org)

I could spend all day telling you about the features in the premium addon pack for Generate Press but by far the easiest way for you to see what’s available in the premium version is to visit the plugin site and watch a couple of the one minute videos. I believe you’ll soon be convinced, I was.

I’ll leave you with another real review from WordPress.org…

“My work is simply easier because of this theme”

(click to see this review on WordPress.org)

In my opinion the Generate Press premium plugin is well worth the money.

Check it out now and see what you think.


The Premium Plugin

The tools I use on this website

The tools I use on this website

This website is designed to help people on a tight budget build good looking websites fast.

To do this I’ll be using…

The theme is Generate Press

Generate Press is designed to work well with page builder plugins.

The page builder plugin is Beaver builder

Beaver Builder light is a free plugin that enables you to build homepage layouts that look just as good as many top quality premium theme home page designs. And you can build these layouts in just a few minutes.

The premium plugin

The developer who makes the free theme Generate Press, also sells a premium add-on plugin that makes styling his theme easy. Although this add-on plugin costs $39.99 I think it’s well worth the price because it enables you to style the header, footer and sidebars of his Generate Press theme.

The Generate Press premium plugin also enables you to add hero sections above your pages and posts. As well as building grids for your blog page layouts.

And best of all the plugin has a very generous licence. Check it out yourself and see what you think.

Get started for free then buy the plugin if you think you need it

The best thing about this system is that you can get started for free. Test the tools for yourself and learn first hand just how powerful they are and how well they work. Then upgrade to the premium plugin when you’re ready to style the header, footer and sidebars.

Getting ready to design your website

Getting ready

Step 1: Things to do before you start designing

First look at the demo themes to get an idea of what Generate Press looks like. But remember, even the free theme can be customized quite a bit.

View as many sites as you can, looking for…

  • Color schemes you like.
  • Typography and font combinations you like.
  • Homepage and landing page layout designs you like.
  • Blog listing page designs you like.
  • Landing page designs you like.

When you’ve got your fonts, color scheme and layout, go to Unsplash and find some starter photos.

Now you’re ready to start designing your site…

Fonts

Set your body font, line height and paragraph margin using your chosen font. The content of your site now has your basic font settings. Set the font family, font weight and size for h1, h2, h3. Use the mobile icon buttons to set headline sizes for mobile phones etc.

Colors

Use the Generate Press settings to set background and text colors for…

  • Header
  • Content
  • Navbars
  • Sidebars
  • Footers etc

Blog layout

  • Choose grid or Masonry layout.
  • Then configure your blog type listings the way you want them to display.

Should you use Beaver Builder or Generate Press to build your custom page layouts?

If your requirements are modest, stick with Generate press. You don’t have to use Beaver Builder.
But if you want to really impress your clients, consider using Beaver Builder. For instance if you want to build responsive layout grids as part of your design the free version of Beaver Builder is a must.

As you design and build your site keep in mind the acronym KISS and focus on the word simple. Bells and whistles can too easily appear amateurish. Simplicity, elegance and style go hand in hand. If you want to build a classy looking website that converts viewers in to doers, keep it simple.