Skip to content

Instantly share code, notes, and snippets.

@patric-boehner
patric-boehner / ReadMe.md
Last active August 28, 2015 11:38
Mobile Menu Toggle State Icon Change - Genesis Framework

#Modify the responsive-menu.js in the Genesis Framework to adjust mobile menu icon when the menu is open or closed


This snipit is for modifying the default responsive menu jquery that is included with most of the Geneis Frameworks child themes. The modification adds a class to so that the mobile menu icon can be changed when the mobile menu is expanded, replacing the normal hamburger icon with an X icon (or whatever icon you choose). The code is also modified to remove that class when the browser is less than a certin size so that the hamburger icon is shown and the closed state icon doesn't remain when the window is resized on a desktop.

I am using the icomoon icon font in my styling.

Normaly the jQuery adds the class "menu-icon" to submenu items so their icon has a toggle state. I have used this class and added it to the "responsive-menu-icon" class when the .toggleClass attribute is triggered. This results in a sturcture that looks like this:

@patric-boehner
patric-boehner / ReadMe.markdown
Last active August 29, 2015 14:23
Tag Cloud Widget Customization

#Customizing WordPress Tag Cloud

This snippet is for creating a function that customizes the parameters of the built in tag cloud in wordpress.

The main change I wanted to make was to adjust the size of the tags to remove any change in size due to popularity of use, potentially also change the order based on name rather then count. I also included snippets for displaying the tagcloud as a list and/or based on an individual taxonomy.

See the comment in the code for more detail.

For additional customizable permeates, see the codex links under References.

@patric-boehner
patric-boehner / Readme.md
Last active August 29, 2015 14:23
Adjust Header When Scrolled

#Adjust Header When Scrolled


This snippet comes from Bill Erickson. This jQuery script adds a class you can use to style the header based on the scroll position on the page. The script's markup is written around the wordpress and the genesis framework and may need to be modified to work with your markup.

The markup in the js is using elements from the Genesis Framework, so adjust to your situation.

This code adds a class of “shrink” to the header, which you can use to change the header. It also adds a div class="bumper" which you can set to the height of the old header. Without this, you’d see the site’s content jump up when you position: fixed; the header.

@patric-boehner
patric-boehner / ReadMe.md
Last active August 29, 2015 14:27
Add Social Icons

#Add Social Icons and Customize Contact Fields in Admin User Profile


This snippet is for manualy creating and adding social icons in the Genesis Framework and pull the links to the social media accounts from custom contact link fields in the admin user profile.

This snippet related to the Genesis Framework, though the majority of the code can be adjusted to work outside of genesis, and the code for modifying the User profile_fields is not Genesis specific.

I wanted a simple way to manualy add in social media links within the websites and particulerly in the primary menu (which menu is targeted can be changed). This would allow the social icons to be adaptive and collaps and expand within the menu. I also wanted the links to those social media accounts to be easily updatable so I customized the admin User contact feilds and draw the links from their. As written, the code would need to be manualy updated to add additional social media links (though this could be changed and the unused links

@patric-boehner
patric-boehner / ReadMe.md
Last active August 29, 2015 14:27
Add Social Share Buttons to Posts

#Add Social Share Buttons to Posts Without JS


This snippit is for manualy creating social share buttons, particulerly for use within the entry footer of the Genesis Framework. The hope was to build a simple, customizable and lightweight social share buttons that would meet my needs without adding a lot of file size or unecessary js/jquery files. For icons I am using FontAwsome via icomoon, see the class markup.

In order to make the Pinterest share button work I need to grab the link to the first image in the post. Their might be a better way to do this but it was the best solution I could find at the time. This is the first function to run and then is passed to the second function via .pb_find_image_url(). If your not using Pinterest you can remove this function.

I set this file up as a seprate php file in my child theme's 'include' folder and call it up in the 'single.php' file

@patric-boehner
patric-boehner / ReadMe.md
Last active November 13, 2015 06:13
Wordpress cache busting while in local development with debug on.

Cache Busting While Debug Is On

A quick way to bust cache of scripts and style sheets in wordpress when debug is on (something you would most likely only be doing when in local development). Sets a new version number every time the page is releated based on the current Unix timestamp, otherwise return a set static number you can manualy update.

Example result in DEBUG mode:

<script type="text/javascript" src="http://localhost/wordpress.../js/scroll-to-top.js?ver=1447394696"></script>

Example result with DEBUG off:

@patric-boehner
patric-boehner / ReadMe.md
Last active March 2, 2016 09:33
Inline SVG with fallback

#Inline SVG handled via PHP with png background image fallback

In looking at all the methods for implementing svg with fallback I just wanted to make note of this method. I'm not sure if i will ultimately use it but i wanted to make note of it so i can revisit.

Their are multiple ways of adding your svg files. For the purposes of my testing i was interested in directly inlining the svg. I was interested in a way of adding the svg that reduced requests and allowed for direct manipulation of the svg file through css. Plus i could have php do all the work using file_get_contents().

The inline ```

@patric-boehner
patric-boehner / ReadMe.md
Last active March 12, 2016 08:40
diglloydTools IntegrityChecker - Command Line

diglloydTools IntegrityChecker - Command Line

diglloydTools four commands depending on what tool i want to use:

  1. disktester
  2. mt
  3. ic
  4. dgl

ic is for Integrity Checker, the primary tool i use for managing the integrity of archived client work.

@patric-boehner
patric-boehner / custom-functions.php
Created June 19, 2016 00:16
Override the footer in Hello Genesis child theme.
<?php
//* Custom functions to modify child theme
//* Remove the original custom footer
remove_action( 'genesis_footer', 'hello_pro_custom_footer' );
//* Customize the entire footer
remove_action( 'genesis_footer', 'genesis_do_footer' );
add_action( 'genesis_footer', 'sp_custom_footer' );
@patric-boehner
patric-boehner / widgets.php
Created June 24, 2016 00:44
Conditional Widget Width - From Genesis Theme Maker Pro
<?php
/*
* A copy of the widget count and dynamic widget class for setting width from
* Genesis Framework child theme from Maker Pro
* http://demo.jtgrauke.com/maker/
*/
//* Setup widget counts
function maker_count_widgets( $id ) {