Tutorial: Ganhe $$$ criando seus próprios anúncios (Mobile)

  • Autor Autor Cicklow
  • Data de início Data de início
Este tópico foi traduzido automaticamente do espanhol. Ver original
Cicklow

Cicklow

Admin
Dseda
Verificado
Verificación en dos pasos activada
Suscripción a IA
Antes que perguntem, quanto se ganha com isso e demais... deixo esta captura de apenas 9 dias:
sin-t-tulo-5118bd4.png

O que fiz foi criar meus próprios anúncios e usar a api da AppNEXT, a qual nos fornece um JSON com anúncios de acordo com o país do usuário (Anúncio CPI)... desta forma montei: interstitial, banners, etc...

Este tutorial será sobre como criar: interstitial (é o que rende melhor)

Registro
Vamos a https://www.appnext.com/, e clicamos em "Join Now", completamos os dados que pedem e pronto.

Adicionar Nossos Apps (Site)
Menu Apps->Add New App->Website->Completamos os dados necessários e com isso obteremos dois id (um para Android e o outro para iOS):
Para obter os id vamos a: https://selfservice.appnext.com/Apps/Manage.aspx e veremos
id-511aac2.png

(Clique na engrenagem e selecione android e depois ios)
1-5118be2.png

2-5118be6.png


(NÃO é necessário ter um app Android ou iOS... AppNext chama de apps os sites, que é o que usaremos nós...)

Estes IDs guardaremos para mais tarde...

Interstitial
O que fiz foi montar algo parecido com:
Android
screenshot_2016-1...01-55-20-5118bf8.png


iOS
ios-style-dialog-...m-box-1--5118bec.jpg


E o resultado é:
screenshot_2016-1...01-58-29-5118bf6.png


Código Interstitial
Agora vamos programar em JavaScript... (Aqui deixo o CSS + o HTML que usei para ir montando o inter, já que ao colocá-lo dentro do JS deixa de se entender como está montado: Exemplo ForoBeta - Pastebin.com, é apenas para que vejam que parte modificar se quiserem fazer alguma mudança no design...)
Inserir CODE, HTML ou PHP:
/*v3 - 10/12/2016 */
var CualD = VerCualDisp(); //Vemos desde que dispositivo se accedio (solo se permite android/ios)
var viewport = document.querySelector('meta[name="viewport"]'); //seleccionamos el meta viewport
var meta = document.createElement('meta'); //creamos un elemento meta
var html = document.getElementsByTagName('html')[0];
var cantidadI = parseInt(DameCookie("nopINTER")); //verificamos la cookie llamada nopINTER, la cual nos dira cuantas veces se ha mostrado el interstitial
var MaxI = 2; //cantidad maxima a mostrar del interstitial
//VerCualDisp regresa 1=OS, 2=Android, 3=otro
//Si no es 3 y la cantidad mostrada es aun menor al maximo, llamamos la funcion de leer el json de appnext
if(CualD!=3 && cantidadI<MaxI){
    loadJSON();
}
//esta funcion es la encargada de mostrar el inter y se colocar la cookie...
//Ver http://pastebin.com/i2HaMUn7
function CargarInter(a,b,c){
        //Cookies + 1
    MeterCookie(cantidadI+1);
        //CSS del inter (ver http://pastebin.com/i2HaMUn7)
    var css = "<link rel=\"stylesheet\" type=\"text/css\" href=\"https://fonts.googleapis.com/css?family=Open+Sans\" /><style>.barrita{background-color:#eeeeee;height:25px;text-align:right;width:100%;position:absolute;top:0px;left:0px;z-index:2147483647;}.barrita a{font-family:'Open Sans';font-size:13px;padding:5px;text-decoration:none;color:#000}.fondo{z-index:147483600;position:fixed;background-color:#000;top:0px;left:0px;width:100%;height:100%;opacity:0.5;filter:alpha(opacity=50)}.alerta{width: 100%;height: 100%;position: fixed;top: 0px;left: 0px;z-index: 2147483647;font-family:'Open Sans',Verdana;}.clase0{z-index:2147483647;border-radius:3px;background:#eeeeee;width:90%;margin:auto;position:absolute;left:0;right:0;top:30%;border:1px solid #fff}.clase0 img{width:30px;height:30px;border-radius:5px;margin:4px 0px 0px 5%;float:left}.clase0 header{font-weight:bold;color:#3c3c3c;padding:10px 0px 0px 5%}.clase0 article{font-weight:500;margin:4px 5% 0px 5%;font-size:14px;color:#3c3c3c}.clase0 footer{float:left;width:100%;text-align:right;margin-bottom:10px;margin-left:-10px}.clase0 footer .boton{font-size:14px;color:#009688;font-weight:bold;margin:2%}.clase0 .nombreAPP{font-size:14px;float:left;font-weight:bold;color:#3c3c3c;margin:10px 0px 0px 1%;padding:0px}@media only screen and (min-width: 768px){.clase0 footer{margin-bottom:10px;margin-left:0px}}.clase1{z-index:2147483647;border-radius:8px;background:#e6e6e6;width:90%;margin:auto;position:absolute;left:0;right:0;top:30%;border:1px solid #fff}.clase1 img{width:30px;height:30px;border-radius:5px;margin:4px 0px 8px 5%;vertical-align:middle}.clase1 header{font-weight:bold;color:#4f4f4f;width:100%;text-align:center;padding-top:10px}.clase1 article{width:100%;text-align:center;font-size:14px;color:#3c3c3c}.clase1 footer{margin-bottom:10px;width:100%;text-align:center;border-top:solid 1px #dcdcdc}.clase1 footer .boton{font-size:14px;color:#6dacf3;font-weight:bold;padding:15px}.clase1 .nombreAPP{font-size:14px;font-weight:bold;color:#3c3c3c}@media only screen and (min-width: 768px){.clase1 footer{margin-bottom:10px;margin-left:0px}}</style>";
       //HTML del inter (ver http://pastebin.com/i2HaMUn7)
    var info = "<div class=\"barrita\"><a href=\"javascript:void(0);\" onclick=\"CerrarX();\">x</a></div><div class=\"fondo\"></div><div class=\"alerta\">    <div class=\"clase0\">        <header>Alerta</header>        <article>Para ver el contenido es necesario instalar esta aplicacion</article>        <img src=\""+c+"\">        <span class=\"nombreAPP\">"+b+"</span>        <footer><span class=\"boton\">OK</span></footer>    </div></div>";
    document.body.innerHTML += css + info;
    //si el dispositivo es ios, tenemos que cambiarle la clase, ya que clase0 es android y clase1 es ios
    if(CualD=="1"){
        document.getElementsByClassName("clase0")[0].className = "clase1";
    }
    //aca asignamos el evento click al inter, el cual al darle click nos abrira el market con la apps a instalar
    document.getElementsByClassName("alerta")[0].addEventListener('click', function () {
        SacarScroll(false);
        MeterCookie(1000);
                   top.location.href = a;
    }, false);
}
//funcion encargada de cerrar el inter
function CerrarX(){
    SacarScroll(false);
    document.getElementsByClassName("fondo")[0].style.display = "none";
    document.getElementsByClassName("alerta")[0].style.display = "none";
    document.getElementsByClassName("barrita")[0].style.display = "none";
};
//sacamos el scroll asi el user no se mueve
function SacarScroll(n) {
 if (n) {
    html.style['overflow'] = 'hidden';
    html.style['width'] = '100%';
    html.style['height'] = '100%';
    html.style['max-height'] = '100%';
    html.style['position'] = 'fixed';
    html.style['top'] = '0';
    html.style['left'] = '0';
 } else {
    html.style['overflow'] = 'initial';
    html.style['height'] = 'auto';
    html.style['width'] = 'auto';
    html.style['position'] = 'static';
    html.style['max-height'] = 'initial';
 };
};
//encargada de leer las cookies
function DameCookie(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');
    for(var i = 0; i <ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') {
            c = c.substring(1);
        };
        if (c.indexOf(name) == 0) {
            return c.substring(name.length,c.length);
        };
    };
    return "";
};
//funcion encargada de colocar el viewport ya que hay sitios webs que no lo tienen, y es necesario para los dispositivos mobiles
function setVP() {
    meta.name = 'viewport';
    meta.content = 'width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no';
    if (viewport) {
        viewport.parentNode.removeChild(viewport);
    }
    document.head.appendChild(meta);
};
//Vemos desde que dispositivo se accedio
function VerCualDisp(){
    var t=navigator.userAgent||navigator.vendor||window.opera;
    var cual = t.match(/Opera Mini/i)||t.match(/Windows/i)?"unknown":t.match(/iPad/i)||t.match(/iPhone/i)||t.match(/iPod/i)||t.match(/iOS/i)?"iOS":t.match(/Android/i)?"Android":"unknown";
    if(cual=="iOS") return 1;
    if(cual=="Android") return 2;
    return 3;
};
//Aca colocamos los id que appnext nos dio con nuestra apps
function VerCualID(){
    var iOS_ID = "ID_IOS";
    var Android_ID = "ID_ANDROID";
    if(CualD=="1") return iOS_ID;
    if(CualD=="2") return Android_ID;
    return;
}
//funcion encargada de colocar las cookies
function MeterCookie(cantidad){
        var cad = new Date();
        cad['setTime'](cad['getTime']() + (24 * 60 * 60 * 1000));
           var expira = '; expires=' + cad['toGMTString']();
        document['cookie'] = 'nopINTER=' + cantidad + expira + ';path=/';
}
//leemos el JSON que nos da appnext
function loadJSON() {
    var data_file = "https://global.appnext.com/offerWallApi.
aspx?pimp=1&tid=API&id="+VerCualID()+"&cnt=10&did=aaaaaaaa-bbbbcccc-
1111-222222220000";
    var http_request = new XMLHttpRequest();
    try {
        http_request = new XMLHttpRequest();
    } catch (e) {
        try {
            http_request = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                http_request = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                return false;
            };
        };
    };
    http_request.onreadystatechange = function() {
        if (http_request.readyState == 4) {
    //si no se obtuvo nada no mostramos nada
        if(http_request.responseText=="") return;
            var jsonObj = JSON.parse(http_request.responseText);
            if (jsonObj.apps.length > 0) {
    //sacamos un objeto al azar
                var entry = jsonObj.apps[Math.floor(Math.random() * jsonObj.apps.length)];
    //Esto es necesario para generar una impresion del inter y que aparezca en las estadistitcas
                new Image().src = entry.pixelImp;
    //Asignamos el viewport
        setVP();
    //Cargamos el inter
                CargarInter(entry.urlApp,entry.title,entry.urlImg);
            };
        };
    };
    http_request.open("GET", data_file, true);
    http_request.send();
};
Implementação
Para implementá-lo em nosso site só teremos que colocar o código anterior em um arquivo com extensão JS (exemplo inter.js) e colocá-lo desta forma:
Inserir CODE, HTML ou PHP:
<script src="http://www.misitio.com/inter.js"></script>
Sobre a AppNext
AppNext encontrei buscando outra forma de gerar dinheiro que não seja YuhuADS (o qual ou dava algum problema ou os ganhos por alguma instalação eram míseros [0,01E 😕], e como eles terceirizam (Usam outra empresa que lhes dá os ads, com eles se um app paga 2$ por CPI nos dão uma %, com AppNext ganho esses 2$ sem descontos) ganha-se mais trabalhando direto... não digo que seja ruim nem nada, só que obtive muito melhor resultado com meus próprios anúncios + AppNext e não com Yuhu...).
- NÃO permitem XXX... por isso usem apenas em sites de lazer, nada de XXX!
- Pagam todos os meses, se é registro novo pagam ao chegar a 100USD (depois do 1° pagamento o mínimo é 20USD), por paypal...
aaa-5118c14.png

(Pagamento de novembro, é quando comecei a gerar $$$, minha conta tenho há um ano mas jamais a tinha usado)
- Não é necessário programar nosso próprio anúncio, eles fornecem interstitial e banner de recomendação:
Widget:
3-5118c20.png

Interstitial:
4-5118c24.png

Mas consegui melhores resultados com o interstitial que montei do que com os deles... mas não tira que não rendam...
- Eles têm um PostBack sobre as instalações, por isso com um pouco de engenho podem montar sua própria empresa de anúncio ou um painel melhorado, exemplo:
aaaaasdsss-5118c30.png

(Meu próprio painel com jogos de azar e mulheres)
Como se vê inicialmente, meu tráfego principal é do México... por isso funciona bastante bem, o max CPI que consegui foram 6$ com uma instalação de um app para iOS sobre poker...
Notas finais
- NÃO é permitida a comercialização total ou parcial deste tutorial
- Download do JS: [JavaScript]ForoBeta Interstitial - Pastebin.com
- Mini Resumo
1- Geram o app na appnext, com isso obtêm os IDs
2- Vão ao link do paste bin, baixam esse arquivo e o salvam como "inter.js" => [JavaScript]ForoBeta Interstitial - Pastebin.com
3- Editam o inter.js colocando os ids que a appnext te deu
4- Sobem para algum servidor (seu host ou algum outro host externo (já que se usarem blogger precisarão subir para outro lado)
5- Colocam o código: <script src="http://www.server-donde-subi-el-js.com/inter.js"></script> no seu blog/site/fórum/etc...
6- pronto
- Para os que têm um host com PHP recomendo isto:
Salvar o pastebin como inter.php e no topo de tudo colocar:
Inserir CODE, HTML ou PHP:
header('Content-Type: application/javascript');
if(strstr(strtolower($_SERVER['HTTP_USER_AGENT']), "google")){
    die();
}
if($_COOKIE['nopINTER']=="1000") die("/* Die by COOKIE */");
Isso faz com que se o Google entrar em nosso site não carregamos o interstitial... E se o cookie for = 1000 também não (isso significa que o usuário clicou no inter)
- Explicação Básica: Ao colocar o JS no seu site, os usuários que acessarem de celulares/tablets verão um anúncio que cobre toda a tela (isso se chama interstitial), o qual diz que tem que instalar um aplicativo para ver o conteúdo (mas é dada a opção de fechar o anúncio), isso da instalação é o gancho para que o usuário instale o app e nós ganhemos $$$ por essa instalação...
Abraços!

Segundo li de outro usuário, ao que parece estão enviando alertas a respeito do texto usado no interstitial
Para ver o conteúdo é necessário instalar este aplicativo
Por isso fica sob sua responsabilidade mudá-lo ou deixá-lo... Podem usar:
  • Te recomendamos:
  • Já tem instalado ?
  • Aplicativo recomendado:
  • Em nosso site usamos:
  • etc...
 
Última edição:
Foi útil? Participe da conversa

Com sua conta grátis você pode responder, mandar mensagem privada ao autor e comprar com Saldo retido: o pagamento é liberado quando você recebe o combinado.

Leva 30 segundos · você volta a este tópico ao terminar
Caramba, você arrasou com o tutorial, sem dúvida uma grande ajuda, e acho que abre as portas para nós que não sabemos muito sobre monetização móvel.
 
Deus, você é demais. Muito obrigado hahaha 😛8:
 
Por falar nisso, onde se colocam os códigos que você menciona que usaremos depois?
O JS que você colocou no pastebin, onde se cola?
Só copiamos o código que você colocou em PHP e pronto? (Em um JS)
Ou tem que colocar algo mais, não entendi muito bem essa parte.
 
Que bom tutorial!
Sem dúvida vou salvar.
Obrigado por compartilhar. 🙂
 
Por falar nisso, onde se colocam os códigos que você menciona que usaremos depois?
O JS que você colocou no pastebin, onde se cola ele?
Só copiamos o código que você colocou em PHP e pronto? (Em um JS)
Ou tem que colocar algo mais, não entendi muito bem essa parte.

1- você gera os apps no appnext, com isso você obtém os IDs
2- você vai ao link do pastebin, baixa esse arquivo e salva como "inter.js"
3- você edita o inter.js colocando os IDs que o appnext te deu
4- você sobe para algum servidor (sua hospedagem ou alguma outra hospedagem externa (já que se você usa o blogger precisará subir em outro lugar)
5- você coloca o código: <script src="http://www.server-donde-subi-el-js.com/inter.js"></script> no seu blog/site/fórum/etc...
6- pronto
 
Excelente post
 
Obrigado pelo tutorial. Se não me engano, o appnext não tem sistema de referidos, já que eu gostaria de ser um seu.

Sou um novato, desculpe minha ignorância, para que usamos nosso site? Como se obtém o ganho?
 
Obrigado pelo tutorial. Se não me engano, o appnext não tem sistema de referidos, já que eu gostaria de ser um seu.

Sou um novato, desculpe minha ignorância, para que usamos nosso site? Como se obtém o ganho?

1- Não tem referidos e mesmo que tivesse não me interessa, só montei o tutorial! :encouragement:
2- Ao colocar o JS no seu site, os usuários que acessarem de celulares/tablets verão uma publicidade que cobre toda a tela (isso se chama interstitial), o qual diz que tem que instalar um aplicativo para ver o conteúdo (mas é dada a opção de fechar a publicidade), essa instalação é o gancho para que o usuário instale o app e nós ganhemos $$$ por essa instalação...
 
ei, desculpem, isso só funciona se eu for o criador de um app e quiser adicionar publicidade?
 
ei, desculpem, isso só funciona se eu for o criador de um app e quiser adicionar publicidade?

No appnext, um app é chamado de site ou um app de android ou ios... não é necessário ter um app (android/ios), apenas sites... o qual é por isso o tutorial
 
eu tenho um site que é Peliculas En HD Latino este site servirá?
com a questão de warez não saberia, eles só indicam que depende da lei do país... mas nada mais... o site serve = SIM, o warez permite = Já fica a critério do dono do site colocar ou não, contanto que não seja XXX
 
sim, não afeta em nada um domínio grátis... mas tenha em mente que sem tráfego móvel, não obterá rendimentos...
Ok muito obrigado, acabei de criar um tópico na seção Youtube, se você tiver conhecimento poderia me ajudar com isso? Muito obrigado
 
Link eliminado Não entendi esta parte

estou em Add New App e aparecem estas 3 opções, escolho a de Website?



Adicionar Nosso App (Site)
Menu Apps->Add New App->Completamos os dados necessários e com isso obteremos dois ids (um para Android e o outro para iOS):


QjJsNN8.jpg
 
Vou olhar amanhã obrigado:encouragement:
 
[MENTION=9679]cicklow[/MENTION] e com o conteúdo XXX tem alguma alternativa? sabe-se bem que nos dão esmola por milhares de visitas enquanto as empresas que terceirizam levam quase 70% do dinheiro.... Pensou em alguma alternativa para este conteúdo?
 
Voltar
Topo