Insertar botón de "Compartir"
Si quieres que tus fans tengan un incentivo más a compartir tu página, te recomiendo un botón que diga compartir.
Este es el código:
<fb:share-button class="url" href="url de tu página" />
Codigos fbml
Insertar caja de comentarios
Si quieres que tus fans comenten algún contenido de tu pestaña FBML, debes agregar una caja de comentarios, para eso, lo primero que debes hacer es entrar a esta dirección.
Cuando entres ahí, donde dice "Unique ID" debes poner el ID de tu página, que es el que está despues del nombre de tu página en la URL, por ejemplo:
https://www.facebook.com/pages/Tu-página/131554273570506
Lo que está en negrita es el ID.
Pero qué pasa si tú ya le agregaste un nombre de usuario a tu página, por ejemplo, en el caso de River Plate:
https://www.facebook.com/ClubAtleticoRiverPlate1
ClubAtleticoRiverPlate1 es el ID, es lo que sigue a facebook.com/
Bueno, cuando tengas tu ID lo pones ahí, en Unique ID, y luego abajo dice "Number of Comments", que es la cantidad de comentarios que quieres que el usuario vea. (Claro que el mismo después puede hacer click en Ver Más y verá los comentarios anteriores.
Y por último, está "Width", que es el ancho de la caja de comentarios, eso te recomiendo que lo dejes como está, pero tú lo haces a tu gusto.
Luego le das en "Get code" y te aparecerá una ventanita con tu código, lo copias, y lo pegas en tu pestaña FBML.
Insertar menús personalizados
Puedes poner un menú en tu pestaña FBML para que en cada pestaña del menú aparezcan diferentes contenidos.
Ejemplo: Fotos, entretenimiento, ayuda, contacto, etc.
Este es el código para un menú básico:
<ul>
<li><a href="index.html" clicktoshow="1" clicktohide="2, 3, 4">PRIMERO</a></li>
<li><a href="about.html" clicktoshow="2" clicktohide="1, 3, 4">SEGUNDO</a></li>
<li><a href="services.html" clicktoshow="3" clicktohide="1, 2, 4">TERCERO</a></li>
<li><a href="contact.html" clicktoshow="4" clicktohide="1, 2, 3">CUARTO</a></li>
</ul>
<p style: padinn-top
<div id="1" >
CONTENIDO DE PRIMERO
</div>
<div id="2" style="display:none;">
CONTENIDO DE SEGUNDO
</div>
<div id="3" style="display:none">
CONTENIDO DE TERCERO
</div>
<div id="4" style="display:none">
CONTENIDO DE CUARTO
</div>
Este es un menú más elaborado:
<div style="width:520px; height:400px; background:#000000 ;font-family:Arial, Helvetica, sans-serif;
font-size:18px;text-align:center; padding-top: 20px;color:#FFFFFF;">
<ul>
<li style="list-style:none; display:inline; margin:0 7px;"><a href="index.html" clicktoshow="1" clicktohide="2, 3, 4"><img src="https://img54.xooimage.com/files/1/1/9/1-2318654.png" /></a></li>
<img src="https://img50.xooimage.com/files/a/d/f/menuseparator-22853ce.png" alt="" width="5" height="20" />
<li style="list-style:none; display:inline; margin:0 7px;"><a href="about.html" clicktoshow="2" clicktohide="1, 3, 4"><img src="https://img51.xooimage.com/files/9/c/3/2-2318661.png" /></a></li>
<img src="https://img50.xooimage.com/files/a/d/f/menuseparator-22853ce.png" alt="" width="5" height="20" />
<li style="list-style:none; display:inline; margin:0 7px;"><a href="services.html" clicktoshow="3" clicktohide="1, 2, 4">
<img src="https://img54.xooimage.com/files/c/8/e/3-2318672.png" /></a></li>
<img src="https://img50.xooimage.com/files/a/d/f/menuseparator-22853ce.png" alt="" width="5" height="20" />
<li style="list-style:none; display:inline; margin:0 7px;"><a href="contact.html" clicktoshow="4" clicktohide="1, 2, 3"><img src="https://img50.xooimage.com/files/e/e/e/4-2318686.png" /></a></li>
</ul>
<br><br>
<center>
<div style="background: url(https://img52.xooimage.com/files/c/f/0/simplewood-2318301.jpg); no-repeat left top; width:400px; height:180px; padding-top:100px;padding-right:20px;">
<div id="1" >
CONTENIDO DE PRIMERO
</div>
<div id="2" style="display:none;">
CONTENIDO DE SEGUNDO
</div>
<div id="3" style="display:none">
CONTENIDO DE TERCERO
</div>
<div id="4" style="display:none">
CONTENIDO DE CUARTO
</div>
</div></center>
</div>
Insertar mensaje de de suceso, explicación o error
Insertar un mensaje al estilo Facebook puede de gran ayuda
Mensaje de suceso:
<fb:success message="Mensaje de suceso" />
Mensaje de suceso con texto:
<fb:success>
<fb:message>Mensaje de suceso</fb:message>
Este es el texto del mensaje de suceso.
</fb:success>
Mensaje de explicación:
<fb:explanation message="Mensaje de explicación" />
Mensaje de explicación con texto:
<fb:explanation>
<fb:message>Mensaje de explicación </fb:message>
Este es el texto del mensaje de explicación.
</fb:explanation>
Mensaje de error:
<fb:error message="Mensaje de error" />
Mensaje de error con texto:
<fb:error>
<fb:message>Mensaje de error</fb:message>
Este es el texto del mensaje de error.
</fb:error>
Insertar texto en diferentes formatos
Para esto, debes poner este código:
<div style="font-family:Times New Roman, Helvetica, sans-serif; font-size:60px; color:#FF0000"> <CENTER>Texto con formato</CENTER>
</div>
No todas las cosas en negrita son necesarias...
La primera, es el tipo de letra, que esa la puedes sacar del Word, la copias y la pegas en vez de esa. La segunda es el tamaño de la letra, es diferente en la pestaña FBML que en el Word, asique vas a tener que ir probando a ver cuál queda justo. El tercero es el color, pudes conseguir el código de cada uno aquí. Y lo último es sólo un ejemplo, es para centrar el texto dentro de la pestaña, obviamente si quieres lo sacas, pero es una buena opción un poco difícil de conseguir...
Mostrar contenido a los fans y ocultar a los no fans
Este es el código que debes inssertar en tu página FBML
<fb:visible-to-connection>
Este contenido lo verán los fans
<fb:else>Los no Fans verán este contenido</fb:else>
</fb:visible-to-connection>
REPARACIÓN AL ESPACIO QUE QUEDA ANTES DEL CONTENIDO QUE VEN LOS NO FANS
Si lo que ven los fans es demaciado largo, lo que ven los no fans quedara muy abajo, para acomodarlo tenes que subirlo con las etiquetas <p></p>. Quedara algo así:
<fb:else><p style="margin-top:-100px;">contenido para no fans</p></fb:else>
(modifica 100 por la distancia del espacio en blanco)
Ahora tienes que envolver todo el código (<visible-to-connection></visible-to-connection>) con las etiquetas <div></div>
Finalmente quedará así:
<div style="height:600px;">
<fb:visible-to-connection>
<fb:visible-to-connection>
Este contenido lo verán los fans
<fb:else><p style="margin-top:-100px;">Los no Fans verán este contenido</p></fb:else>
</fb:visible-to-connection>
</fb:visible-to-connection>
</div>
Insertar videos
Para insertar un video en el FBML debes poner el siguiente código:
<fb:swf swfbgcolor="000000" imgstyle="border-width:3px; border-color:white;" swfsrc='https://www.youtube.com/v/xxxxxxxxxx' imgsrc='https://img.youtube.com/vi/xxxxxxxxxx/2.jpg' width='340' height='270' />
Reemplaza “xxxxxxxxxx” Con el ID del video de YouTube, el cual es la
cadena de texto que viene después de “v=” En la URL de la barra de
direcciones de tu navegador (Hay veces en que hay un “&” y algo que
sigue después de esto, si tu vez eso, la cadena de texto está antes).
Por ejemplo:
cadena de texto que viene después de “v=” En la URL de la barra de
direcciones de tu navegador (Hay veces en que hay un “&” y algo que
sigue después de esto, si tu vez eso, la cadena de texto está antes).
Por ejemplo:
https://www.youtube.com/watch?v=6zlHAiddNUY&feature=related "&feature=related" no va, sólo va "6zlHAiddNUY"
Tu incluso puedes cambiar los valores por “swfbgcolor” y “imgstyle” dependiendo de tus preferencias tus preferencias.
El valor “swfsrc” es el valor absoluto de la URL al objeto flash que quieres agregar (los videos de YouTube están en formato FLASH).
El valor de “imgsrc” es la imagen de la vista previa. Esta imagen es usualmente de 120×90 pixeles en YouTube, así que cuando tu pones las variables de ancho y alto en la etiqueta FBML, esta imágen no se verá bien porque quizás quieras que el video se vea más grande que eso. Sin embargo, si puedes cambiar el valor de la URL de “imgsrc” para que apunte a cualquier otra imagen online, así que podrás crear una imágen de dimensiones 340×270 (o las dimensiones que quieras — el 340×270 es sólo un ejemplo).
Insertar imágenes
Para insertar imágenes lo primero que debes hacer es ir a la página ImageShack o similar.
Haz click en el botón "Browse" y sube tu imágen.
Haz click en "Cargar ahora" (para que tu imágen se cargue más rápido, verifica que sea formato .jpg)
Cuando se cargue, te aparecerá una nueva página con tu imágen en la esquina superior izquierda, debajo, vas a ver verios códigos, busca el que dice "Código HTML".
Cópialo y ése es el código que debes pegar en tu página.
Ejemplo:
<a target='_blank' title='ImageShack - Image And Video Hosting' href='http