The current PSD to WordPress project that I am currently working on has the following design for inner pages (click the image for bigger view):
In this article I share how I have set up the
- Print icon to trigger Print command
- Share icon to display social sharing options when hovered
- Font Resizing icon to display a tooltip having three buttons to control the text size of page's content.
in Genesis.
I always use Genesis Sample with this functions.php for setting up custom websites and the current project is no different.
I am going to use Genesis Sample as the active theme in this tutorial.
Screenshots of the output:
Step 1
Install and activate Genesis Printstyle Plus plugin. This plugin adds a printer-ready stylesheet. We can also add custom styles to hide unneeded elements in the printed version.
Step 2
Install and activate AddToAny plugin. We shall use the function provided by this plugin to display a universal share button.
Step 3
Save the code below as gamajo-font-sizer.js and upload it to 'js' directory (create if not existing) under your child theme directory.
Sample path: wp-content/themes/genesis-sample/js/gamajo-font-sizer.js
This file has the code by Gary Jones that will make
- any button having a class of increase to up the font-size of article.entry by 25%
- any button having a class of decrease to reduce the font-size of article.entry by 20%
- any button having a class of resetMe to reset the font-size to its default
To view the full content, please sign up for the membership.
Already a member? Log in below or here.
Awesome tutorial you have there mate.
I have thought more about your email you sent out the other day regarding membership.
I am thinking better not to have membership, but to monetise off of your tutorials, why not ask your audience who will like to sponsor each tutorial each week or so.
In other words, you could have a banner using one of the hooks, and simply add this tutorial was sponsored by XYZ Company, http://website-url.com, then finish off the video with a sponsor banner as well.
There is a plugin that will help you with this:
http://codecanyon.net/item/sponsor-my-articles/7257228
– Ciaran
That’s awesome but actually I’m looking for a way to get the sharing buttons like yours and like StudioPress blog ones. Can you please share them? Thank you!
You can get it from http://briangardner.com/genesis-simple-share/.
Thank you so, so much!!! You have no idea how many searches I made to get this sharing buttons…
Sridhar! I could hug you! Thank you for this!
Quick question: do you think the recent updates require changes? The coding all worked for me until this morning when, after updating Genesis and WordPress (in that order), the print button stopped working. The test site is crafter.highnotedesigns.com.