How to Build a Magazine Website With GeneratePress WordPress Theme

Share Now

GeneratePress WordPress theme is simply focusing on a speedy experience and adaptability. Also, you can make any site with any page builder like Beaver, Elementor, Brizzy, and the Gutenberg Block editor.

GeneratePress WordPress Theme

Although GeneratePress is a free theme, you can get it at any time. The premium version allows for more customization if you want more advanced features. These main features are in the premium ingredients:

  • Off-Canvas and Mobile Header
  • Advanced Columns
  • Site Library
  • Sticky Header
  • Infinite Scroll
  • Data Import/Export
  • Advanced Hook
  • Change Copyright Footer
  • WooCommerce features

GeneratePress uses many designers, and the theme’s elements are limited since it is codeless and fast. It is, in my opinion, the best WordPress theme for designers and developers.

Let’s build a GeneratePress Magazine

We now use the GeneratePress Magazine Theme and a GP premium plugin without a page builder to create a magazine or blog-type website. Go to Theme > Appearance > GeneratePress

Activate all features from the GP Pro version. Now customize the GeneratePress theme.

GeneratePress Premium features

1. Container Layout

Theme customization > Layout > Container.

  • Adjust for Container Width between 1080px and 1200px
  • Separating Space-20px
  • Content Separator-2em
GeneratePress content separator

Adjust Content Layout If you like one container or a separate container, you can set it up to your preference. Also, the content padding needs to be at least 30 to 40 px. The content separator defines the featured image, title, content, and entry meta space.

2. Header Editing

Theme customization > Layout > Header.

  • Header Presets-Current
  • Header Width-Contained 
  • Header Padding
    • Top 10px
    • Bottom 10px
    • Left and right 20px.
GeneratePress Header Editing

3. Blog Layout

Theme customization > Layout > Blog.

There is nothing else if you want to show your post expert from the front page, but if you don’t want to offer an expert, select 0 excerpt word count. If you’re proceeding to display these, tick them one by one.

GeneratePress Blog Layout

4. Grid Layout and Sidebar Settings

The grid layout is pretty good for magazines, news, and even blogs. 

  • Tick to display posts in columns and select two or three columns.
  • You can change to displaying posts in the masonry grid.
  • That can change each sidebar for the front page, posts, and other pages.
  • You can choose right, left, or both; otherwise, there is no sidebar option. 
  • Set the sidebar width to 30% and the widget padding to 40px.
GeneratePress Grid Layout and Sidebar Settings
  • Theme customization > Layout > Footer.
  1. Footer Width – Contained
  2. Inner Footer Width – Contained
  3. Back to Top Button – Enable
  4. You can change the footer widgets to whatever you want.
  5. Footer widget area padding – 40px for all
  6. Footer padding – 20px for all
  7. Set your site name or company name in the footer copyright.
GeneratePress Footer Editing

6. Colors Settings

Select your few favorite colors. Don’t use many colors on your website; use a few unique colors for things like 

  • One background-color
  • Container color
  • Heading color
  • Base font color
  • Link color

7. Body Colors

  • Background Color: Select between white and dark (color code: e5e5e5)
  • Text Color: Select a smooth color to improve readability (color code: 5e5e5e).
  • Set your favorite colors (Green, Blue)

8. Content Colors

  • The content background should always be white. It’s easy to read for visitors. (ffffff).
  • Set your favorite colors (text, link, hover, content title, meta text, heading colors)

9. Typography Settings

You can adjust different fonts separately for the header, footer, content, widgets, buttons, and navigation. 

You can use Google Fonts, but remember that Google Fonts directly affect your website performance. I highly recommend Google Font Host locally using one of the plugins.

Use just two fonts for headings and content. recommends the following fonts: Open Sans, Inter, Times New Roman, Poppins, Lato, Merriweather

10. Header and General Settings

Set your logo, titles, menu, and other text files. Generatepress has an effective CSS Print Method; creating your dynamic CSS in an external file offers critical performance improvements.

Select Cache dynamic CSS and Cache CSS created by your decisions to increase performance.

You can use these settings according to your needs.

  • Sticky: Navigation
  • Off-Canvas Panel
  • Primary and secondary navigation
  • Widget Areas
  • Title, tags, and more.

You’ll see examples like these on the website if you are doing well.

  • 01. One Container
  • 02. Separate Container
Magazines Website With GeneratePress

If you don’t have GeneratePress Premium

If you don’t have the GeneratePress premium, you can use the Better Gutenberg block plugin to create a beautiful homepage using one of these:

You can create pages and posts instantly in the block editor using Gutenberg. There is no need for page builder plugins like Elementor, Oxygen, BB, and WP Bakery.

There is a significant benefit to using Gutenberg blocks. You don’t need to code or have a unique design to create attractive websites. Other third-party page builders take longer to load than Gutenberg.

Earlier, I created all of my designs with Elementor and Beaver Builder. After I switched to Gutenberg, I had a problem with page builder performance on my website because Elementor and other heavy builders need comprehensive server sources; you can test it using this Query Monitor.

GeneratePress Alternatives

Furthermore, you can use the GeneratePress alternative with more features; GeneratePress is developer-friendly and does not have many customization options. If you are looking for a feature-rich WordPress theme, you can use one of these:

01. Blocksy

Blocksy is a straightforward, fast WordPress theme made with the latest technologies. You can build any website style using WordPress page builders. Also, Gutenberg-friendly to create stunning websites without third-party builders.

The theme also has gride/list layouts, and you can adjust any grid, list, or blog interface layout. This theme allows you to select a color scheme. The best option is a visual footer and header with drag and drops features like widgets, HTML menu, and more for the free version.

02. Kadence

The Kadence is light and full-featured WordPress theme that makes gorgeous, fast-loading websites. It has an easy-to-use, drag-and-drop header and footer builder and a sticky header that enables a unique design.

You have to choose sidebars or no sidebars, fullwidth or narrow width layouts, and the color palette offered by Kadence. You can customize the build for the desktop, tablet, and mobile separately.

03. OceanWP

OceanWP is a creative and notable free WordPress theme with various uses, including eCommerce, business, and blogging websites.

A simple theme for multi-purpose websites that is compact, quick to load, and highly configurable. It all, including the header, footer, skin, layout, and anything else, is fully customizable.

A professional grid layout, large images, or thumbnail styles The ocean wp theme comes with three different mobile menus in the overall header styling. 

04. Astra

Astra is an attractive theme for web creators and developers. It’s pretty suitable for any online task. Astra is a famous theme since it is straightforward and offers excellent flexibility. 

Astra provides starter templates with a single click. These pre-sites support Elementor, Beaver Builder, Gutenberg, and Brizy. A header builder also includes the footer.

05. Zakra 

Zakra is a lightweight and fast GeneratePress alternative suitable for blogs, WooCommerce, and marketing websites, among other things. There are two headers, a sidebar, and three types of containers: boxed, comprehensive, and separated.

Zakra includes nearly 70 free and premium demos, most page builders, such as Elementor, Gutenberg, and Brizy, and numerous plugins compatible with the theme. You can replace the credit link in the footer with your own. 

06. Hueman

The better theme for blogs and magazines has always been. It’s well-known for providing a great mobile experience, loading quickly, and being very easy to use.

It also has a mobile device detection option that loads a small script file to detect if a mobile device is displaying your site, like a phone or a tablet.

Theme Comfortable With Nimble Page Builder, you can design any page with a few clicks. There are other options, such as two sidebars to the left and right and infinite widget areas.

Overview

It would be best to consider these factors before selecting a WordPress theme. The theme should be quick and straightforward to load, with minimal CSS and jQuery-free and responsive design.

We must focus on search engines and ensure that the theme is SEO optimized to achieve the best results. It should be customizable and have a personable, professional touch.

We need to manage several plugins for our website, and the theme should be compatible with all plugins and page builders. The GeneratePress WordPress theme is suitable for those who want a clean design experience.


Await the code.
Madushan

Madushan

WordPress design, speed optimization, content marketing, and monetization are on the high end of blogging. I have followed up on all matters for at least seven years.

Leave a Reply

Your email address will not be published.