Skip to content

Instantly share code, notes, and snippets.

@robin-scott
Forked from mclanecreative/my-account.php
Last active May 2, 2016 22:38
Show Gist options
  • Save robin-scott/430f95ad50194bab504ed552083c925c to your computer and use it in GitHub Desktop.
Save robin-scott/430f95ad50194bab504ed552083c925c to your computer and use it in GitHub Desktop.
Adds Tabs to WooCommerce "My Account" page. Instructions: add my-account.php to your /woocommerce/myaccount/ folder. Next, add the CSS to your child theme's style.css file. 11/25/2015 - Added tab6 for Event Espresso WP User Integration. Next challenge is to include Sensei My Courses & Pippin's AffiliateWP on these tabs.
<?php
/**
* My Account page
*
* @author WooThemes
* @edited by McLane Creative
* @package WooCommerce/Templates
* @version 3.1.0
*/
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
wc_print_notices(); ?>
<div class="container">
<div class="wc-account-tab">
<ul class="tabs">
<li>
<input type="radio" checked name="tabs" id="tab1">
<label for="tab1">Dashboard</label>
<div id="tab-content1" class="tab-content animated fadeIn">
<p class="myaccount_user">
<?php
printf(
__( 'Hello <strong>%1$s</strong> (not %1$s? <a href="%2$s">Sign out</a>).', 'woocommerce' ) . ' ',
$current_user->display_name,
wp_logout_url( get_permalink( wc_get_page_id( 'myaccount' ) ) )
);
printf( __( 'From your account dashboard you can view your recent orders, manage your shipping and billing addresses and <a href="%s">edit your password and account details</a>.', 'woocommerce' ),
wc_customer_edit_account_url()
);
?>
</p>
<p><em>Do you have orders that aren't appearing here? </em>Contact us with your order number and we'll get them added to your account.</p>
<p><strong>Need Help? </strong><a href="#">Submit a Help Center ticket</a></p>
</div>
</li>
<li>
<input type="radio" name="tabs" id="tab2">
<label for="tab2">Downloads</label>
<div id="tab-content2" class="tab-content animated fadeIn">
<?php wc_get_template( 'myaccount/my-downloads.php' ); ?>
</div>
</li>
<li>
<input type="radio" name="tabs" id="tab3">
<label for="tab3">Previous Orders</label>
<div id="tab-content3" class="tab-content animated fadeIn">
<?php wc_get_template( 'myaccount/my-orders.php', array( 'order_count' => $order_count ) ); ?>
</div>
</li>
<li>
<input type="radio" name="tabs" id="tab4">
<label for="tab4">Free Stuff</label>
<div id="tab-content4" class="tab-content animated fadeIn">
<p><a href="https://theyouthcartel.com/youth-ministry-jobs/">Job Board</a></p>
<p><a href="https://theyouthcartel.com/newsletter/youtube-you-can-use-archives/">YouTube You Can Use archives</a></p> </div>
</li>
<li>
<input type="radio" name="tabs" id="tab5">
<label for="tab5">Courses</label>
<div id="tab-content5" class="tab-content animated fadeIn">
<p><em>Cool stuff coming soon</em></p>
</div>
</li>
<li>
<input type="radio" name="tabs" id="tab6">
<label for="tab6">Event Registrations</label>
<div id="tab-content6" class="tab-content animated fadeIn">
<?php echo do_shortcode('[ESPRESSO_MY_EVENTS]');?>
</div>
</li>
<li>
<input type="radio" name="tabs" id="tab7">
<label for="tab7">Affiliates</label>
<div id="tab-content7" class="tab-content animated fadeIn">
<p><h3>Refer people to us and make money!</h3></p>
<p>You can earn a 10% commission for every referral at The Youth Cartel online store. This includes physical products like books, digital downloads like curriculum or event media. It's super easy. Whenever you recommend a product of ours in an email or on social media, include your affiliate link. When someone clicks on that link and makes a purchase, you get paid!</p>
<p>Have questions or an idea you want to run by us? Email Adam McLane at [email protected]</p>
<hr>
<a href="/store/affiliates/">Go to your affiliate page</a>
</div>
</li>
<li>
<input type="radio" name="tabs" id="tab8">
<label for="tab8">Edit Details</label>
<div id="tab-content8" class="tab-content animated fadeIn">
<?php
printf(
__( 'Hello <strong>%1$s</strong> (not %1$s? <a href="%2$s">Sign out</a>).', 'woocommerce' ) . ' ',
$current_user->display_name,
wp_logout_url( get_permalink( wc_get_page_id( 'myaccount' ) ) )
);
printf( __( 'From your account dashboard you can view your recent orders, manage your shipping and billing addresses and <a href="%s">edit your password and account details</a>.', 'woocommerce' ),
wc_customer_edit_account_url()
);
?>
<br /><br /> <hr><br />
<?php wc_get_template( 'myaccount/my-address.php' ); ?>
</div>
</li>
</ul>
</div></div>
/*---- My Account Tabs ----------*/
.tabs {
width: 100%;
float: none;
list-style: none;
position: relative;
padding: 0;
margin-bottom: 5em;
}
.tabs li{
float: left;
}
.tabs label {
display: block;
padding: 10px 20px;
border-radius: 2px 2px 0 0;
color: #c60000;
font-size: 18px;
font-weight: normal;
background: rgba(255,255,255,0.2);
cursor: pointer;
position: relative;
top: 3px;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.tabs label:hover {
background: #e6b2b2;
top: 0;
}
[id^=tab]:checked + label {
background: #c60000;
color: white;
top: 0;
}
[id^=tab]:checked ~ [id^=tab-content] {
display: block;
}
.tab-content{
z-index: 2;
display: none;
text-align: left;
width: 100%;
line-height: 140%;
padding-top: 10px;
padding: 15px;
position: absolute;
left: 0;
box-sizing: border-box;
-webkit-animation-duration: 0.5s;
-o-animation-duration: 0.5s;
-moz-animation-duration: 0.5s;
animation-duration: 0.5s;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment