Generatepress Theme Customization CSS Code: To customize the GeneratePress theme and achieve a Marketer Theme design, CSS can be used effectively. Below is a sample CSS snippet tailored for GeneratePress, allowing you to add a custom touch to various elements like the Home/Blog Page, Sidebar and footer:
Marketer Theme Customization: Additional CSS Code
Copy this CSC code and paste it on the Additional CSS option.
Using this class read-more-bt on button
/* GeneratePress Site CSS */
.sidebar .widget,
.container-widget {
box-shadow: rgba(23, 43, 99, 0.3) 0 6px 18px;
border-radius: 4px;
}
/*Button Style*/
.read-more-bt,
a.button,
.pagination-bt,
.wp-block-search__button,
input[type="submit"] {
font-size: 14px;
padding: 10px 25px;
transition: 0.5s;
background-size: 200% auto;
box-shadow: rgba(23, 43, 99, 0.3) 0 7px 28px;
background-image: linear-gradient(to right, #1fd1bf 0, #07b0a2 51%, #1fd1bf 100%);
border-radius: 50px;
}
.read-more-bt:hover,
a.button:hover,
input[type="submit"]:hover,
.pagination-bt:hover,
.wp-block-search__button:hover {
background-position: right center;
color: #fff;
text-decoration: none;
}
/*Attachment Image Style*/
.attachment-full {
box-shadow: rgba(23, 43, 99, 0.3) 0 7px 28px;
border-radius: 25px;
}
#wp-block-search__input-1 {
border-radius: 5px;
border: 0px;
}
/* End GeneratePress Site CSS */
Site Footer
Copy this code and paste it on Site Footer Elements
Sidebar Widgets
Copy this code and paste it on Sidebar Widgets Elements.
<!-- wp:generateblocks/container {"uniqueId":"356d0541","isDynamic":true,"blockVersion":3,"display":"flex","flexDirection":"column","rowGap":"20px"} -->
<!-- wp:generateblocks/container {"uniqueId":"d8499018","isDynamic":true,"blockVersion":3,"marginTop":"10","marginBottom":"10","paddingTop":"20","paddingRight":"20","paddingBottom":"20","paddingLeft":"20","className":"container-widget"} -->
<!-- wp:search {"label":"Search","showLabel":false,"placeholder":"Search....","buttonText":"Search"} /-->
<!-- /wp:generateblocks/container -->
Source: wpjankari.com
