What are the capabilities of customization for memberships within Nanacast?

When it comes to customization of sales pages and thank-you pages, these are completely open since these can be self-hosted. If you're looking to customize those, we highly recommend you consider using your own sales page on your own domain which gives you more control over the style and template of how your sales page looks. Generate Nanacast forms buttons and links code from the left menu under Create > forms buttons and links and place it on your own site.

As Nanacast is currently a hosted-only solution for membership content pages, there are limitations and requirements for the customization possible, but the hosted system supports HTML, CSS, and JavaScript. There are also some remote-hosted solutions available now and more on the way, which we'll cover in a moment.

NOTE: Please see the following article for documentation on CSS customization for Nanacast Embedded forms, Secure Credit Card Checkout Pages, Nanacast-hosted Thank You Pages, Nanacast Membership Login Pages, and Membership Content pages:

First, for the hosted membership content, there are a couple of approaches for customization.

1) You can do a custom login URL per membership, which you would configure on the Edit Listing page of the membership (Step 1 of the Create Membership Wizard). At the Viral Premium level, you can add a CNAME to mask the membership URL with your own domain if desired (the CNAME applies to custom membership login and content pages, not sales pages or thank-you pages, but if you used example.com as your self-hosted sales and thank-you pages, you could use a subdomain like members.example.com for the CNAME.)

2) You can do a general custom membership login, which you would configure under My Account > Profile & Preferences. At the Viral Premium level, you can also use a CNAME to mask the membership login and content pages, and the customization options you set here will apply to any memberships that you elect to show under Purchases & Subscriptions, and when subscribers use this login URL, they will only see offers they've purchased from you, and not from any other Nanacast publisher.

The following customization options are available at the Viral Premium level:

• Using a custom header graphic (above the navigation bar - generally looks best if 850px wide or less
• Setting a custom membership background color
• Adding custom HTML to the top of each content page in a membership (under the navigation bar)
• Adding custom HTML above the login box on the login form
• Adding head tag HTML code for the login page (useful for CSS and other scripts)
• Adding custom HTML below the login box on the login form (Viral Premium only)
• Hiding the link to login to full Nanacast.com account on the login page (Viral Premium only)
• Adding custom HTML to the top of the Purchases/Subscription overview page within the Membership area (Viral Premium only)
• Adding custom HTML to the bottom of the Purchases/Subscription overview page within the Membership area (Viral Premium only)
• Adding head tag HTML code for the Purchases/Subscription overview page within the Membership area (useful for CSS and other scripts)
• Hiding the outer fieldset box for the Purchases/Subscription overview page within the Membership area (Viral Premium only)
• Adding custom HTML to the top of the Episodes/Downloads Listing page within the membership area (Viral Premium only)
• Adding custom HTML to the bottom of the Episodes/Downloads Listing page within the membership area (Viral Premium only)
• Adding head tag HTML code for the Episodes/Downloads Listing page within the membership area (useful for CSS and other scripts) (Viral Premium only)
• Showing "Catalog" Link in Top Menu Bar for Your Other Products
• Showing a link to an individual membership episode/page in the top menu bar (for memberships only - this is useful if you use an episode/page as an index or default page for the membership and provide navigation to it in the top menu bar -- this option is selected from within the edit membership page for the specific episode.)

Additionally, you can provide personalization for your clients and create custom navigation menus within episode content and to other membership episodes via the "Basic Tags You Can Use Within Your Episode Content" section of the Edit Membership Page of an episode... click the link called "Click Here to Link to Other Episodes, Broadcasts and Other Memberships >>" and you'll find documentation on how to accomplish this.

This would be useful for placing links to important pages on the side of the page instead of top and bottom. Here's a screen-shot of a demo membership showing use of basic css menu and layout and using our tagging system to create custom navigation for a membership:

This example is fairly basic and some of our users have done much more amazing stuff but it should give an idea of what is possible. By default Nanacast builds a menu for memberships but you can use episode url tags to create your own navigation like we did in this example. Also you can set an episode to be the default episode which makes it the first thing a person sees when they login to a membership so that way you can have a page with your custom menu on it that they can use to navigate from the start instead of the default overview one that Nanacast builds automatically.

At the bottom of this post, we've included some some sample HTML/CSS code from one of the pages so you can see how it's structured. These pages also have embedded videos in them and use Amazon s3 hosting with Nanacast's built in s3 security layers and cloaking which are employed using the episode file url tag as the source for the video.

Using all of these options, many of our publishers have been able to create membership areas that are quite unique.

We also offer some remote features that allow you to use it with existing sites or third party scripts. For example we provide an API that you can use to integrate remotely with any existing site or third party script on your own. We also provide a wordpress plugin that can be used with your existing or custom developed wordpress theme.

We are also soon to offer a new remote membership control option that allows you to protect an entire remote site and control 100% of the way it looks with just HTML and PHP - this add-on is not available yet but will be soon and requires no programming, no script install, and no database since it's all remotely managed from the Nanacast side... but the actual content would be accessed and hosted on your own domain.

NOTE: While the following example can be used as a springboard for building your own content, pasting the entire contents below into an Episode content box will not produce a functional result. Basic understanding of HTML is recommended, and you'll need to replace the episode_url tags with the correct episode URLs found by clicking "Click Here to Link to Other Episodes, Broadcasts and Other Memberships >>" on and episode page, and follow the instructions there.

Example: SEO training page from the Example membership

===========================================================================================================

Code that goes in the "Head Tag HTML Code (memberships only)" box of the Episode:

<link href="../../tplayer/tplayervidmem/css/ADPMask.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="../../tplayer/tplayervidmem/scripts/tplayer.js"></script>
<style type="text/css">
<!--

body {
    font: 13px Arial, Helvetica, sans-serif;
    background: #fff;
    margin: 0;
    padding: 0;
    text-align: center;
    color: #000000;
    background-color: #000000;
}

#container {
    width: 800px;
    margin: 0 auto;
    text-align: left;
}

h1 {
    font-size: 28px;
}

h2 {
    font-size: 20px;
    font-weight: bold;
    text-decoration: underline;
    color: #960606;
}

h3 {
    font-size: 16px;
    font-weight: bold;
    margin: 2em 0px 0px;
}
.align-center { text-align: center; }

/************************************************** 
*
* Ppage Frames
*

***************************************************/

/*        =frame 1
***************************************************/

#header-1 {
    background: url(http://media.nanacast.com/images/hello/frame1_top_800w.gif) no-repeat left top;
    height: 16px;
    width: 820px;
    margin: 0px;
    padding: 0px;
    overflow: hidden;
}

#mainContent-1 {
    padding: 0 30px;
    background: #FFFFFF url(http://media.nanacast.com/images/hello/frame1_mid_800w.gif) repeat-y;
    margin: 0px;
    overflow: hidden;
}

#footer-1 {
    background: url(http://media.nanacast.com/images/hello/frame1_bottom_800w.gif) no-repeat left top;
    margin: 0px;
    height: 16px;
    width: 820px;
    padding-top: 0;
    overflow: hidden;
}

/************************************************** 
*
* Vertical Nav Boxes
*

***************************************************/

/*        =vert Nav Box 1
***************************************************/

.content_navBox1_margin {
    margin-left: 250px;

}

.vert_navBox1_wrapper {
    margin: 10px 15px 10px 0px;
    padding: 0px;
    float: left;
    width: 212px;
}

.vert_navBar1_top {
    background: url(http://media.nanacast.com/images/hello/vert_navBox_1_top.png) no-repeat left top;
    margin: 0px;
    padding: 0px;
    height: 20px;
    width: 212px;
    overflow: hidden;
}

.vert_navBox1_content {
    background: url(http://media.nanacast.com/images/hello/vert_navBox_1_mid.png) repeat-y;
    margin: 0px;
    padding: 0px 21px;
    width: 170px;
    overflow: hidden;
}

.vert_navBox1_bottom {
    background: url(http://media.nanacast.com/images/hello/vert_navBox_1_bottom.png) no-repeat left top;
    margin: 0px;
    padding: 0px;
    height: 20px;
    width: 212px;
    overflow: hidden;
}

.vert_navBox1_content ul {
    margin: 0px;
    padding: 0px;
}

.vert_navBox1_content li {
    background: url(http://media.nanacast.com/images/hello/bullet_arrowBlue.png) no-repeat 0px 1px;
    list-style: none;    margin: 8px 0px 0px;
    padding: 0px 0px 7px 22px;
    border-bottom: 1px solid #e1e1e1;
}

.vert_navBox1_content li a {
    text-decoration: none;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #000;
}

.vert_navBox1_content li a:hover, .vert_navBox1_content li a:active {
    text-decoration: underline;
}

</style>

Code that goes in the "Episode Content" box of the Episode:

<p class="tag" id="linkstart2-episode_file_url">{episode_file_url_22554}</p>
            <p class="tag" id="linkstart2-width">900</p>
            <p class="tag" id="linkstart2-height">500</p>
<div id="container">
  <div id="header-1"></div> 
 <!-- end #header -->
  <div id="mainContent-1">
    <div class="vert_navBox1_wrapper">
      <div class="vert_navBar1_top"></div>
      <div class="vert_navBox1_content">
        <ul class="style1">
          <li><a href="{episode_url_22549}">Domains and Hosting </a></li>
          <li><a href="{episode_url_22550}">Wordpress Website Creation and Design 1 </a></li>
          <li><a href="{episode_url_22551}">Wordpress Website Creation and Design 2 </a></li>
          <li><a href="{episode_url_22552}">Professional Image</a></li>
          <li><a href="{episode_url_22553}">Online Video Promotion </a></li>
          <li><a href="{episode_url_22554}">Search Engine Optimization </a></li>
          <li><a href="{episode_url_22555}">Online Networking 1 Blogging </a></li>
          <li><a href="{episode_url_22556}">Online Networking 2 Facebook </a></li>
          <li><a href="{episode_url_22557}">Online Networking 3 Social Bookmarking </a></li>
          <li><a href="{episode_url_22558}">Online Networking 4 Squidoo </a></li>
          <li><a href="{episode_url_22559}">Online Networking 5 Twitter </a></li>
          <li><a href="{episode_url_22560}">Lead Capture and Management </a></li>
          <li><a href="{episode_url_22561}">Network Marketing Lead Generation </a></li>
          <li><a href="{episode_url_22548}">The Campaign Recruiting system </a></li>
        </ul>
      </div>
      <div class="vert_navBox1_bottom"></div>
    </div>
    <p align="center"><a href="javascript:void(0)" onclick="DFS.adv.initLayer('tplayervideo2',0,2);">
<img src="http://media.nanacast.com/images/hello/5.gif" alt="SEO" width="350" height="263" /></a></p>
    <p class="style3">Module 5 &ndash; Search Engine Optimization</p>
    <p class="style5">Lesson Content:</p>
    <p class="style3">This module will cover the essentials of search engine optimization (SEO). 
The instructor will cover the 2 main areas of SEO; on page optimization and off page optimization.</p>
    <ul>
      <li class="style3">SEO: Titles, Anchor Text<br />
          <br />
      </li>
      <li class="style3">Link Popularity: SEO 2.0 Matrix<br />
          <br />
      </li>
      <li class="style3">Things to Remember<br />
          <br />
      Use the search engine optimization matrix below as guide while studying and implementing the concepts covered in the module 5 video:<br />
        <br />
        <img src="http://funnel2.s3.amazonaws.com/memtemplate/linkpop.jpg" alt="Link popularity matrix" width="500" height="491" /><br />
        <br />
        <span class="style6">Note:</span> 
If you already have this covered in your current online presence feel free to move on to one of the other modules. 
Or even <a href="{episode_url_10184}">Jump right into our advanced lead generation training</a> 
which will assist you with building your own business. <br />
        <br />
        Don't skip the basics though if you do not already have a professional presence on the web. 
The initial video training series will show you how to easily set up and establish a credible representation of your business online.<br />
<br />
       Again if you're ready for the advanced stuff ... 
you can jump to the bonus training on <a href="{episode_url_10184}">
how to generate leads to build a network marketing business.<br /><br /></a>
</li>

    </ul>

  </div>

  <!-- end #mainContent -->

  <div id="footer-1"> </div>

  <!-- end #footer -->

  <!-- end #container -->

</div>

============================================================================================================