You can make a professional blog using GeneratePress free theme. GeneratePress is one of the best WordPress theme, used by millions of bloggers to create light-weight, Responsive, and SEO-friendly website.
Creating a blog can be a daunting task, especially if you are new to the world of web design and development.
However, there are many powerful tools and resources available to help make the process easier. One such tool is GeneratePress, a lightweight and customizable WordPress theme that is perfect for creating a blog.The video tutorial below will help you to make the blog using GeneratePress free version.
Choose a Domain Name and Hosting Provider
The first step in creating a blog is to choose a domain name and hosting provider. Your domain name is the unique address that people will use to access your blog, while your hosting provider is the company that will store and serve your website’s files.
There are many domain name and hosting providers to choose from, but we recommend using a provider that offers a one-click WordPress installation. This will make it easy to get started with GeneratePress.
Recommended Hosting
Hostinger Coupon Code – YOURTECHNICAL
Install WordPress
Once you have chosen a domain name and hosting provider, you can install WordPress on your site. This is usually done through a one-click installation process, which can be accessed through your hosting provider’s control panel.
Install GeneratePress Theme
After installing WordPress, you can then install the GeneratePress theme.
Required Theme
Simply Install and then Activate the theme.
Required Plugins
When it comes to creating a blog using GeneratePress, there are a few plugins that are essential to ensure the smooth running and functionality of your website.
Recent Posts Widget With Thumbnails
By installing these plugins, you can add essential functionality to your GeneratePress-based blog, making it more powerful, engaging and secure for your visitors. It’s important to note that, it’s always a good practice to use only the necessary plugins and keep them updated to avoid any conflict or performance issues.
Custom CSS Code
.rpwwt-widget .rpwwt-post-date {
font-size: 14px;
border-bottom: 1px solid var(--border);
padding-bottom: 15px;
}
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;
}
.sidebar .widget {
box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
margin-bottom: 40px;
}
.widget-title {
border-bottom: 2px solid var(--border);
padding-bottom: 15px;
}
.widget-title::after {
content: '';
display: block;
position: relative;
width: 50px;
height: 2px;
background: #333;
bottom: -17px
}
.main-navigation .main-nav ul li a::after {
content: "";
width: 1px;
position: absolute;
top: 18px;
right: 0;
height: 23px;
background: var(--border);
}
.top-bar {
background-color: var(--base-3);
color: var(--base-3);
border-bottom: 1px solid var(--border);
}
.top-bar .widget {
border-width: 0px;
}
.footer-widgets .widget,
.footer-bar .widget {
border-width: 0px;
}
.rpwwt-widget a {
text-decoration: none;
}
.rpwwt-post-date {
color: var(--contrast-3);
padding-top: 5px;
}
ul.wp-block-categories li,
ul.wp-block-archives li {
list-style-type: disc;
margin-left: 20px;
border-bottom: 1px solid 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;
}
#comments {
border: 1px solid var(--border);
padding: 20px;
}
.separate-containers .page-header {
background-color: var(--highlight-color);
}
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: '→';
}
.separate-containers .inside-article {
padding-top: 0px;
}
.read-more-section {
text-align: center;
margin-top: 40px;
}
.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;
}
.blog-page-header-wrapper {
background: var(--highlight-color);
padding: 15px;
}
.blog-page-header {
padding: 20px 40px;
}
.gp-custom-category-section {
text-align: center;
padding-bottom: 10px;
letter-spacing: 0.5px;
text-transform: uppercase;
font-size: 14px;
}
.single-featured-image {
margin-top: 15px;
}
.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;
}
.separate-containers .page-header {
padding: 0px;
margin: 40px;
}
.separate-containers .page-header .page-title {
padding: 40px 40px 0px 40px;
}
.separate-containers .page-header .taxonomy-description {
padding: 0px 40px 40px 40px;
}
.highlight {
background: var(--highlight-color);
padding: 40px;
text-align: center;
font-size: 20px;
margin-top: 20px;
margin-bottom: 20px;
}
.highlight-wrapper {
max-width: 1300px;
margin: 0 auto;
}
.archive.author .page-title,
.search .page-title {
padding: 40px !important;
}
.paging-navigation {
text-align: center;
}
.site-header {
box-shadow: 0 0 6px 0 rgba(37, 37, 37, 0.24);
}
.inside-header {
padding: 10px 40px;
}
header {
margin-bottom: 25px;
}
.home header {
margin-bottom: 0px;
}
.cat-links, .comments-link, .tags-links {
display: inline-block;
padding-right: 10px;
}
.rpwwt-post-author {
font-size: 14px;
}
.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;
}
.sidebar .widget {
margin-bottom: 40px;
}
.separate-containers .inside-article {
box-shadow: rgba(33, 35, 38, 0.1) 0px 10px 10px -10px;
margin-bottom: 50px;
}
/** 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(--banner-bg);
margin-top: 5px;
margin-bottom: 25px;
padding-bottom: 25px;
padding-top: 25px;
}
.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
GeneratePress Copyright Text
add_filter( 'generate_copyright','gp_custom_copyright_design_2' );
function gp_custom_copyright_design_2() {
?>
© 2022 GeneratePress Site Development• All Rights Reserved!
<?php
}Hero Banner HTML
<div class="wpf-container-wrapper">
<div class="wpf-container">
<div class="wpf_row">
<div class="wpf_column">
<div class="wpf_column_wrapper">
<h1 class="hero-banner-title">Build WordPress Websites Using GeneratePress Theme</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu odio ex. Etiam vulputate auctor tellus, ac condimentum urna tempor ut.</p>
<p>Vestibulum eu luctus magna, sit amet lacinia ligula. Morbi dictum elementum nisl quis tristique.</p>
<a class="button hero-banner-cta" href="#">Enroll Now For a Free Seat</a>
</div>
</div>
<div class="wpf_column">
<div class="wpf_column_wrapper">
<img src="https://images2.imgbox.com/32/9f/VlryeUCa_o.png" />
</div>
</div>
</div>
</div>
</div>Hero Banner Shortcode
add_action( 'generate_after_header','gp_custom_banner_section_2' );
function gp_custom_banner_section_2() {
if(is_home()) {
echo do_shortcode('[code_snippet id=9]');
}
}
Nice Now i’ll modify my website