Skip to content

Instantly share code, notes, and snippets.

View itsdavidmorgan's full-sized avatar

David Morgan itsdavidmorgan

View GitHub Profile
@itsdavidmorgan
itsdavidmorgan / enqueue-gutenberg-editor-style.php
Created November 19, 2018 19:47
Enqueue Gutenberg Editor Stylesheet
/**
* Enqueue WordPress theme styles within Gutenberg.
*/
function organic_origin_gutenberg_styles() {
wp_enqueue_style( 'organic-origin-gutenberg', get_theme_file_uri( '/css/gutenberg.css' ), false, '1.0', 'all' );
}
add_action( 'enqueue_block_editor_assets', 'organic_origin_gutenberg_styles' );
@itsdavidmorgan
itsdavidmorgan / editor-heading-style.css
Created November 19, 2018 19:40
Gutenberg Editor Heading Style
.edit-post-visual-editor h2.editor-rich-text__tinymce {
font-family: Arial, sans-serif;
font-size: 32px;
font-weight: bold;
}
@itsdavidmorgan
itsdavidmorgan / basic-heading-style.css
Created November 19, 2018 19:37
Basic Heading Style
h2 {
font-family: Arial, sans-serif;
font-size: 32px;
font-weight: bold;
}
@itsdavidmorgan
itsdavidmorgan / gutenberg.css
Last active February 18, 2025 06:21
Back-end Styles For Gutenberg Content Editor
/************************************************
Gutenberg Editor
************************************************/
.block-editor .wp-block {
max-width: 760px;
}
.block-editor .wp-block[data-align="wide"] {
max-width: 920px;
}
@itsdavidmorgan
itsdavidmorgan / basic-block-styles.css
Last active February 12, 2025 12:00
WordPress Gutenberg Basic Block Styles
/************************************************
Audio Blocks
************************************************/
.wp-block-audio {
margin-left: 0px;
margin-right: 0px;
}
.wp-block-audio audio {
width: 100%;
@itsdavidmorgan
itsdavidmorgan / global-block-styles.css
Created November 19, 2018 18:29
Global Gutenberg Block Styles
div[class*="wp-block"],
figure[class*="wp-block"],
blockquote[class*="wp-block"] {
margin-top: 32px;
margin-bottom: 32px;
}
@itsdavidmorgan
itsdavidmorgan / wide-block-alignment-mobile.css
Created November 19, 2018 17:29
Gutenberg Conditional Block Alignment Styles For Mobile
@media screen and (max-width: 767px) {
.origin-sidebar-inactive.origin-singular .alignfull,
.origin-sidebar-inactive.origin-singular .alignwide {
width: calc(100% + 72px);
max-width: calc(100% + 72px);
margin-left: -36px;
left: auto;
}
}
@itsdavidmorgan
itsdavidmorgan / wide-block-alignment-styles.css
Last active November 19, 2018 17:17
Gutenberg Conditional Block Alignment Styles
/* Global Wide And Full Alignment Styles */
.alignwide, .alignfull {
position: relative;
width: 100%;
margin-left: 0px;
margin-right: 0px;
}
/* Full Block Alignment If Sidebar Is Not Present */
.origin-sidebar-inactive.origin-singular .alignfull {
width: 100vw;
@itsdavidmorgan
itsdavidmorgan / sidebar-body-class.php
Last active November 19, 2018 16:48
WordPress Body Class That Conditionally Displays If Sidebar Is Present
function organic_origin_body_class( $classes ) {
if ( is_active_sidebar( 'sidebar-1' ) && ! is_page_template( 'template-full.php' ) && ! class_exists( 'Woocommerce' ) || is_active_sidebar( 'sidebar-1' ) && ! is_page_template( 'template-full.php' ) && ( class_exists( 'Woocommerce' ) && ! is_woocommerce() ) || class_exists( 'Woocommerce' ) && is_woocommerce() && is_active_sidebar( 'shop-sidebar' ) ) {
$classes[] = 'origin-sidebar-active';
} else {
$classes[] = 'origin-sidebar-inactive';
}
}
add_action( 'body_class', 'organic_origin_body_class' );
@itsdavidmorgan
itsdavidmorgan / block-alignment-support.php
Last active November 19, 2018 16:49
WordPress Theme Support For Wide And Full Alignment Blocks
function organic_origin_setup() {
/*
* Enable support for wide alignment class for Gutenberg blocks.
*/
add_theme_support( 'align-wide' );
}
add_action( 'after_setup_theme', 'organic_origin_setup' );