|

GeneratePress Theme Customization CSS Code, Create A Beautiful Site

In this article, GeneratePress Theme Customization CSS Code, WordPress Best Customization has been given for you. Due to this the look of your website will be changed to the very best, I hope you will like this GeneratePress Theme Customization CSS Code, WordPress Best Customization.

GeneratePress Theme Customization CSS Code
GeneratePress Theme Customization CSS Code

GeneratePress is one of the most famous blogging themes in the WordPress space. The reason it is so popular is its simplicity. As you see it, you can start thinking about where and how your content will look and how your users will browse it.

GeneratePress Theme Customization CSS Code

Since each website has its own requirements, themes can be combined with popular WordPress plugins and add more functionality. Be it custom post types, custom fields, galleries or portfolios, GeneratePress can do it.

In fact you can even use it for an e-shop site as it is also compatible for WooCommerce. All this saves your valuable time and money so that you can focus more on the important things.GeneratePress Theme Customization

GeneratePress is a lightweight theme that you can get for WordPress sites. However, the free version comes with limited features like footer links and limited theme settings. You will need to purchase the GeneratePress premium plugin to use the full features.

If you are familiar with the setup of commercial WordPress themes, you will be surprised that GeneratePress has a different way of working. Here are some tips by which you can customize the GeneratePress theme-

  1. Change published date to last updated date
  2. Add Google Analytics without plugin
  3. Insert Yoast breadcrumb
  4. Insert author bio box without plugin
  5. Insert advertisements without plugin
  6. Add leave a reply above comment section
  7. Remove links from author and post dates
  8. Using Elements in GeneratePress

Here are the main features of the GeneratePress Theme-

  1. Simplicity
  2. Responsive design
  3. Fast loading
  4. Great support
  5. Awesome documentation
  6. Compatible with WooCommerce, WPML, BuddyPress and bbPress
  7. Compatible with Elementor and Page Builder
  8. Free child themes
  9. The theme includes all the default WordPress options plus options to:
  10. Change the layout of header, content area, sidebars
  11. Cache CSS
  12. Load only the essential Font Awesome icons and not the whole library
  13. Change the alignment of the navigation and the title
  14. 9 sidebars with the option to use them per page or post

GeneratePress does not offer theme options like many other themes. You have to use the Elements function and setup custom hooks to put the code on your site. Follow the steps given below to use Elements feature in GeneratePress theme.GeneratePress Theme Customization

  • Navigate to “Appearance > GeneratePress” section.
  • You will see all the modules of the theme here.
  • Click on the “Activate” link against “Elements” option.
  • Remember, “Disable Elements” is a different feature for disabling title. You have to
  • activate the “Elements” option.

 

GeneratePress Theme Customization CSS Code
GeneratePress Theme Customization CSS Code

Many of us believe that web page speed is very important. Google has also confirmed that mobile web page speed does indeed play a major role in mobile rankings. Google web page speed score is not a concern.GeneratePress Theme Customization

What’s more important is a good user experience, and because of that, your sites should be lightweight and even better.GeneratePress Theme Customization

GeneratePress was developed with site speed in mind. One of the most standard installs of the theme is at a little less than 28Kb which is unmatched.

Moreover, GeneratePress is coded and structured as per the latest coding standards, it looks very clean as well as structured.

Now it’s your turn to be given that special CSS Code so that you can give a better look to your GeneratePress | GeneratePress Theme Customization

GeneratePress Theme Customization CSS 1st

GeneratePress CSS Code - 1:-

/*Article Page Design by Sur Sarita Tech*/
.page-header-image-single .attachment-full{
box-shadow: rgba(23,43,99,.3) 0 7px 28px;
border-radius:25px;
}
.entry-content h2,h3,h4,h5,h6{
font-weight:600;
padding: 10px 10px 10px 25px;
background-image: linear-gradient(315deg, #0cbaba 0%, #380036 74%);
border-radius:10px;
color:white!important;
box-shadow: rgba(23,43,99,.3) 0 7px 28px;
}
.entry-content h2{
font-size:25px!important;
}
.entry-content h3{
font-size:21px!important;
}
.entry-content h4{
font-size:17px!important;
}
.entry-content h5{
font-size:15px!important;
}
.entry-content h6{
font-size:13px!important;
}
.comment-respond .comment-reply-title{
padding: 10px 10px 10px 25px;
background-image: linear-gradient(315deg, #0cbaba 0%, #380036 74%);
border-radius:10px;
font-weight:600;
color:white!important;
font-size:22px!important;
box-shadow: rgba(23,43,99,.3) 0 7px 28px;
}
/*End of Article Page Design*/
/*Sidebar Universal*/
.widget-title{
padding: 10px 10px;
background-image: linear-gradient(315deg, #0cbaba 0%, #380036 74%);
border-radius:10px;
font-weight:500;
color:white!important;
font-size:18px!important; text-align:center;
box-shadow: rgba(23,43,99,.3) 0 7px 28px;
}
.sidebar .widget {
box-shadow: rgba(23,43,99,.3) 0 6px 18px;
border-radius: 5px;
}
.sidebar .widget:first-child {background-image: linear-gradient(315deg, #0cbaba 0%, #380036 74%);}
.button.light {
background-color: #fff;
border-radius: 50px;
font-weight: 700;
color:#333;
}
.button.light:hover {
background: #333;
color: #fff;
}
/*End of sidebar code*/
/*End of sidebar code*/
@media (min-width: 769px) {
.post-image-aligned-left .post-image img {
margin-top: -20px;
border-radius: 12px;
box-shadow: rgba(23,43,99,.2) 0 7px 28px!important;
}
}
/* Mobile query */
@media (max-width: 768px) {
.post-image-aligned-left .post-image img {
margin-top: -20px;
border-radius: 12px;
box-shadow: rgba(23,43,99,.2) 0 7px 28px!important;
}
}
/* Widget Sticky */
@media (min-width: 769px) {
.site-content {
display: flex;
}
.inside-right-sidebar {
height: 100%;
}
.inside-right-sidebar aside:last-child {
position: -webkit-sticky;
position: sticky;
top: 10px;
}
}
/* Read More button Style */
a.read-more.button {background-image: linear-gradient(315deg, #0cbaba 0%, #380036 74%);}
a.read-more.button {
font-size:14px;
padding: 10px 25px;
text-align: center;
transition: 0.5s;
background-size: 200% auto;
color: white;
box-shadow: rgba(23,43,99,.3) 0 7px 28px;
border-radius: 120px;
}
a.read-more.button:hover {
background-position: right center; /* change the direction of the change here */
color: #fff;
text-decoration: none;
}
/* Read More button Style */
blockquote {
background: #dcdcdc54;
border-left: 5px solid #1EA4FF;
padding: 15px;
font-style: inherit;
font-size: 18px;
margin: 0 0 1.5em;
}

GeneratePress Theme Customization CSS 2nd



Here Is 2nd GeneratePress CSS Blue Colour Code -
 

GeneratePress Theme Customization
GeneratePress CSS Blue Colour Code - 2:-
/*Article Page Design by Sur Sarita Tech*/
.page-header-image-single .attachment-full{
box-shadow: rgba(23,43,99,.3) 0 7px 28px;
border-radius:25px;
}
.entry-content h2,h3,h4,h5,h6{
font-weight:600;
padding: 10px 10px 10px 25px;
background-image: linear-gradient(315deg, #36096d 0%, #37d5d6 74%);
border-radius:10px;
color:white!important;
box-shadow: rgba(23,43,99,.3) 0 7px 28px;
}
.entry-content h2{
font-size:25px!important;
}
.entry-content h3{
font-size:21px!important;
}
.entry-content h4{
font-size:17px!important;
}
.entry-content h5{
font-size:15px!important;
}
.entry-content h6{
font-size:13px!important;
}
.comment-respond .comment-reply-title{
padding: 10px 10px 10px 25px;
background-image: linear-gradient(315deg, #36096d 0%, #37d5d6 74%);
border-radius:10px;
font-weight:600;
color:white!important;
font-size:22px!important;
box-shadow: rgba(23,43,99,.3) 0 7px 28px;
}
/*End of Article Page Design*/
/*Sidebar Universal*/
.widget-title{
padding: 10px 10px;
background-image: linear-gradient(315deg, #36096d 0%, #37d5d6 74%);
border-radius:10px;
font-weight:500;
color:white!important;
font-size:18px!important; text-align:center;
box-shadow: rgba(23,43,99,.3) 0 7px 28px;
}
.sidebar .widget {
box-shadow: rgba(23,43,99,.3) 0 6px 18px;
border-radius: 5px;
}
.sidebar .widget:first-child {background-image: linear-gradient(315deg, #36096d 0%, #37d5d6 74%);}
.button.light {
background-color: #fff;
border-radius: 50px;
font-weight: 700;
color:#333;
}
.button.light:hover {
background: #333;
color: #fff;
}
/*End of sidebar code*/
/*End of sidebar code*/
@media (min-width: 769px) {
.post-image-aligned-left .post-image img {
margin-top: -20px;
border-radius: 12px;
box-shadow: rgba(23,43,99,.2) 0 7px 28px!important;
}
}
/* Mobile query */
@media (max-width: 768px) {
.post-image-aligned-left .post-image img {
margin-top: -20px;
border-radius: 12px;
box-shadow: rgba(23,43,99,.2) 0 7px 28px!important;
}
}
/* Widget Sticky */
@media (min-width: 769px) {
.site-content {
display: flex;
}
.inside-right-sidebar {
height: 100%;
}
.inside-right-sidebar aside:last-child {
position: -webkit-sticky;
position: sticky;
top: 10px;
}
}
/* Read More button Style */
a.read-more.button {background-image: linear-gradient(315deg, #36096d 0%, #37d5d6 74%);}
a.read-more.button {
font-size:14px;
padding: 10px 25px;
text-align: center;
transition: 0.5s;
background-size: 200% auto;
color: white;
box-shadow: rgba(23,43,99,.3) 0 7px 28px;
border-radius: 120px;
}
a.read-more.button:hover {
background-position: right center; /* change the direction of the change here */
color: #fff;
text-decoration: none;
}
/* Read More button Style */
blockquote {
background: #dcdcdc54;
border-left: 5px solid #1EA4FF;
padding: 15px;
font-style: inherit;
font-size: 18px;
margin: 0 0 1.5em;
}

GeneratePress CSS Code to download, by clicking on the Download button –

GeneratePress CSS Code

GeneratePress Theme Customization

GeneratePress Theme Customization

Buy GeneratePress Premium in Just 199/- only @ Our Website’s Store


Hope you liked this GeneratePress Theme Customization CSS Code, WordPress Best Customization If you liked this GeneratePress Theme Customization CSS Code, WordPress Best Customization – Must have liked if you liked these  for WordPress If you like –

“Please comment.”

To get all types of technology, blogging tips and tricks, and information related to SEO, please F O L L O W to “tips.sursaritatechknow.com” |

Please S U B S C R I B E to my y o u t u b e channel “Blogging Scholar-Youtube” – To You tube  | P L E A S E  C O M M E N T and please share || Thanks ||

  • Web Blogging
Share on:

1 thought on “GeneratePress Theme Customization CSS Code, Create A Beautiful Site”

Leave a Comment