Skip to content

Instantly share code, notes, and snippets.

@zephyrmike
zephyrmike / comparison-tables.html
Last active April 23, 2024 15:34
GenerateBlocks Comparison Tables
<!-- wp:generateblocks/container {"uniqueId":"24ce87be","gradientDirection":120,"gradientColorOne":"var(\u002d\u002dgrey)","gradientColorTwo":"var(\u002d\u002dwhite)","gradientColorStopTwo":50,"bgOptions":{"selector":"pseudo-element","opacity":0.3,"overlay":false,"position":"top 140px right -80px","size":"400px","repeat":"no-repeat","attachment":""},"isDynamic":true,"blockVersion":4,"position":"relative","overflowX":"hidden","overflowXTablet":"hidden","overflowXMobile":"hidden","overflowY":"hidden","overflowYTablet":"hidden","overflowYMobile":"hidden","spacing":{"paddingTop":"8rem","paddingLeft":"2rem","paddingRight":"2rem","paddingBottom":"8rem"},"metadata":{"name":"Desktop \u0026 Tablet Version"},"hideOnMobile":true} -->
<!-- wp:generateblocks/container {"uniqueId":"1d296f19","isDynamic":true,"blockVersion":4,"flexDirection":"column","sizing":{"widthTablet":"100%"},"useGlobalMaxWidth":true,"spacing":{"marginRight":"auto","marginLeft":"auto","marginTop":""},"globalStyleId":"primary"} -->
<!-- wp:generatebloc
@zephyrmike
zephyrmike / portfolio.htnl
Created January 1, 2024 20:55
GenerateBlocks Pro Portfolio Template
<!-- wp:generateblocks/container {"uniqueId":"0fc6b28d","anchor":"portfolio","backgroundColor":"var(\u002d\u002dbase-3)","isDynamic":true,"blockVersion":4,"sizing":{"height":"","maxWidth":""},"globalStyleLabel":"Outer Container"} -->
<!-- wp:generateblocks/container {"uniqueId":"9e36eb19","isDynamic":true,"blockVersion":4,"sizing":{"maxWidth":""},"useGlobalMaxWidth":true,"spacing":{"paddingTop":"120px","paddingRight":"30px","paddingBottom":"120px","paddingLeft":"30px","marginRight":"auto","marginLeft":"auto"},"globalStyleLabel":"Main Padding"} -->
<!-- wp:generateblocks/headline {"uniqueId":"ec2f8859","element":"h1","blockVersion":3,"display":"inline-flex","spacing":{"paddingBottom":"4px"},"borders":{"borderBottomWidth":"1px","borderBottomStyle":"solid","borderBottomColor":"var(\u002d\u002dcontrast-3)"}} -->
<h1 class="gb-headline gb-headline-ec2f8859 gb-headline-text">Latest projects</h1>
<!-- /wp:generateblocks/headline -->
<!-- wp:generateblocks/container {"uniqueId":"702ba69e","isDynamic":true,"blockVers
@zephyrmike
zephyrmike / siab-css
Last active August 30, 2023 15:03
SIAB
/* remove bottom margin on last paragraph or list in container */
.gb-container p:last-child:last-of-type,
.gb-container ul:last-child:last-of-type {
margin-bottom: 0px;
}
/* footer navigation block spacing */
.wp-block-navigation li {
line-height: 1em;
}
@zephyrmike
zephyrmike / gp-nav-effects
Created August 26, 2023 17:59
GeneratePress Navigation Effects
/* rising underline on hover */
@media (min-width: 769px) {
.main-navigation .main-nav ul li > a {
box-shadow: 0 -4px 0px #0088ff inset;
padding-bottom: 2px;
transition: all 300ms ease-in-out;
margin: 0 30px;
}
}
@zephyrmike
zephyrmike / random-bg-images.php
Created August 16, 2023 22:55
Responsive Hero Background Images That Randomly Change
<?php
// random choice of image from ID array
$att_id = array(#, #, #, #, #, #);
$rnd_att_id = $att_id[array_rand($att_id)];
$full_img_url = wp_get_attachment_image_src($rnd_att_id, 'full');
$md_lg_img_url = wp_get_attachment_image_src($rnd_att_id, 'medium_large');
// preload our random image if the exist
if ( !empty( $full_img_url ) && !empty( $md_lg_img_url ) ) {
echo '<link rel="preload" as="image" href="' . esc_url($full_img_url[0]) . '" type="image/jpeg" media="(min-width: 768px)">';
@zephyrmike
zephyrmike / gpgb-snippets
Last active August 25, 2023 13:21
PHP snippets for GeneretePress and GenerateBlocks
// dynamic titles for search results
// use shortcode [search_title]
add_shortcode('search_title',function(){
return sprintf(
/* translators: 1: Search query name */
__( 'Search Results for: %s', 'generatepress' ),
'<span class="search-query">' . get_search_query() . '</span>'
);
});
@zephyrmike
zephyrmike / featured-images
Created September 4, 2022 15:40
GenerateBlocks dynamic featured image sizing
@zephyrmike
zephyrmike / gp-gb-buttons
Last active January 19, 2024 10:38
Button classes for GeneratePress and GenerateBlocks
/* Use the classes below to style all the GeneratePress and GenerateBlocks buttons */
/* GeneratePress button */
.button,
.button:visited,
.button:focus {
/* add styles here */
}
@zephyrmike
zephyrmike / podia-button.css
Last active July 12, 2022 23:11
Styling a Podia embed button using the WP html block and css
/*
1. get the link embed code for your Podia product
2. add class="button" to the Podia embed code
3. paste the code inside a WordPress html block
4. edit the button css below to style your button
*/
.button {
background-color: #111111;
color: #ffffff;
@zephyrmike
zephyrmike / ng-form.css
Last active March 20, 2022 16:05
Newsletter Glue Form Styling
/* remove margin below form */
.ngl-form {
margin-bottom: 0px !important;
}
/* ng container spacing in and out */
.wp-block-newsletterglue-callout {
padding-top: 40px !important;
margin: 40px auto;
}