Load Google Fonts
@import url(https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,700,700i,900,900i);
Load FontAwesome
// Load Font Awesome
add_action( 'wp_enqueue_scripts', 'enqueue_font_awesome' );
function enqueue_font_awesome() {
wp_enqueue_style( 'font-awesome', '//maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css' );
}
Remove focus border
:focus {
color: #333;
outline: #ccc solid 0px;
}
Edit Header - remove sticky header and change to fix width
.site-header {
position: -webkit-sticky;
position: inherit;
top: 0;
z-index: 9999;
}
.site-header .wrap {
max-width: 1140px;
margin: 0 auto;
}
Edit dropdown width
.genesis-nav-menu .sub-menu, .genesis-nav-menu .sub-menu a {
width: 240px;
}
Add Banner Hook
/** After Header - Main Banner */
genesis_register_sidebar( array(
'id' => 'custom-hook-one',
'name' => ( 'After Header - Main Banner', 'genesis' ), 'description' => ( 'This is banner widget area.', 'customtheme' ),
) );
add_action( 'genesis_after_header', 'genesis_after_header_area' );
function genesis_after_header_area() {
genesis_widget_area( 'custom-hook-one', array(
'before' => '', 'after' => '',
) );
}
.genesis_after_header_css {
background: #111;
color: #fff;
}
Expand Full-width content using css
.full-width-content .content,
.landing-page .content {
float: none;
margin-left: auto;
margin-right: auto;
width:100%;
max-width:900px;
}
Create custom Homepage page with no title and Full-width
Download this file, and insert below css
.homepage-page .content {
width:100%;
max-width: 1000px;
}
.homepage-page .site-inner {
padding: 0 30px;
}
.genesis_after_header_css {
background: #111;
color: #fff;
}
Blox Lite – Content Blocks for Genesis
.blox-caption-wrap {
padding: 120px 0;
text-align:center;
color:#fff;
font-size: 50px;
line-height: 55px;
font-weight:700;
max-width:1120px;
margin: 0 auto;
position:relative;
}
.blox-image-background {
background-size: cover;
background-position: center center;
position:relative;
}
.blox-caption-container::before {
background: rgba(0, 0, 0, 0.5);
bottom: 0;
content: "";
height: auto;
left: 0;
position: absolute;
right: 0;
top: 0;
}
Responsive - Media query
/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px){
}
/* Medium Devices, Desktops */
@media only screen and (max-width : 992px){
}
/* Small Devices, Tablets */
@media only screen and (max-width : 768px){
}
/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px){
}
/* Custom, iPhone Retina */
@media only screen and (max-width : 320px){
}
Adding Featured Image above title in Single Post/Page
// Register a custom image size for Singular Featured images
add_image_size( 'singular-featured-thumb', 800, 250, true );
add_action( 'genesis_before_entry', 'sk_display_featured_image' );
function sk_display_featured_image() {
if ( ! is_singular( array( 'post', 'page' ) ) ) {
return;
}
if ( ! has_post_thumbnail() ) {
return;
}
// Display featured image above content
echo '<div class="singular-featured-image">';
genesis_image( array( 'size' => 'singular-featured-large' ) );
echo '</div>';
}
Adding Featured Image above title in Category/Archive page
// Move titles
add_action( 'genesis_meta', 'move_title_below' );
function move_title_below() {
if (is_home() || is_archive()) {
remove_action( 'genesis_entry_content', 'genesis_do_post_image', 8 );
add_action( 'genesis_entry_header', 'genesis_do_post_image', 3 );
}
}
Making body content small
.after-entry, .archive-description, .author-box, .comment-respond, .entry, .entry-comments, .entry-pings {
margin-bottom: 60px;
padding: 30px;
background:
#f0f0f0;
}