patric-boehner

#Customize and display links to previous and next post, from a single post

---

This snippet is for displaying and customizing the links to previous and next posts, for single post entries within the Genesis Framework.

Normally the links to the previous and next post are displayed in the entry footer as the title of the next and previous posts. I wanted to customize the function to swap the link order so that the newest article was accessible from the link on the left and the previous article was accessible form the link on the right, to better navigate posts in an ascending order. I also wanted to add the text "Previous Post" and "next Post" above the linked post titles for better clarification. See the comment in the code for more detail.

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

patric-boehner

#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

#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

#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

#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

#Customize WordPress Gallery HTML Output

---

This snippet is for modifying the shortcode and output for Wordpress's built in gallery function HTML. Particularly to modify the stucture for use with the Salvattore & Featherlight jquery to creat a masonary gallery with lightbox as none of the wordpress plugins meet my need. The source of the function is a little out of date compared with the current function Wordpress is using to output the galleries, but meets my needs as I am stripping out most of the markup. Plus I can't seem to get the shortcode_atts assigned in the function to work but thats not a deal breaker. I've updated the php with my new function. Still not sure if this is the best way to go about this but it works well for my need.

I've also added a second if statment to create another modified gallery to create a homepage slideshow using the wordpress agllery function and add suport for the Responsiveslides Jquery plugin.

I am using a conditional statment to check if the

patric-boehner

#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

#Bucket Properties for Versioning and Lifecycle

###Versioning

Turn on versioning. This allows us to preserve, reterieve and restore versions of each backup file. This is important incase a backup file is ever overwritten with a bad or corupted file.

###Lifecycle

We will create a lifecycle rule tp ultimelty deal with deleating old backups, since the user we have assigned to updraft can no longer autoamticaly delate old backups based on the plugins settings. For this example I set the limit to 30 days.

patric-boehner

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

#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 ```