👉 Subscribe to My YouTube Channel

GeneratePress Free Tutorial – Build a Simple Blog [Design 4]

In this video tutorial, I will show you, how to build a simple blog using GeneratePress free theme. You can download the latest version of theme from WordPress repository or from the GeneratePress website directly.

It’s a quick and short video, so please watch the video without skipping.

Table of Contents

Recommended Hosting

Required Theme

Required Plugins

Color Palette

CSS Variable NameHexa CodeActual Color
contrast#dadada
contrast-2#dadada
contrast-3#b2b2be
base#f0f0f0
base-2#f7f8f9
base-3#34343b
accent#e4aa48
highlight-color#fde9e5
base-4#2e2e35
border#e4aa48

Custom CSS Code

/** Recent post widget */
.rpwwt-widget a {
	text-decoration: none;
}
.rpwwt-post-author {
	font-size: 14px;
}
/** Main navigation header */
.main-navigation .main-nav ul li a::after {
	content: "";
	width: 1px;
	position: absolute;
	top: 18px;
	right: 0;
	height: 23px;
	background: var(--border);
}
/** Sidebar Widget */
.widget-title {
	border-bottom: 3px solid var(--accent);
	display: inline-block;
}
ul.wp-block-categories li,
ul.wp-block-archives li {
	list-style-type: none;
	margin-left: 0px;
	border-bottom: 1px dotted var(--border);
}
ul.wp-block-categories li a,
ul.wp-block-archives li a {
	display: inline-block;
	width: 80%;
	float: none;
	text-decoration: none;
	padding-bottom: 13px;
	margin-bottom: 13px;
}
.wp-block-tag-cloud a {
	font-size: 14px !important;
	text-decoration: none;
	border: 1px solid var(--border);
	padding: 5px 12px;
	margin-bottom: 10px;
}
.wp-block-latest-posts a {
	text-decoration: none;
}
.wp-block-latest-posts__list.wp-block-latest-posts li {
	list-style-type: decimal;
	margin-bottom: 15px;
	font-size: 95%;
	margin-left: 20px;
}
/** wpforms */
button.wpforms-submit {
	background-color: var(--accent) !important;
    color: var(--base-3) !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    padding: 15px 20px !important;
    text-transform: uppercase !important;
    display: inline-flex !important;
    align-items: center !important;
	border-width: 0 !important;
}
/** Top bar widget */
.top-bar {
	background-color: var(--base3);
	color: var(--base3);
	border-bottom: 1px solid #f1f1f1;
}
.top-bar .widget {
	border-width: 0px;
}
/** Footer widget */
.footer-widgets .widget,
.footer-bar .widget {
	border-width: 0px;
}
.footer-widgets {
	border-top: 1px solid var(--border);
}
/** Containers */
.separate-containers .page-header {
	background-color: var(--base-3);
	border: 1px solid var(--border);
}
.separate-containers .page-header {
	padding: 0px;
}
.separate-containers .page-header .page-title {
	padding: 40px 40px 0px 40px;
}
.separate-containers .page-header .taxonomy-description {
	padding: 0px 40px 40px 40px;
}
.separate-containers .inside-article {
  margin-bottom: 50px;
}
.site-branding-container {
  display: block;
  align-items: center;
  text-align: center;
}
.site-description {
  padding-top: 8px;
}
/** General */
a.read-more {
	display: block;
	margin-top: 15px;
	text-align: right;
	text-transform: uppercase;
	text-decoration: none;
	letter-spacing: 1px;
}
a.read-more::after {
	content: '→';
}
.read-more-section {
	text-align: center;
	margin-top: 40px;
}
.highlight {
	background: var(--base-3);
	padding: 40px;
	text-align: center;
	font-size: 20px;
	margin-top: 20px;
	margin-bottom: 20px;
}
.highlight-wrapper {
	max-width: 1300px;
    margin: 0 auto;
}
/** Header section */
.site-header {
	padding-top: 15px;
	padding-bottom: 15px;
}
.inside-header {
  padding: 10px 40px;
}
/** Content section */
.gp-post-date-author {
	text-align: center;
}
.gp-post-date-author {
    padding: 7px;
	  letter-spacing: 0.5px;
    text-transform: uppercase;
    font-size: 14px;
	  margin-top: -10px; 
}
.single-featured-image {
	margin-top: 15px;
}
/** Button */
.wp-block-button a {
	color: var(--base-3) !important;
}
.wp-block-search__button {
	background: var(--accent);
	border-width: 0px;
	color: var(--base-3);
}
/** Others */
.gp-custom-category-section {
	text-align: center;
	padding-bottom: 10px;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	font-size: 14px;
}
.gp-custom-tag-section a {
	padding: 5px 10px;
	margin-right: 5px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	font-size: 13px;
}
.gp-custom-tag-section {
	margin-top: 15px;
}
.archive.author .page-title,
.search .page-title {
	padding: 40px !important;
}
.paging-navigation {
	text-align: center;
}
.cat-links, .comments-link, .tags-links {
	display: inline-block;
	padding-right: 10px;
}
/** Hero Banner */
.hero-banner-title {
	text-transform: uppercase;
    font-weight: 900;
    padding-top: 25px;
}
.hero-banner-cta {
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 1px;
}
/** Responsive Grid System */
.wpf_column {
  float: left;
  width: 50%;
  padding: 10px;
}
.wpf_row:after {
  content: "";
  display: table;
  clear: both;
}
.wpf-container {
	max-width: 1300px;
	margin: 0 auto;
	padding: 20px;
}
.wpf-container-wrapper {
	background: var(--base-3);
}
.wpf_column_wrapper img {
	margin: 0 auto;
}
@media only screen and (max-width: 640px) {
  .wpf_column {
	float: left;
	width: 100%;
	padding: 10px;
	}
}

PHP Code Snippets

Custom PHP Code

add_action( 'generate_after_content','gp_custom_display_tags' );  
if (!function_exists('gp_custom_display_tags')) {
	function gp_custom_display_tags() {  
		if(is_single()) {
			$post_tags = get_the_tags( get_the_ID() );
			$tags_content = '<div class="gp-custom-tag-section">';
			if( $post_tags ) { 
				foreach($post_tags as $tag) {
					$tag_link = get_tag_link( $tag->term_id );
					$tags_content = $tags_content . '<a class="button" href="'. $tag_link .'">' . $tag->name . '</a>';
				}
			}
			$tags_content = $tags_content . '</div>';
		echo $tags_content;
		}
	}
}
add_action( 'generate_after_entry_header','gp_custom_thumbnail_image' );  
if (!function_exists('gp_custom_thumbnail_image')) {
	function gp_custom_thumbnail_image() {  
		if(is_single()) {
			$feat_image = wp_get_attachment_url( get_post_thumbnail_id(get_the_ID()) );
			echo '<img class="single-featured-image" src="'.$feat_image.'"></img>';	
		}
	}
}

add_action( 'generate_before_entry_title','gp_custom_before_title' );  
if (!function_exists('gp_custom_before_title')) {
	function gp_custom_before_title() {  
		$post_categories = wp_get_post_categories(get_the_ID(), [ 'fields' => 'all' ]);
		$category_content = '<div class="gp-custom-category-section">';
		if( $post_categories ) { 
			foreach($post_categories as $c) {
				$category_link = get_category_link( $c->term_id );
				$category_content = $category_content . '<a href="'. $category_link .'">' . $c->name . '</a>' . ' / ';
			}
			$category_content = rtrim($category_content, ' / ');
		}
		$category_content = $category_content . '</div>';
		echo $category_content;
	}
}

add_filter( 'generate_post_date_output','gp_custom_add_to_post_date' );
if (!function_exists('gp_custom_add_to_post_date')) {
	function gp_custom_add_to_post_date( $output ) {
    	return '<div class="gp-post-date-author">' . $output;
	}
}

add_filter( 'generate_post_author_output','gp_custom_add_to_post_author' );
if (!function_exists('gp_custom_add_to_post_author')) {
	function gp_custom_add_to_post_author( $output ) {
    	return $output . '</div>';
	}
}

add_filter( 'generate_leave_comment','gp_custom_remove_comment_link' );
if (!function_exists('gp_custom_remove_comment_link')) {
	function gp_custom_remove_comment_link() {
    	return false;
	}
}

add_filter( 'generate_show_comments', '__return_false' );
add_filter( 'generate_show_tags', '__return_false' ); 
add_filter( 'generate_show_categories', '__return_false' );

add_filter( 'generate_excerpt_more_output', 'gp_custom_read_more' );
if (!function_exists('gp_custom_read_more')) {
	function gp_custom_read_more() { 
    	return '<div class="read-more-section"><a class="button" href="'.get_permalink(get_the_ID()).'">Continue Reading &rarr;</a></div>';
	}
}
add_action( 'after_setup_theme','gp_remove_featured_page_header' );  
if (!function_exists('gp_remove_featured_page_header')) {
	function gp_remove_featured_page_header() { 
    	remove_action( 'generate_before_content', 'generate_featured_page_header_inside_single', 10 );
	}
}

GeneratePress Copyright Text

add_filter( 'generate_copyright','gp_custom_copyright_design_4' );
function gp_custom_copyright_design_4() {
    ?>
    © 2022 GeneratePress Site Development• All Rights Reserved!
    <?php
}
I regularly post videos about building WordPress Websites from scratch using free and premium themes. If you like to watch more similar contents, please subscribe to my YouTube channel!