Genesis Sample Starter

Tag: |   Category:

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;
}
Copyright © 2024 Siam Naulak.
magnifiercrossmenu