Tutorial: Crear plugin WordPress: forzar clic en publicidad para mostrar contenido

  • Autor Autor kanikase
  • Fecha de inicio Fecha de inicio

kanikase

Préstamo
Ómicron
Programador
Verificación en dos pasos activada
Verificado por Whatsapp
¡Ha verificado su Paypal!
AVISO 2017
Este post fue creado en enero de 2016 (hace más de 1 año), en internet se necesita innovar, no sé si esto aún funcione...
Como sea, NO USAR CON ADSENSE.



Hola de nuevo betas, en este nuevo tutorial les enseñaré a crear un plugin WordPress, lo que hace es que se fuerza al usuario a hacer click en la publicidad para mostrar contenido, como un link de descarga, el plugin es sencillo, así que casi todo el código se pondrá en el mismo archivo del plugin para no hacer muchos archivos.
Empecemos con el tutorial:
Primero avisar, que no se explicarán todos los archivos para no hacer demasiado largo el tutorial, solo el php principal y el que obtiene el link

Lo primero que tenemos que hacer es crear una carpeta con el nombre del plugin, en mi caso es AdsKanikase (nos yo muy creativo XD):

Ahora en la carpeta, vamos a crear los archivos necesarios, un archivo tiene que tener el mismo nombre, y la extensión php:, en mi caso sería así:
  1. admin.php
  2. AdsKanikase.php
  3. get_link.php
  4. scripts.js

Ahora, abrimos el archivo del plugin php, en mi caso AdsKanikase.php, y en él, pegamos esto:
PHP:
<?php
/*
Plugin Name: AdsKanikase
Description: Plugin para forzar click en la publicidad antes de mostrar un enlace
Version: 1.0
Author: kanikase
Author URI: http://kanikase.com
*/
?>

Ahí ponemos todos los datos, primero el nombre del plugin (el mismo que el de la carpeta y el archivo), segundo la descripción, tercero la versión, cuarto el autor, y el último, la url del autor del plugin.

Ya lo guardan, con eso ya se puede subir el plugin (comprimiendo la carpeta en .zip) y activarlo, pero aún no hace nada.

El código lo pondré por partes
Seguimos editando ese archivo, pero ahora pegamos este código:
PHP:
// obtenemos las configuraciones
$adskanikase_configs = get_option('adskanikase_configs');

// funcion para encriptar los datos que estan en base64
function encrypt_content($string, $key){
    return base64_encode(mcrypt_encrypt(MCRYPT_RIJNDAEL_256, md5($key), $string, MCRYPT_MODE_CBC, md5(md5($key))));
}

// la funcion que hara que se cambie el shortcode por la publicidad en los posts
function adskanikase_shortcode($atts, $content) {
    // agregamos la variable de las configuraciones
    global $adskanikase_configs;
    // datos que vamos a poner en el div como data-id
    $arr = array(
        'url'   => $content,
        'image' => $atts['image'],
        'text' => $atts['text'],
    );
    // los datos en json, encriptados
    $data = str_replace('+', '-', encrypt_content(json_encode($arr), $adskanikase_configs['key']));
    return <<<HTML
<div id="adsClick" data-id="{$data}">
    <span class="texto">{$adskanikase_configs['texto']}</span>
    <div id="pubpub">
        {$adskanikase_configs['codigo']}
    </div>
</div>
HTML;
}
// agregamos el shortcode
add_shortcode($adskanikase_configs['shortcode'], 'adskanikase_shortcode');

Ahí está comentado, pero lo explicaré un poco más. Lo primero que hacemos es obtener las configuraciones, es lo primero que hacemos porque las vamos a usar desde el principio, luego está la función de encriptar, con ella encriptaremos los datos que vamos a poner en el código de fuente de la página, en este caso, son los datos de la url, la imagen y el texto, que están en json, para que los usuarios no puedan obtener nada desde el código de fuente. Por último es la función que agrega el código de los posts, dependiendo de lo que se haya configurado en el plugin y en el shortcode.

Ya que está eso listo, ahora ponemos este código:
PHP:
<?php
// agregar javascript
function add_js_adskanikase() {
    $datos = array('ajaxurl' => plugins_url('get_link.php', __FILE__));
    wp_enqueue_script('AdsKanikase', plugins_url('scripts.js', __FILE__));
    wp_localize_script('AdsKanikase', 'AdsKanikase', $datos);
}
add_action('wp_footer', 'add_js_adskanikase');
function add_css_adskanikase() {
?>
<style type="text/css">
    #adsClick {
        width: 100%;
        box-sizing: border-box;
        margin: 15px 0;
        padding: 10px;
        border: 1px solid #EEE;
        text-align: center;
        border-radius: 4px;
    }
    #adsClick .texto {
        font-family: monospace;
        color: #333;
        display: block;
        font-style: italic;
    }
    #adsClick #pubpub {
        margin: 15px auto;
    }
</style>
<?php
}
add_action('wp_head', 'add_css_adskanikase');
Lo único que hace es agregar el archivo scripts.js y algo de css a la web.

Ahora vamos a agregar esto, todo es para las configuraciones y el panel de control:
PHP:
// las configurciones del panel
function panel_adskanikase() {
    add_menu_page('Panel de control AdsKanikase', 'AdsKanikase', 'manage_options', 'adskanikase', 'ads_panel');
}
add_action('admin_menu', 'panel_adskanikase');

// para imprimir el panel
function ads_panel() {
    global $adskanikase_configs;
    include_once __DIR__ . '/admin.php';
}

/*-- AGREGAR/ELIMINAR OPCIONES --*/
function agregar_opciones() {
    // configuraciones al activar el plugin
    $data = json_decode('{"codigo":"CÓDIGO DE PUBLICIDAD","codigoHTML":"<center><a href=\"%LINK%\" target=\"_blank\" title=\"%TEXT%\"><img src=\"%IMAGE%\"><\/a><\/center>","key":"kanikase","texto":"Click de la publicidad para descargar","shortcode":"adskanikase"}', true);
    add_option('adskanikase_configs', $data);
}
register_activation_hook(__FILE__, 'agregar_opciones');
// eliminar configuraciones al desactivar el plugin
function eliminar_opciones() {
    delete_option('adskanikase_configs');
}
register_deactivation_hook(__FILE__, 'eliminar_opciones');

/*-- GUARDAR CONFIGURACIONES AJAX --*/
function adskanikase_config() {
    // coprobamos que ningún campo de texto esté vacío, si alguno está vacio, mostramos el error y terminamos todo con wp_die
    foreach($_POST as $key) {
        if(empty($key)){
            echo '<div id="message" class="error"><p><strong>Error!</strong> tienes que llenar todos los campos!</p></div>';
            wp_die();
        }
    }
    // creamos un arreglo con las configuraciones, con los datos del formulario
    $configs = array(
        'codigo'     => limpiar($_POST['codigo']),
        'codigoHTML' => limpiar($_POST['codigoHTML']),
        'key'        => limpiar($_POST['key']),
        'texto'      => limpiar($_POST['texto']),
        'shortcode'  => limpiar($_POST['shortcode']),
    );
    // si se guardan las configuraciones, mostramos el mensaje de exito, y si no se guardan mostramos mensaje de error
    if (update_option('adskanikase_configs', $configs))
        echo '<div id="message" class="updated"><p><strong>Éxito!</strong> los cambios han sido guardados</p></div>';
    else
        echo '<div id="message" class="error"><p><strong>Error!</strong> los cambios no han sido guardados</p></div>';
    wp_die();
}
add_action('wp_ajax_config_adskanikase', 'adskanikase_config');
La función limpiar elimina los \.
También está comentado lo más importante, pero lo explicaré:
Las primeras dos funciones son las encargadas de todo lo que tiene que ver con el panel, todas las configuraciones, como el título, el nombre de la página, etc.

En las dos funciones siguientes, es dónde, primero al activar el plugin, agregamos configuraciones, y al desactivarlo las eliminamos.
La siguiente función es para guardar los cambios, ahí primero comprobamos que ningún campo de texto, esté vació, si alguno estuviera vacío se muestra un mensaje de error, luego se termina de ejecutar todo, para evitar que se guarden las configuraciones, si ningún campo de texto está vació, lo que hacemos ahora es, crear un arreglo con las configuraciones que son:
  1. El código HTML de la publicidad
  2. El código HTML base para mostrar en los posts
  3. La key para desencriptar
  4. El texto arriba de la publicidad
  5. El nombre del shortcode

Ya con eso lo pueden guardar, y ahora abren el archivo get_link.php, y en él pegan el siguiente código:
PHP:
<?php
// obtenemos el directorio de la instalacion
$dir = explode('wp-', __FILE__);
// incluimos el archivo wp-load.php
require_once $dir[0].'wp-load.php';
// obtenemos las configuraciones
$adskanikase_configs = get_option('adskanikase_configs');
// funcion para desencriptar
function decrypt_content($encrypted, $key){
    return rtrim(mcrypt_decrypt(MCRYPT_RIJNDAEL_256, md5($key), base64_decode($encrypted), MCRYPT_MODE_CBC, md5(md5($key))), "\0");
}
// funcion para reemplazar %LIK% y lo demás, por lo que se haya puesto en el shortcode
function edit_HTML($HTML, $JSON) {
    return str_replace(array('%LINK%', '%IMAGE%', '%TEXT%'), array($JSON['url'], $JSON['image'], $JSON['text']), $HTML);
}
// cuando se abre por ajax
if (!empty($_POST) && $_POST['action']=='decrypt') {
    // en el codigo encriptado, reemplazamos los - por +
    $data = str_replace('-', '+', $_POST['id']);
    // desencriptamos el codigo a json
    $json = decrypt_content($data, $adskanikase_configs['key']);
    // convertimos el json a un array
    $json = json_decode($json, true);
    // mostramos el HTML
    echo edit_HTML($adskanikase_configs['codigoHTML'], $json);
}
?>

Es el que hace mucho del trabajo, en el post, al hacer click en el anuncio, enviamos por ajax los datos de data-id que están en el div, esto es un json encriptado (para que no se obtenga el link del código fuente XD), cuando lo recibe el archivo get_link.php, en el archivo ese, primero incluimos el archivo wp-load.php, de WordPress, este lo vamos a usar para poder usar la función get_option, la necesitamos porque así obtenemos las configuraciones del plugin, donde están la key para desencriptar, y el código HTML base para mostrar en el post al hacer click en la publicidad.

Ese archivo así ya lo guardamos, no necesita nada más.

Y pues es todo en el tutorial, como dije en el principio, no explicaré todo para no hacer demasiado largo el tutorial, pero abajo dejaré la descarga del plugin.

CAPTURAS









USO

Se puede usar de muchas formas, para mostrar el contenido que querramos, incluso para videos, en ese caso yo lo configuraría así para YouTube:






Ya dependiendo de ustedes sabrá cómo usarlo 🙂

DESCARGAR PLUGIN COMPLETO

Espero que les sirva.
Saludos.
 
Última edición:
Muchas gracias por el aporte!!! :encouragement:
 
Tremendo tuto

Enviado desde mi 6045I mediante Tapatalk
 
Wow no pensaba que alguien pudiera hacerlo, felicidades por este aporte, llevaba mucho tiempo buscandolo
 
Muchas gracias.
 
[MENTION=81006]kanikase[/MENTION] Muchas gracias Kanikase 🙂
 
Gracias por el aporte compañero:encouragement:
 
buen tutorial gracias
 
excelente gracias voy a tratar de hacerlo
 
Excelente era lo que he andado buscando ya desde hace un tiempo y muchas gracias
 
Gracias amigo! Me servirá mucho
 
"Amiga".............jajajajaja

Muy buen tuto kanikase :encouragement:
 
Muchas Gracias!, que buen aporte. Posiblemente lo ponga a prueba muy pronto :encouragement:
 
Genial tutorial.
 
Gracias a todos por sus comentarios 🙂
 
Gracias amiga 😀
 
Muy interesante el plugin! Gracias 🙂
 
Buenicimo gracias por el aporte men
 
Google: Le doy click y te baneo la web :stupid1:

Buen tuto compañero :encouragement:
 

Temas similares