There are some who say that the Frugal Theme although easy to mod and create unique layouts without any need for codes, there will be some cool things that cannot be done to the Theme like what they can do with the Thesis Theme. I too felt the same way initially but no more. What can be added to the Thesis Theme can also be added to the Frugal Theme if you know the codes to add and where to add them.
Feeling a little bit itchy today with nothing constructive write, I decided again to fiddle around with my Frugal theme here. Today, I decided I will want to add an author bio box at the end of each post. Like what you see in many Thesis Theme, especially those who survives on guest posts or blogs with more than one authors.
Searched for and grabbed a bunch of codes for this purpose that was written for the Thesis Theme. Made some small alterations so it will work with the Frugal Theme and frankly, I only needed to alter where to hook the box.
However, I made some further changes to suit my individual preferences. These are original codes,if you are interested in trying.
Copy And Paste these into your customs functions php file
OR
You can also paste them into your Frugal Theme – Feature Options – Custom Functions 1 or 2. If you do it this way, you must omit the last line, add_action('frugal_hook_after_post_banner', 'author_box'); BUT in you must select the ‘frugal_hook_after_post_banner’ option below the form window. Also you must remember to set ‘Execute PHP in this code to YES.
I prefer the first method.
IMPORTANT – Messing with your customs functions file might break your theme and you might not be able to access your dashboard to correct the mess. When that happens, you will have to use your FTP client to access the file and make corrections. So remember what you add and where you added it. A good practice will be top add a comment at the beginning and at the end of the codes.
function author_box() { if (is_single()) { ?> <div class="postauthor"> < ?php echo get_avatar( get_the_author_id() , 100 ); ?> <h4>Article by <a href="<?php the_author_url(); ?>"> < ?php the_author_firstname(); ?> < ?php the_author_lastname(); ?></a></h4> <p>< ?php the_author_description(); ?></p> <p class="hlight">< ?php the_author_firstname(); ?> has written <span>< ?php the_author_posts(); ?></span> awesome articles for us.</p> </div> <div id="similar"> <h3>You May Also Be Interested In...</h3><br /> < ?php related_posts(); ?> </div> <div id="rightcol"> <div id="subscribe"> <h3>Subscribe Now</h3> <p>If you enjoyed this post, you will definitely enjoy our others. Subscribe to the feed to get instantly updated for those awesome posts soon to come.</p> <ul> <li><a href="FEED_URL_HERE">Subscribe to our RSS Feed</a></li> <li><a href="FEED_URL_HERE">Subscribe for Email Updates</a></li> </ul> </div> <div id="custom"> <p>Put whatever you want here!</p> </div> </div> < ?php } } add_action('frugal_hook_after_post_banner', 'author_box'); Copy and paste these in your customs css file
/* AUTHOR BOX */
.custom #comments { clear: both; }
.postauthor { background: #F5F5F5; border-top: 1px solid #e1e1e0; border-bottom: 1px solid #e1e1e0; overflow: hidden; padding: 1.5em; }
.postauthor img { border: 5px solid #e2dede; float: left; margin-right: 1.5em; }
.postauthor h4 { color: #666; font-size: 2em; margin-bottom: 5px; }
.postauthor p { color: #515151; font-size: 13px; margin-bottom: 12px; }
.postauthor p.hlight { font-size: 11px; text-transform: uppercase; }
.postauthor p.hlight span { color: #CB3131; font-size: 13px; font-style: italic; font-weight: bold; letter-spacing: 0.8px; }
/* BOXES */
#similar h3, #rightcol h3 { font-size: 2.2em; letter-spacing: normal; padding-top: 10px; }
#similar { float: left; width: 50%; }
#similar p { margin-bottom: 5px; padding: 5px 2.5em 10px 10px; }
#similar a { font-size: 1.1em; border-bottom:none; line-height: 1.5em; }
#similar a:hover { border: 0; }
#similar h3 { padding-left: 10px; }
#similar span.date { color: #888; letter-spacing: 1px; text-transform: uppercase; }
#rightcol { float: right; width: 50%; }
#rightcol p { font-size: 11px; line-height: 1.5em; text-align:center; padding: 10px 2.5em 10px 0; }
#rightcol h3 { padding: 0; }
#rightcol ul { list-style-position: inside; list-style-type: square; margin-left: 1em; }
#rightcol ul a { border-bottom: none font-size: 12px; }
#rightcol ul a:hover { border: 0; }
#rightcol li { margin-bottom: 10px; }
#subscribe { background: #FFFBCC; border: 1px solid #E6DB55; float: right; margin: 5px 10px 0 10px; padding: 10px 0 0 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
#custom { background: #E4F2FD; border: 1px solid #C6D9E9; float: right; margin: 15px; padding: 10px 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
These css codes will style your bio box to look like this:
To have the Author box show your name and bio automatically, you must go your Profile page and add them in. Whatever name and biographical info you add in your profile page will appear automatically in the Author Bio Box.
Hope Frugal Theme users will find this useful.
SUBSCRIBER'S BONUS DOWNLOAD - 5 photoshop action scripts.
Add your opinions and comments for Add An Author Bio Box In Frugal Theme
Related posts:
- Add 3 Column Widgetized Footer For The Frugal Theme The Frugal Theme, despite all it versatility, has certain limits when you really want to do something a little but more special to it. In all fairness, you can already add many things to many different locations using the 4 custom widgets but when it comes to having a...
- Using Cufon Fonts In The Frugal Theme Cufon fonts are generated javascript fonts which you can use in your WordPress Theme even if these fonts are not deemed as web safe. Which means, if other computers do not carry these font type, they will still be able to see the fonts as it is and not...
- The Frugal Theme Review Update: This blog is now fully powered by the latest version of Frugal Finally got a chance to take a good look at the Frugal Theme. For those who have not heard of it, the Frugal Theme is another premium WordPress Theme that sells for $87 Single User and $167...
- Powered By Frugal This theme is now powered by Frugal. After using Thesis for quite sometime now, I feel it is time for some new adventures with WordPress Themes. What better then, than to use the copy of Frugal Theme that I won some time ago. I had plans to use the...
- The Frugal Theme Framework I have been looking at the Frugal Theme from time to time to keep up with it’s development as it seems to be to be quite an awesome WordPress Theme framework. The Frugal Theme, developed by Eric Hamm, started off as a basic free Theme but improved over time...
Posts
