Skip to content

Instantly share code, notes, and snippets.

<?php
add_action( 'wp_head', 'custom_genesis_page_builder_styles' );
/**
* Echo the necessary "Full Page Width" styles into the head of the page.
* Credit for the following CSS goes to the developer of the "Genesis Dambuster"
* Plugin as this CSS is an edited version of that Plugin's full-width.css file.
*/
function custom_genesis_page_builder_styles() {
echo '
<style type="text/css">
@cobaltapps
cobaltapps / Genesis-Dynamik Website Builder "Twitter Bootstrap" Column Class Styles
Created January 22, 2014 18:50
The are the Genesis "Twitter Bootstrap" Column Class Styles found in Dynamik Website Builder as of DWB version 1.4.2
/* Column Classes
--------------------------------------------- */
.five-sixths,
.four-sixths,
.four-fifths,
.one-fifth,
.one-fourth,
.one-half,
.one-sixth,
@cobaltapps
cobaltapps / genesis-xhtml-to-html-five-markup.css
Created October 17, 2019 15:18
A simple list of Genesis framework XHTML to HTML5 markup conversions.
#wrap => .site-container
#header => .site-header
#title-area => .title-area
#title => .site-title
#description => .site-description
#nav => .nav-primary
#subnav => .nav-secondary
#inner => .site-inner
#content-sidebar-wrap => .content-sidebar-wrap
#content => .content
@cobaltapps
cobaltapps / DWB Responsive Logo Image Trick
Last active August 28, 2019 01:10
This CSS code is for a DWB screencast where I show how to make your Logo Image responsive, without the need for multiple images.
/* 5th @media query trigger point */
.site-header {
min-height: 80px;
}
.header-image .site-header .wrap .title-area {
width: 320px;
height: 80px;
background-size: 320px 80px;
}
@cobaltapps
cobaltapps / dynamik-custom-fonts-example.php
Created May 13, 2019 19:22
Example font-face code for screencast on how to add custom fonts to Dynamik Website Builder.
<style>
@font-face {
font-family: 'Rubik-Regular';
src: url('<?php echo get_stylesheet_directory_uri(); ?>/fonts/Rubik-Regular.eot?#iefix') format('embedded-opentype'), url('<?php echo get_stylesheet_directory_uri(); ?>/fonts/Rubik-Regular.woff') format('woff'), url('<?php echo get_stylesheet_directory_uri(); ?>/fonts/Rubik-Regular.ttf') format('truetype'), url('<?php echo get_stylesheet_directory_uri(); ?>/fonts/Rubik-Regular.svg#Rubik-Regular') format('svg');
font-weight: normal;
font-style: normal;
}
</style>
@cobaltapps
cobaltapps / genesis-force-full-width-singular-layouts
Created May 2, 2018 17:55
Force full-width-content layout on single pages and posts, but not "blog" page.
add_action( 'get_header', 'custom_child_full_width_singular_layout');
// Force full-width-content layout on single pages and posts, but not "blog" page.
function custom_child_full_width_singular_layout() {
if ( ( is_page() || is_single() ) && ! is_page( 'blog' ) )
add_filter( 'genesis_pre_get_option_site_layout', '__genesis_return_full_width_content' );
}
/* (Primary Navigation) Vertical Toggle Menu Styles: */
.responsive-primary-menu-container {
background: #333333;
border-bottom: 2px solid #DDDDDD;
width: 100%;
padding: 12px 0;
overflow: hidden;
cursor: pointer;
-webkit-box-sizing: border-box;
box-sizing: border-box;
@cobaltapps
cobaltapps / dynamik-fixed-header-min-width-filter
Created January 23, 2017 11:50
Sets a custom minimum width for the fixed header functionality to remain in effect.
/*
* Sets a custom minimum width for the fixed header functionality to remain in effect.
* Paste this into your Custom Functions and then adjust the '920' value to your specific needs.
*/
add_filter( 'dynamik_fixed_header_min_width', 'custom_fixed_header_min_width' );
function custom_fixed_header_min_width() {
return '920';
}
@cobaltapps
cobaltapps / freelancer-disable-icons.php
Created September 13, 2017 14:27
Define the following constant through your Child Theme to disable the enqueueing of the Freelancer Icon styles.
// Disable the Freelancer custom icon set styles.
define( 'FREELANCER_ICONS_DISABLE', true );
@cobaltapps
cobaltapps / gulp-setup.sh
Last active March 18, 2019 15:36
Script used on a theme by theme bases to setup the Node/Gulp environment, after the initial "first-time" setup script has been run.
#!/bin/sh
## Once the "gulp-first-time-setup" script has been run (see gulp-readme.md) you should run THIS version from that point on
## Copy/paste this line into the Console to make this script executable: chmod +x gulp-setup.sh
## Copy/paste this line into the Console to execute this script: ./gulp-setup.sh
## Initialize NPM
npm init --yes