How I add Genesis box to make money from their referal

Make money from referral program?

Who does not know affiliate program and who does not like to make money online from Affiliate program??


I’m kidding, and I believe almost anyone who work online, they have heard this kind of make money online.

Talking about making money online from affiliate program, the Genesis Framework is also having their affiliate program and teach us one of many other ways to make money with their affiliate program.

They way that they tell us is to put a box containing the advantages of Genesis framework and that box will be appear in almost every single blog post that we publish.

Here is the 3 simple steps in order to put Genesis box.

1. Create a simple php file and name it as logic enough, in this example we name is genesis-box.php

Put the following code:

<div id="genesis-box">
    <h3>Powered by the Genesis Framework</h3>
    <a href=""><img class="alignright" src="" alt="Genesis Framework" title="Genesis Framework" /></a>
    <p>Genesis empowers you to easily build amazing websites with WordPress. Whether you're a novice or advanced developer, Genesis provides the secure and search-engine-optimized foundation that takes WordPress to incredible places.</p>
    <p><a href="">It's that simple - start using Genesis now!</a></p>

Then put that genesis-box.php to our Genesis child theme directory.

2. Put the following code in the functions.php

/** Add Genesis Box on Single Posts */
add_action( 'genesis_after_post_content', 'include_genesis_box', 11 );
function include_genesis_box() {
    if ( is_single() )
    require( CHILD_DIR.'/genesis-box.php' );

3. And the last adding this code in the style.css of our Genesis child theme.

/* Genesis Box
------------------------------------------------------------ */

#genesis-box {
    background: #222;
    color: #fff;
    margin: 0 0 20px -30px;
    overflow: hidden;
    padding: 20px 20px 0;

#genesis-box h3 {
    color: #999;
    font-size: 18px;
    font-weight: normal;
    margin: 0 0 10px;
    padding: 0;
    text-transform: uppercase;

#genesis-box a,
#genesis-box a:visited {
    color: #fff;
    text-decoration: underline;

#genesis-box a:hover {
	text-decoration: none;

#genesis-box p {
    color: #fff;
    padding: 0 0 20px;

#genesis-box .alignright {
    border: 5px solid #999;
    float: right;
    margin: 0 0 5px 15px;

Then refresh one our blog post, woolaa, we will see that Genesis box located in the bottom of our blog post.

We might need to change the aff. link in the genesis-box.php and the box looks and feels in the styel.css we just inserted

Hire me for your online business solution

Smart Bali Website

I'm a lucky husband and happy father with a cute daughter who work at home as frelance webmaster, I love to build amazing websites and help client succeed. Weather you have small, medium even large project, I am always interested to work with you.

Contact me today and let's boost your online business