GeneratePress Theme Customization and the best website structure, Google Adsense friendly and SEO friendly. To get Adsense approval quickly, website structure, design, and theme matter a lot.
How to implement GeneratePress theme CSS
GeneratePress Premium is a very light and Adsense-friendly theme, but this theme does not provide an excellent design for your website.
The official design is standard, but we can modify this from the Addition CSS section.
We have made a premium design for your website using Custom CSS to customize the GeneratePress Theme to a better look and feel with SEO and Speed optimization.
This service is completely free of charge. Feel free to copy the custom code provided here and paste it directly into your WordPress platform.
We ensure meticulous attention to detail, addressing even the smallest errors. The design is exceptionally lightweight, ensuring it has no impact on the speed of your website.
However, as a precautionary measure, it is advisable to create a backup of your website before applying any customizations. This way, you can easily revert to the previous version if any issues arise.
Also read: Generate Blog Auto
Here’s a step-by-step guide to implementing the GeneratePress Theme Customization:
- Log in to your WordPress website dashboard.
- Navigate to the “Appearance” section and select “Customization.”
- Within the customization options, scroll down and click on “Additional CSS.”
- Paste the provided CSS code into the designated area.
- Finally, click on “Publish” to apply the changes.
Explain
/* GeneratePress CSS Design by DilnawazKiTECH*/
.inside-article,
.sidebar .widget,
.comments-area {
border-right: 2px solid rgba(0, 0, 0, 0.07);
border-bottom: 2px solid rgba(0, 0, 0, 0.07);
box-shadow: 0 0 10px rgba(232, 234, 237, 0.5);
}
/* Font CSS */
.page-header-image-single .attachment-full {
box-shadow: rgb(23 43 99 / 20%) 0 5px 25px;
border-radius: 10px;
}
@media (min-width: 769px) {
.post-image-aligned-left .post-image img {
margin-top: -20px;
border-radius: 10px;
box-shadow: rgba(23, 43, 99, .2) 0 5px 25px !important;
}
}
@media (max-width: 768px) {
.post-image-aligned-left .post-image img {
margin-top: -20px;
border-radius: 10px;
box-shadow: rgba(23, 43, 99, .2) 0 5px 25px !important;
}
}
.sidebar .widget {
box-shadow: rgb(23 43 99 / 10%) 0 5px 25px;
}
.separate-containers .page-header {
background: transparent;
padding-top: 20px;
padding-bottom: 20px;
}
.page-header h1 {
font-size: 1.5em;
}
.form-submit,
.form-submit .wp-block-button__link {
padding: 15px 25px;
}
@media (max-width: 768px) {
.post-image img {
max-width: 100%;
}
}
/* Read More button */
a.read-more.button {
font-size: 14px;
padding: 10px 25px;
text-align: center;
transition: 0.5s;
background-size: 200% auto;
color: #fff;
box-shadow: rgba(23, 43, 99, 0.3) 0 7px 28px;
border-radius: 120px;
}
a.read-more.button {
background-image: linear-gradient(to right, #4cb8c4 0, #3cd3ad 51%, #4cb8c4 100%);
}
input[type="submit"]:hover {
background-position: right center;
text-decoration: none;
}
/*Comment Box*/
.comment-respond .comment-reply-title {
padding: 10px 10px 10px 25px;
background-image: linear-gradient(to right,#4CB8C4 0%,#3CD3AD 51%,#4CB8C4 100%);
border-radius: 40px;
font-weight: 500;
color: white !important;
font-size: 20px !important;
box-shadow: rgba(23, 43, 99, .3) 0 5px 25px;
}
.form-submit .submit {
background-image: linear-gradient(to right, #4cb8c4 0, #3cd3ad 51%, #4cb8c4 100%);
font-size: 14px;
padding: 10px 25px;
text-align: center;
transition: 0.5s;
background-size: 200% auto;
color: #fff;
box-shadow: rgba(23, 43, 99, 0.3) 0 7px 28px;
border-radius: 120px;
}
/*webkit-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: 20px;
}
}
/* Heading */.h {
background: linear-gradient(124deg, #2f2c39 70%, #3cd3ad 30%);
padding: 10px 20px;
color: #ffffff;
margin-left: -20px;
margin-right: -20px;
font-size: 18px;
}
/* Iamges */
.wp-block-image img {
border-radius: 10px;
box-shadow: rgba(23,43,99,.2) 0 7px 28px!important;
margin-bottom: 30px!important;
}
.sidebar .widget {
box-shadow: rgba(23,43,99,.3) 0 7px 23px;
border-radius: 8px;
}
.wp-block-image img {
border-radius: 10px;
box-shadow: rgba(23,43,99,.2) 0 7px 28px!important;
margin-bottom: 30px!important;
}
/* Sidebar search section css */
.sidebar .widget {
box-shadow: rgba(23,43,99,.3) 0 7px 23px;
border-radius: 8px;
}
.wp-block-search__input {
border: none !important;
border-bottom: 1px solid #000000 !important;
background: 0 0 !important;
font-size: 15px;
padding: 5px 2px !important;
}
.wp-block-search__input {
padding: 8px;
flex-grow: ;
margin-left: 0;
margin-right: 0;
min-width: 3em;
border: 1px solid #949494;
text-decoration: unset!important;
}
.wp-block-search__button {
border-radius: 20px;
font-size: 13px !important;
padding: 8px 20px !important;
text-align: center;
color: #fff !important;
box-shadow: rgba(23, 43, 99, 0.3) 0 7px 28px !important;
}
.wp-block-search__button {
background-image: linear-gradient(to right, #4cb8c4 0, #3cd3ad 51%, #4cb8c4 100%) !important;
}
.wp-element-button {
cursor: pointer;
}
.wp-block-search__button {
margin-left: 0.625em;
word-break: normal;
}
.entry-content a:not(.button):not(.wp-block-button__link):not(.gb-button) {
text-decoration: none;
background-image: linear-gradient(transparent 2px, #2ed392 2px, #2ed392 4px, transparent 4px), linear-gradient(transparent 2px, #003cff 2px, #d8dce9 4px, transparent 4px);
background-size: 0 6px, 100% 6px;
background-position: 0 bottom, 0 bottom;
transition: background-size 0.3s ease-in-out;
background-repeat: no-repeat;
padding-bottom: 4px;
font-weight: 700;
}
.inside-article a, .paging-navigation a, .comments-area a, .page-header a {
color: #49bdbf;
}
a {
color: #49bdbf;
}
a {
text-decoration: none;
}
a, button, input {
transition: color .1s ease-in-out,background-color .1s ease-in-out;
}
*, ::after, ::before {
box-sizing: inherit;
}
user agent stylesheet
a:-webkit-any-link {
color: -webkit-link;
cursor: pointer;
text-decoration: underline;
}
.entry-content ul li {
margin: 20px 0;
list-style: none;
margin-left: -20px;
text-decoration: none;
background-image: linear-gradient(transparent 2px, #2ed392 2px, #2ed392 4px, transparent 4px), linear-gradient(transparent 2px, #d8dce9 2px, #d8dce9 4px, transparent 4px);
background-size: 0 6px, 100% 6px;
background-position: 0 bottom, 0 bottom;
transition: background-size 0.3s ease-in-out;
background-repeat: no-repeat;
padding-bottom: 8px;
font-weight: 700;
}
.inside-article a, .paging-navigation a, .comments-area a, .page-header a {
color: #000000;
}
Thanks for reaching out to this article, where we discussed how to customize the GeneratePress Theme GeneratePress Theme Customization using custom CSS.ce adds an extra layer of security and allows for a seamless restoration in case of any unforeseen issues.
Also Read: Essay on Republic Day 2024
