Cicklow Seguir
Admin
Épsilon
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
¡Ha verificado su Paypal!
¡Usuario popular!
Suscripción a IA
- Desde
- 30 May 2011
- Mensajes
- 776
El día de hoy aprenderán a crear una aplicación para facebook que permite colocar estados de animo.
La aplicación se vera de esta manera:
Enlace eliminado
Pueden usar el paquete de emoticon que ustedes gusten, ya que solo suben las imágenes en la carpeta img y luego editando estados.php (ver mas abajo).
config.php
index.php
incluimos el config.php
ahora armamos la estructura de html y el CSS (como ven e coloca CSS para armar tooltips y se vera de esta forma)
Enlace eliminado
iniciamos el SDK JS de facebook
funcion encargada de publicar el emoticon en el muro del usuario
Enlace eliminado
agregamos estados.php y recorremos los estados con un bucle, armando la grilla
estados.php
este archivo tiene:
1- nombre de la imagen
2- descripción de la imagen (o titulo)
3- texto de la imagen (este texto tiene que ser multi genero, osea para mujeres y para hombres, usar el @ para los estados que son multi genero, y tmb como ven no se incluye el nombre ni nada. imaginen esto: USUARIO está armando un tutorial en forobeta, como ven luego no coloco la palabra USUARIO, de esta forma todos los usuarios que accedan a la aplicacion pueden usarla)
En la carpeta img que acompaña a la aplicacion hay mas emoticon, yo solo coloque algunos
Para mas emoticons pueden usar:
Enlace eliminado
u alguna otra
Descarga:
PD: se incluye el SDK PHP de facebook dentro del rar, para evitar que en otras actualizaciones de facebook deje de funcionar.
PD: Configurar apps: http://forobeta.com/tutoriales/117840-configurar-aplicacion-facebook.html
La aplicación se vera de esta manera:
Enlace eliminado
Pueden usar el paquete de emoticon que ustedes gusten, ya que solo suben las imágenes en la carpeta img y luego editando estados.php (ver mas abajo).
config.php
PHP:
<?php
@session_start();
//Code by Cicklow
//detectar si estamos en http o https (ya que facebook necesita si o si esto)
if($_SERVER['HTTPS']=="on") $PRO = 'https'; else $PRO = 'http';
//definimos nuestras variables
define('WEB',$PRO.'://facebook.miserver.com/carpeta/'); //url de la apps en mi server
define('FAC',$PRO.'://apps.facebook.com/appcanvas/'); //url de la apps en facebook
//id de la aplicacion y codigo secreto
$__ID = 'ID_FACEBOOK';
$__SE = 'APP_SECRET';
//incluimos el SDK PHP de facebook
include('src/facebook.php');
//iniciamos pasandole parametros la api de facebook
$config = array();
$config['appId'] = $__ID;
$config['secret'] = $__SE;
$config['fileUpload'] = false; //No vamos a cargar archivos por ende no lo usamos!
$facebook = new Facebook($config);
$USER = $facebook->getUser(); //Obtenemos el usuario logeado!
//scope = permisos a pedir separados por coma (,)
//redirect_uri = a donde ira dsp de pedir los permisos
$toURL = $facebook->getLoginUrl(array('scope'=>'','redirect_uri'=>FAC));
//Guardamos los datos del usuario en la session. si no obtenemos un usuario valido redireccionamos nuevamente a los permisos!
$fbme = null;
if ( !isset($_SESSION[$__ID.'_fbme']) ) {
if ($USER) {
try {
$fbme = $facebook->api('/'.$USER);
$_SESSION[$__ID.'_fbme'] = $fbme;
} catch (FacebookApiException $e) {
try {
$fbme = $facebook->api('/'.$USER);
$_SESSION[$__ID.'_fbme'] = $fbme;
} catch (FacebookApiException $e) { error_log($e); echo "<script type='text/javascript'>top.location.href = '".$toURL."';</script>"; exit(); }
}
}
} else {
$fbme = $_SESSION[$__ID.'_fbme'];
}
if (!$fbme || $_SESSION[$__ID.'_fbme']['first_name']=="") {
echo "<script type='text/javascript'>top.location.href = '".$toURL."';</script>";
exit;
}
?>
index.php
incluimos el config.php
PHP:
<?php
include('config.php');
?>
ahora armamos la estructura de html y el CSS (como ven e coloca CSS para armar tooltips y se vera de esta forma)
Enlace eliminado
PHP:
<!doctype html>
<html xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<title>Emoticons</title>
<style>
body {
font-family: 'Lucida Grande', Verdana, Arial, sans-serif;
}
#emodiv{
background-color: #F1F3F5;
border: 1px solid #ADBDCE;
height: 500px;
margin-left: 27px;
margin-top: 6px;
padding: 5px;
width: 90%;
overflow:scroll;
overflow-x:hidden;
}
.emo1{
float:left;
width: 140px;
height:140px;
background-color: #cccccc;
border: 1px solid #ADBDCE;
margin:5px;
cursor:hand; cursor:pointer;
}
.emo1 img{
width:130px;
height:130px;
}
.tooltip span {display:none; padding:2px 3px; margin-left:8px; width:130px;font-size:11px;opacity: 1.0;}
.tooltip:hover span{display:block; position:absolute; background:#333333; border:1px solid #cccccc;color:#ffffff;opacity: 1.0;z-index:1001;}
</style>
</head>
<body>
iniciamos el SDK JS de facebook
PHP:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId: '<?php echo $facebook->getAppID() ?>',
cookie: true,
xfbml: true,
oauth: true
});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/es_ES/all.js';
document.getElementById('fb-root').appendChild(e);
}());
funcion encargada de publicar el emoticon en el muro del usuario
Enlace eliminado
PHP:
function Publicar(texto,img){
var hrefLink = '<?=FAC;?>';
var hrefTitle = 'Mi estado de ánimo';
var imagen = '<?=WEB;?>img/' + img;
FB.ui({
method: 'feed',
to: '',
description: ' ',
message: '',
link: hrefLink,
name: texto,
caption: 'Publica tu estado de ánimo... ',
picture: imagen,
actions: [ { name: hrefTitle, link: hrefLink } ]
},
function(response) {
//Se publico o no...
}
);
}
</script>
agregamos estados.php y recorremos los estados con un bucle, armando la grilla
PHP:
<center>
<div id="emodiv">
<?php
include('estados.php');
foreach($EMO as $E){
$TXT = $_SESSION[$__ID.'_fbme']['first_name'].' '.utf8_encode($E[2]);
echo '<div class="emo1 tooltip" onclick="Publicar(\''.$TXT.'\',\''.$E[0].'\');"><font size="1">'.utf8_encode($E[1]).'</font><br/><img src="'.WEB.'img/'.$E[0].'"><span>'.$TXT.'</span></div>';
}
?>
</div>
</center>
</body>
</html>
estados.php
este archivo tiene:
1- nombre de la imagen
2- descripción de la imagen (o titulo)
3- texto de la imagen (este texto tiene que ser multi genero, osea para mujeres y para hombres, usar el @ para los estados que son multi genero, y tmb como ven no se incluye el nombre ni nada. imaginen esto: USUARIO está armando un tutorial en forobeta, como ven luego no coloco la palabra USUARIO, de esta forma todos los usuarios que accedan a la aplicacion pueden usarla)
En la carpeta img que acompaña a la aplicacion hay mas emoticon, yo solo coloque algunos
PHP:
<?php
$EMO[] = array('angry.png','Enojado','está enojado');
$EMO[] = array('beaten.png','Golpeado','se encuentra golpeado');
$EMO[] = array('beso.png','Beso','quiere un beso');
$EMO[] = array('bouaaaaah.png','Asustado','está asustado');
$EMO[] = array('brains.png','Cerebro','es un zombie');
$EMO[] = array('enjoying mah playlist.png','Música','está escuchando música');
$EMO[] = array('have a nice day.png','Feliz','se encuentra feliz');
$EMO[] = array('hidden.png','Escondido','se esta escondiendo');
$EMO[] = array('ignoring.png','Ignorar','está ignorando a alguien');
$EMO[] = array('in love.png','Enamorado','está enamorado');
$EMO[] = array('nom nom.png','Comida','está comiendo');
$EMO[] = array('sick.png','Enfermo','está enfermo');
$EMO[] = array('TT TT.png','Llorando','está llorando');
$EMO[] = array('dormido.png','Dormir','se fue a dormir');
$EMO[] = array('suenio.png','Sueño','tiene sueño');
$EMO[] = array('omg.png','Enojado','está enojad@');
// $EMO[] = array('','','');
// $EMO[] = array('','','');
// $EMO[] = array('','','');
// $EMO[] = array('','','');
// $EMO[] = array('','','');
?>
Para mas emoticons pueden usar:
Enlace eliminado
u alguna otra
Descarga:
Insertar CODE, HTML o PHP:
http://www.mediafire.com/?q2rgdnpadwf5lto
PD: se incluye el SDK PHP de facebook dentro del rar, para evitar que en otras actualizaciones de facebook deje de funcionar.
PD: Configurar apps: http://forobeta.com/tutoriales/117840-configurar-aplicacion-facebook.html
Última edición: