Affiliate

Create a vertical hover accordion text ad

�

This is a short tutorial about how to create a vertical accordion text ad expanding on hover. We will use HTML, CSS and a small hoveraccordion jQuery plugin from matznermatzner.de. The final result will look very similar with the accordion text ads used recently by Google adsense. This solution is very suitable if you want to increase the number of ads without using to much space. Our example is a 300x300px ad block with three headings. The first heading is open by default on load. Hovering another heading expands that section and closes the others.

�

The plugin

Let's start by downloading the jQuery plugin. (.zip) . Unzip it, grab the jquery.hoveraccordion.min file from the js folder and upload it to your server. If you don't already use jquery you will need the jquery.min file too, or better use the Google HostedLibraries.

So, call the jQuery library and the hoveraccordion plugin by adding these two lines of code between the tags.

�

 				  
				  
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.hoveraccordion.min.js"></script>

* modify accordingly the path to the jquery.hoveraccordion.min.js file

�

CSS code

Include the css code between the tags.

<style type="text/css">
     
#textad {
	position:relative;		
	font-family: Verdana, Geneva, sans-serif;
	font-size: 100% !important;
	margin: 0;
	padding: 0;
	width: 300px;
	list-style-type: none;
	background-color: #FFFFFF;
	color: #000000;
	line-height: 100% !important;
	border: 1px solid #E5E5E5; 
        display: inline-block !important;
        visibility: visible !important;
	}

#textad a {
	display: block;
	font-weight: normal;
	text-decoration: none;
    }

#textad ul {
	position:relative;
	overflow: hidden;
	margin: 0;
	padding: 0;
	width: 95%;
    }

#textad li {
	margin: 0;
	padding: 0;
	list-style-type: none;
	border-bottom: 1px solid #E5E5E5;
	padding-left: 10px;
	}

#textad li a {
	width: 95%;
	display: block;
	color: #378de5 ;
	height: 57px;
	line-height: 50px; 
	font-size:16px;
	}

      #textad li a:hover {
	  text-decoration: underline;
	  }

      #textad li li {
            border-bottom:none !important;
            padding: 0 0 0 15px; 
            height: 127px; 
			width: 62%;
			font-size:14px; 
        }

        .link  {
		color:#999999 !important;
		height: 20px !important;
		line-height: 14px !important;
		padding-left:20px;
		font-size:14px !important;
		background-image:url(http://static.nobelcom.com/images/nobelcom/global/nobelcom.ico);
		background-repeat:no-repeat;
		}
        .link:hover{
		text-decoration: underline !important;
				}
		
		.adbutton {
		position:absolute;
		top:40px;
		right:10px;
	    border:none !important;
	    background-color:#378de5;
		-webkit-border-radius:5px;
		-moz-border-radius:5px;
		border-radius:5px;
		text-indent:0;
		display:inline-block;
		color:#ffffff !important;
		font-size:30px;
		font-weight:bold !important;
		font-style:normal;
		height:70px !important;
		line-height:70px !important;
		width:70px !important;
		text-decoration:none;
		text-align:center;
		text-shadow:1px 1px 0px #528ecc;
}
.adbutton:hover {
		background-color:#79bbff;
		text-decoration:none !important;
}
    </style>

�

HTML code

In order to work, this jQuery plugin requires an unordered list with two levels. Include this HTML code on your page where you want the ad to appear.

					
					<div id="ad">
    
    <ul id="textad">
        <li><a href="http://www.nobelcom.com" rel="nofollow" target="_blank">International Phone cards</a>
            <ul>
                <li><a href="http://www.nobelcom.com" class="link" rel="nofollow" target="_blank">www.NobelCom.com</a> </br>LOW Rates!High Quality,Instant Pin, 15 Years of Calling Cards Knowledge.
					                </li>
									<a href="http://www.nobelcom.com" class="button" rel="nofollow" target="_blank">?</a>
            </ul>
        </li>
        <li><a href="http://www.enjoyprepaid.com" rel="nofollow" target="_blank">International Calling Plans </a>
            <ul>
                <li><a href="http://www.enjoyprepaid.com" class="link" rel="nofollow" target="_blank">www.EnjoyPrepaid.com</a> </br>International calling plans offer a convenient alternative to traditional prepaid calling cards.
                    
                </li>
				<a href="http://www.enjoyprepaid.com" class="button" rel="nofollow" target="_blank">?</a>
            </ul>
        </li>
        <li><a href="http://www.nobelcom.com/nobel-app.html" rel="nofollow" target="_blank">NobelApp for International calls</a>
            <ul>
                <li><a href="http://www.nobelcom.com/nobel-app.html" class="link" rel="nofollow" target="_blank">www.NobelCom.com/Nobel-App</a></br>Try Nobel App now and get 5 minutes FREE of charge! The App for international calls.
                </li>
				<a href="http://www.nobelcom.com/nobel-app.html" class="button" rel="nofollow" target="_blank">?</a>
            </ul>
        </li>
        		
    </ul>

</div>

jQuery code

To use the plugin, we will call it by referencing the id of the ul tag and we will use some custom options.

�


<script type="text/javascript">
	$(document).ready(function () {
		$('#textad').hoverAccordion({
		activateItem: '1',
		speed: 'fast'
		});
	});
</script>

That's it. Enjoy!

�

Demo

International Phone cards
- www.NobelCom.com
  LOW Rates!High Quality,Instant Pin, 15 Years of Calling Cards Knowledge.
International Calling Plans
- www.EnjoyPrepaid.com
  International calling plans offer a convenient alternative to traditional prepaid calling cards.
NobelApp for International calls
- www.NobelCom.com/Nobel-App
  Try Nobel App now and get 5 minutes FREE of charge! The App for international calls.

NobelApp - The smartphone app for international calls

NobelApp is our new app for iPhone & Android devices. It can be used with any of�NobelCom.com phone cards and EnjoyPrepaid.com calling plans or with NobelApp Credit.

NobelApp Credit is a new and distinct product perfectly suited for the app. Customers may purchase $10 to $150 NobelApp Credits and use it to place international calls, send text messages, as well as recharge prepaid cell phones in over 270 mobile networks worldwide.

So, now you can also advertise the NobelApp Credit and earn commissions from every sale you refer.

Get the NobelApp search boxes and banners from your affiliate account.

NobelApp's features :

Low and competitive rates, everywhere in the world.
All-around connectivity - connect through Wifi/3G or access numbers
24/7 live in-app support
Call history
International cell phone recharge for more than 270 mobile networks
International text messaging

Worldwide Calls
made easy

Find Rates

More info on NobelApp: http://www.nobelcom.com/nobel-app.html

Official Nobel Coupons & Promo codes

This is the official Nobel Ltd coupon page. Here you will find all the active coupons and promotions for our websites:

Jump to
NobelCom.com Coupons
EnjoyPrepaid.com Coupons

* Nobel coupons do not work in conjunction with other promotional discounts or bonuses.

1. NobelCom Coupons

Nobelcom Promo Code:	5NOBEL
Description:	Use this NobelCom coupon during checkout to get 5% credit bonus on all phone cards and NobelApp credit orders (does not apply for top ups or NobelApp Mustang and Elephant deals ).
Expiration date:	January 30th, 2019.

Recently expired

Nobelcom Promo Code:	FALL2016
Description:	Use this NobelCom coupon during checkout to get 15% DISCOUNT on all phone cards and NobelApp credit orders (does not apply for top ups or NobelApp Mustang and Elephant deals ). Available only for initial orders.
Expired:	November 27th, 2016.

Nobelcom Promo Code:	SUMM3R
Description:	Use this NobelCom coupon during checkout to get 10% DISCOUNT* on all phone cards and NobelApp credit orders (does not apply for top ups or NobelApp Mustang and Elephant deals ). *New customers only.
Expired:	July 24th, 2016.

Nobelcom Promo Code:	VDAY2016
Description:	Use this NobelCom coupon during checkout to get 14% DISCOUNT on all phone cards and NobelApp credit orders (does not apply for top ups or NobelApp Mustang and Elephant deals ).
Expired:	February 14th, 2016.

Nobelcom Promo Code:	15GIFT
Description:	Use this NobelCom coupon during checkout to get 15% DISCOUNT on all phone cards and NobelApp credit orders (does not apply for top ups or NobelApp Mustang and Elephant deals ).
Expired:	January 4th, 2016.

Nobelcom Promo Code:	15FALL
Description:	Use this NobelCom coupon during checkout to get 15% DISCOUNT on all phone cards and NobelApp Credit orders (does not apply for top ups, bundles or NobelApp Mustang and Elephant deals ).
Expired:	October 4th, 2015.

Nobelcom Promo Code:	BDAY2015
Description:	Use this NobelCom coupon during checkout to get 15% discount on all phone cards and NobelApp credit orders (does not apply for top ups or NobelApp Mustang and Elephant deals ).
Expired:	August 31st, 2015

Nobelcom Promo Code:	MORE15
Description:	15% More credit on all NobelCom phone cards and NobelApp credit orders ( does not apply for top ups or NobelApp Mustang and Elephant deals ).
Expired:	15 May 2015.

Nobelcom Promo Code:	2TIER
Description:	Use this NobelCom coupon during checkout to get : 10% credit bonus for orders smaller than $40 15% credit bonus for orders equal or greater than $40 Applies for all phone cards and NobelApp credit orders ( does not apply for top ups or NobelApp Mustang and Elephant deals ).
Expired:	15 Apr 2015.

Promo Code:	10SNOW
Description:	Use this NobelCom promo code during checkout to get 10% DISCOUNT on every phone card and NobelApp credit orders ( does not apply for top ups or NobelApp Mustang and Elephant deals ) . Works for all orders - new, recurrent and recharges.
Expired:	31 Dec 2014.

2. Enjoy Prepaid Coupons

Enjoy Prepaid Promo Code:	ENJOY5
Description:	Use this Enjoy Prepaid coupon during checkout to get 5% bonus credit on all calling plans and NobelApp credit orders ( does not apply for top ups ).
Expiration date:	January 30th, 2019.

Recently expired

Enjoy Prepaid Promo Code:	FALL2016
Description:	Use this Enjoy Prepaid coupon during checkout to get 15% DISCOUNT on all calling plans and NobelApp credit orders ( does not apply for top ups ). Available only for initial orders.
Expired:	November 27th, 2016.

Enjoy Prepaid Promo Code:	SUMM3R
Description:	Use this Enjoy Prepaid coupon during checkout to get 10% DISCOUNT* on all calling plans and NobelApp credit orders ( does not apply for top ups ). *New customers only.
Expired:	July 24th, 2016.

Enjoy Prepaid Promo Code:	VDAY2016
Description:	Use this Enjoy Prepaid coupon during checkout to get 14% DISCOUNT on all calling plans and NobelApp credit orders ( does not apply for top ups ).
Expired:	February 14th, 2016.

Enjoy Prepaid Promo Code:	15GIFT
Description:	Use this Enjoy Prepaid coupon during checkout to get 15% DISCOUNT on all calling plans and NobelApp credit orders ( does not apply for top ups ).
Expired:	January 4th, 2016.

Enjoy Prepaid Promo Code:	15FALL
Description:	Use this Enjoy Prepaid coupon during checkout to get 15% DISCOUNT on all calling plans and NobelApp credit orders (does not apply for top ups, bundles or Mustang and Elephant deals).
Expired:	October 4th, 2015.

Enjoy Prepaid Promo Code:	BDAY2015
Description:	Use this Enjoy Prepaid coupon during checkout to get 15% bonus credit on all calling plans and NobelApp credit orders ( does not apply for top ups ).
Expired:	31st August 2015.

Enjoy Prepaid Promo Code:	MORE15
Description:	15% More credit on all EnjoyPrepaid calling plans and NobelApp credit orders ( does not apply for top ups ).
Expired:	15 May 2015.

EnjoyPrepaid Promo Code:	2TIER
Description:	Use this Enjoy Prepaid coupon during checkout to get : 10% credit bonus for orders smaller than $40 15% credit bonus for orders equal or greater than $40 Applies for all calling plans and NobelApp credit orders ( does not apply for top ups ).
Expired:	15 Apr 2015.

Promo Code:	10SNOW
Description:	Use this Enjoy Prepaid promo code during checkout to get 10% DISCOUNT on every calling card and NobelApp credit orders ( does not apply to top ups ). Works for all orders - new, recurrent and recharges.
Expired:	31 Dec 2014.

3. NobelCom.co.uk Coupons

Recently expired

Promo Code:	NCUK5
Description:	Get 5% more credit on all phone cards orders.
Expired:	31 Dec 2014.

4. NobelPhoneCards.eu Coupons

Recently expired

Promo Code:	NPC5
Description:	Get 5% more credit on all phone cards orders.
Expired:	31 Dec 2014.

4 Ways to Promote Nobel without a website

One of the questions that our new affiliate partners frequently ask is: How can I promote Nobel if I don't have a website? Even though many affiliate marketers use their website as their main promotion channel, there are other effective ways to market our products.

So if you are new to affiliate marketing, you may want to tap in to the underestimated potential of the following 4 promotional channels:

1. Email

You can promote Nobel products through email marketing. You can begin by sending a short email to your friends or family. Explain how our calling cards work and how they can use them to save money on their international calls. You can also add you affiliate link in your email signature making each email an opportunity to close a sale. If anybody makes a purchase after clicking on your affiliate link, you automatically get a commission.

2. Social Media

Did you try our service and you were happy with it? Then why not spread the word? Use your Twitter, Facebook or Google+ profile to recommend Nobel calling cards. Always link with your affiliate id so you can make sure you get credited for your referrals.

3. Online Forums & Communities

Identify forums, discussion boards or online communities that are relevant for Nobel products. These can be related to travel, expat, ethnic, telecom or voip for example. Try to participate actively in each online community by engaging in discussions and providing useful input. Also, if the case, you can take advantage of your signature in which you can post your affiliate link. Be sure to always check their policy to verify if they allow affiliate links.

4. Article marketing

You can use article directories like Hubapages or Squidoo to write about topics related to international calling or anything that could relate to calling cards. Always focus on creating useful content for your visitors and include your affiliate links in the right context.

Any of the above marketing methods requires no investment and minimum effort. If you need help on how to start earning with Nobel's Affiliate Program you can always get in touch with our Affiliate Support Team here.

Make money with your website

Promote Nobel on your website and make money when your visitors buy from us. Just place one of our banners or links on your website, blog or newsletter and you'll earn cash on every sale made through your ads. We provide a 90 day cookie tracking, 24/7 sales reports and monthly payments through PayPal or Wire.

Join Nobel Affiliates and get paid for the lifetime of your referred customers.

Revenue Share Plan

20-30% for new customers
10-12% for recharges

Join Now

Check out our FAQ section or get in touch if you have any questions.

News

1. NobelCom Coupons

2. Enjoy Prepaid Coupons

3. NobelCom.co.uk Coupons

4. NobelPhoneCards.eu Coupons

1. Email

2. Social Media

3. Online Forums & Communities

4. Article marketing