Jump to content
  • Sky
  • Blueberry
  • Slate
  • Blackcurrant
  • Watermelon
  • Strawberry
  • Orange
  • Banana
  • Apple
  • Emerald
  • Chocolate
  • Charcoal
Rengo

[BBCode] Video Facebook

Recommended Posts

c33Nb.gif

 

Acá les traigo una adaptación de videos de facebook a nuestro PHPost.

Esto me lo pidió un usuario del foro, ya se lo implemente en su web.

Lo hice rápido así que no esta 100% perfecto xD solo vi un error en visualizar no se muestra, todo lo demás si.

No vi otro aporte similar a este así que bueno, disfruten (?


Bueno pasamos a instalar, lo hice en los 2 editores, default y wysibb:

 

 

 

 

 

 

1jANkNk.png

W1askX6.png

 

2TiOT94.png

Editor default:

Spoiler

 

1. Vamos a inc\ext  y abrimos bbcode.inc y buscamos y agregamos una coma al final así: ), :

 

array('tag' => 'success', 'replace' => '<div class="bbcmsg success">{param}</div>')

y abajo agregamos:

array('tag' => 'videofb', 'replace' => '<div class="fb-video" data-href="{param}" data-width="500" data-allowfullscreen="true"></div>')

el ultimo no tiene que tener coma, si ya tienen otros bbcode miren bien lo de la coma y el final que no tenga.

 

2. Abrimos c.core.php de inc\class y buscamos: 

'success'

alado agregamos:

, 'videofb'

3. Abrimos Estilo.css de themes\TuTheme y buscamos:

.markItUp .markItUpButton17 a {
	background:transparent url('images/bbcodes.png') no-repeat scroll left top;
	background-position: left -256px;
	height: 10px;
}

y abajo agregamos:

.markItUp .markItUpButton18 a {
	background:transparent url(http://i.imgur.com/jszeMDf.png) no-repeat scroll left top;
        height: 10px;
}

4. Abrimos acciones.js de themes\TuTheme\js y buscamos:

lang['Upload'] = "Subir Im&aacute;genes";

abajo agregamos:

lang['Insertar video de Facebook'] = "Insertar video de Facebook";

Buscamos:

{name:lang['Upload'], beforeInsert:function(h){ markit_upload(h); }},

abajo agregamos:

{name:lang['videofb'], beforeInsert:function(h){ markit_videofb(h); }},

 

Buscamos:

function markit_upload(h){
    upload.newUpload(h);
}

y abajo:

function markit_videofb(h){
    if(h.selection==''){
        var msg = prompt(lang['Ingrese el ID de Facebook'], 'http://');
        if(msg != null){
            h.replaceWith = '[videofb]' + msg + '[/videofb]';
            h.openWith = '';
            h.closeWith = '';
        }else{
            h.replaceWith = '';
            h.openWith = '';
            h.closeWith = '';
        }
    }else{
        h.replaceWith = '[videofb]' + h.selection + '[/videofb]';
        h.openWith='';
        h.closeWith='';
    }
}

Buscar:

for(var i = 1; i <= 17

Cambiar ese 17 por 18, si tienes otros bbcode tiene que ir uno mas, es decir si ya tiene 18, tiene que ir 19 y así sucesivamente.

y listo, eso seria todo, creo que no me olvide nada.

 

 

 

El bbcode y url del vídeoFB seria así:

[videofb]https://www.facebook.com/downloadvideosfrom/videos/983761418315992/[/videofb]

 

 

 

Para  WYSIWYG:

 

Spoiler

 

1. Abrir bbcode.inc de inc\ext y buscamos:

array('tag' => 'success', 'replace' => '<div class="bbcmsg success">{param}</div>')
wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

Agregamos una coma y Abajo agregamos:

array('tag' => 'videofb', 'replace' => '<div class="fb-video" data-href="{param}" data-width="500" data-allowfullscreen="true"></div>')
wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

Quedaría:

            array('tag' => 'success', 'replace' => '<div class="bbcmsg success">{param}</div>'),
            array('tag' => 'videofb', 'replace' => '<div class="fb-video" data-href="{param}" data-width="500" data-allowfullscreen="true"></div>')
wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

el ultimo no tiene que tener coma, si ya tienen otros bbcode miren bien lo de la coma y el final que no tenga.

 

2. Abrimos c.core.php de inc\class y buscamos: 

'success'
wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

alado agregamos:

, 'videofb'
wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

Luego abrimos wysibb.css de themes\TuTheme\css y agregamos al final:

.videofb {
background-repeat: no-repeat;
background-position: 8px center;
padding: 1px 0 0px 7px;
background-image: url('http://i.imgur.com/jszeMDf.png');
border-color: #DEDEDE;
color: #666666;
}
wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

4. y ultimo paso abrimos wysibb.js de themes\TuTheme\js y buscamos:

video: "Vídeo de YouTube",
wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

abajo agregamos:

videofb: "Insertar ID del Vídeo de Facebook",
wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

Buscamos:

			//END img upload config 
			buttons: "bold,italic
wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

y en la parte donde esta img,video, agregan alado videofb, quedaría así:

img,video,videofb,
wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

luego buscamos:

modal_video_text: "URL del vídeo",
wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

abajo agregamos:
 

modal_videofb_text:"ID del vídeo Facebook",
wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

Ahora buscamos:
 

transform: {
						'<iframe src="http://www.youtube.com/embed/{SRC}" width="640" height="360" frameborder="0" allowfullscreen></iframe>':'[swf=http://www.youtube.com/v/{SRC}]'
					}
				},
wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==

y debajo ponemos:

				videofb : {
					title: CURLANG.videofb,
					buttonHTML: '<span class="videofb"></span>',
					modal: {
						title: CURLANG.videofb,
						width: "500px",
						tabs: [
							{
								input: [
									{param: "URL",title:CURLANG.modal_videofb_text}
								]
							}
						]
					},
					transform : {
						'<iframe src="http://www.facebook.com/video/embed?video_id={URL}" type="application/x-shockwave-flash" allowfullscreen="true" width="500" height="300" frameborder="0"></iframe>':"[videofb]https://www.facebook.com/facebook/videos/{URL}[/videofb]"
					}
				},

 

 

 

 

En este editor use para agregar por ID del vídeo, ejemplo:

Link del vídeo: https://www.facebook.com/downloadvideosfrom/videos/983761418315992/

[videofb]983761418315992[/videofb]

 

 

Si no les visualiza los vídeos en los posts: hagan estos pasos del vídeo:
 

 

Cualquier consultar, problema y queja (? dejen en comentarios..

Hasta luego 8b2wY.gif

 

Edited by Rengo
Fix
  • Like 10

Share this post


Link to post
Share on other sites

Gracias por el aporte amigo. Me gustaria que puedan adaptar las comunidades para el tema cralke . Solo hay par de errores en el css pero no logro :(

Share this post


Link to post
Share on other sites

Buen aporte amigo +1,el icono lo puedes poner en la misma imágen sprite.png , para probarlo lo he puesto así.

 

wysibb.css

buscar:

.i-fullscreen { background-position: center -108px; }

 

Debajo añadir:

.i-videofb { background-position: center -126px; }

 

Cambias background-image: url('http://i.imgur.com/jszeMDf.png');   por   background-image: url('../images/wysibb/sprite.png');

 

.videofb {
background-repeat: no-repeat;
background-position: 8px center;
padding: 1px 0 0px 7px;
background-image: url('http://i.imgur.com/jszeMDf.png');
border-color: #DEDEDE;
color: #666666;
}

 

.videofb {
background-repeat: no-repeat;
background-position: 8px center;
padding: 1px 0 0px 7px;
background-image: url('../images/wysibb/sprite.png');
border-color: #DEDEDE;
color: #666666;
}

 

 

wysibb.js

Cambiar <span class="videofb"></span>  por   <span class="newicon i-videofb"></span>

 

videofb : {
					title: CURLANG.videofb,
					buttonHTML: '<span class="videofb"></span>',
					modal: {
						title: CURLANG.videofb,
						width: "500px",
						tabs: [
							{
								input: [
									{param: "URL",title:CURLANG.modal_videofb_text}
								]
							}
						]
					},
					transform : {
						'<iframe src="http://www.facebook.com/video/embed?video_id={URL}" type="application/x-shockwave-flash" allowfullscreen="true" width="500" height="300" frameborder="0"></iframe>':"[videofb]{URL}[/videofb]"
					}
				},

 

videofb : {
					title: CURLANG.videofb,
					buttonHTML: '<span class="newicon i-videofb"></span>',
					modal: {
						title: CURLANG.videofb,
						width: "500px",
						tabs: [
							{
								input: [
									{param: "URL",title:CURLANG.modal_videofb_text}
								]
							}
						]
					},

 

wysibb

default/images/wysibb

sprite.png

 

 

 

thhp9bz.png

 

 

 

 

 

 

 

 

 

 

 

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By Miguel92
      Actualización:
      Compartir posts "Redes Sociales"
       
      Bueno cuando ves un post, lo más probable que lo veas de esta manera...
      Y un mensaje en la consola que dice lo siguiente 'imagen'

       
      Bien empecemos:
      1 - Buscamos en templates/modules/m.posts_content.tpl (o en donde tengas para compartir ya que los themes son distintos)
       
      CAMBIAMOS TWITTER
      <a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="{$tsConfig.titulo}" data-lang="es">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script> la reemplazamos por
      <a href="https://twitter.com/share?ref_src=twsrc%5Etfw" class="twitter-share-button" data-size="large" data-text="{$tsPost.post_title}" data-url="{$tsConfig.url}/posts/{$tsPost.categoria.c_seo}/{$tsPost.post_id}/{$tsPost.post_title|seo}.html" data-lang="es" data-dnt="true" data-show-count="true">Tweet</a>  
      CAMBIAMOS FACEBOOK
      <a name="fb_share" share_url="{$tsConfig.url}/posts/{$tsPost.categoria.c_seo}/{$tsPost.post_id}/{$tsPost.post_title|seo}.html" type="box_count" href="http://www.facebook.com/sharer.php">Compartir</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> la reemplazamos por
      <div class="fb-share-button" data-href="{$tsConfig.url}/posts/{$tsPost.categoria.c_seo}/{$tsPost.post_id}/{$tsPost.post_title|seo}.html" data-layout="button_count" data-size="large" data-mobile-iframe="true"><a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u={$tsConfig.url}/posts/{$tsPost.categoria.c_seo}/{$tsPost.post_id}/{$tsPost.post_title|seo}.html&src=sdkpreparse" class="fb-xfbml-parse-ignore">Compartir</a></div>  
      2 - Como verán no posee los *.js para que funcione yo lo he colocado a mi manera, ustedes lo pueden poner en el mismo archivo o hacer lo que hice, en templates/t.posts.tpl arriba de
      {include file='sections/main_footer.tpl'} agregan esto
      <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> <div id="fb-root"></div> {literal} <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "https://connect.facebook.net/es_ES/sdk.js#xfbml=1&version=v3.0"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> {/literal}  

       
      Ahora si quieren agregar Google+
      1 - En m.posts_content.tpl debajo de
      <ul class="post-compartir clearbeta"> agregan esto
      <li class="share-big"> <div class="g-plus" data-action="share" data-height="24" data-href="{$tsConfig.url}/posts/{$tsPost.categoria.c_seo}/{$tsPost.post_id}/{$tsPost.post_title|seo}.html"></div> </li> 2 - Ahora en t.posts.tpl arriba de
      {include file='sections/main_footer.tpl'} agregan esto
       
      <script src="https://apis.google.com/js/platform.js" async defer>{literal}{lang: 'es'}{/literal}</script> y les quedaría así...
      (imagen actualizada)

       
      Nota: Para visualizarlo de esta manera buscar en el mismo archivo en el que sea realizado la modificación "m.posts_content.tpl" y buscamos (solo en la de twitter, facebook y google) solo los 3 primero (en el caso que no agregues google serán los 2 primeros)
      <li class="share-big"> y la cambian por
      <li class="share-big" id="redes"> luego ir a estilo.css y buscan
      .FBConnectButton_Small .FBConnectButton_Text { margin-left:17px; padding:2px 4px 3px!important; -moz-border-radius:3px; } y arriba pegan esto
      .post-compartir #redes { margin-top: 32px; }  
    • By solotu
      Hola como va? Estoy Necesitando un poco de Ayuda con mi web.
      Tengo una Página de Facebook, la cual me da la opción de poner el plug-in de Messenger en mi Web.
      Hay que agregar el dominio en facebook de la página donde aparecerá el Plug-in. Y te da un código para insertarlo después de la etiqueta <body>. La cosa es que no se en donde tengo que pegar ese código, y no se si es posible ponerlo en el apartado Chat. ya que no hay niguna etiqueta <body> y de este tema no se absolutamente nada. Si alguien pudiera guíarme sería de gran ayuda.
      Mi Web: Arez
      El código:
      <!-- Load Facebook SDK for JavaScript --> <div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = 'https://connect.facebook.net/es_ES/sdk/xfbml.customerchat.js#xfbml=1&version=v2.12&autoLogAppEvents=1'; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> <!-- Your customer chat code --> <div class="fb-customerchat" attribution="setup_tool" page_id="2075040399397886" logged_in_greeting="Hola! Escribinos, en unos minutos te respondemos!" logged_out_greeting="Hola! Escribinos, en unos minutos te respondemos!"> </div>  
    • By Rengo
      Ya que @Kmario19 no lo puede publicar, lo haré yo por que mucho lo vamos a necesitar xD
      Fix y créditos para kmario.
       
      El fix es el siguiente,
      Cuando instalamos este mod,
       
      Nos registramos, llegamos al captcha y cuando completamos se reinicia..
      No lo podemos registrar,
      que hacemos?
      Miramos el mod el parte 2.
      Buscamos:
       
      $secret = "AQUI TU CLAVE SECRETA"; $robot = new ReCaptcha($secret); $robot->verifyResponse($_SERVER["REMOTE_ADDR"], $_POST['g-recaptcha-response']); if(!$robot->success) return 'recaptcha: Hey que pasa? Demuestra que no eres un robot!'; lo reemplazamos por:
      $ch = curl_init(); curl_setopt($ch, CURLOPT_URL, "https://www.google.com/recaptcha/api/siteverify"); curl_setopt($ch, CURLOPT_POST, 1); curl_setopt($ch, CURLOPT_POSTFIELDS, http_build_query([ 'secret' => "AQUI TU CLAVE SECRETA", 'response' => $_POST['g-recaptcha-response'], ])); curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); $data = curl_exec($ch); curl_close($ch); $response = @json_decode($data); if(empty($response) || !$response->success) return 'recaptcha: Hey que pasa? Demuestra que no eres un robot!'; Recuerden colocar su CLAVE SECRETA.
       
      Y listo, eso es todo lo que hay que hacer.
       
      Hasta luego 
    • By Azzlaer
      Hola PHPost necesitaria saber como instalo el modulo de facebook a esta version de PHPOST ya que los tutoriales estan desactualizados, sino si nadie quiere armar un tutorial podrian decirme como desactivo la opcion de ingresar con Facebook en todas las secciones ?? Estoy usando actualmente el repack : http://phpost.net/foro/topic/30302-risus-rc-v56-version-2/
      Y me ha funcionado perfecto.
       
      Gracias
    • By RodrigoVGarcia
      Hola compañeros de la web. Tengo un inconveniente con el bbcode que no puedo solucionar. Me ayudo un amigo pero tampoco le anda.
      Necesito agregar una etiqueta con el siguiente código:
      array('tag' => 'ads1', 'replace' => '<div class="ads1"> <iframe src="https://api.paymentwall.com/api/subscription/?key=1983189fshfhs8934387&uid=' .$_SERVER["HTTP_CLIENT_IP"]. '&widget=p1_1" width="750" height="800" frameborder="0"></iframe></div>'), En este codigo no me lo toma, simplemente no anda. Es un problema de comillas y de codigo php. Pero como hago para que ande??  
  • Recently Browsing   0 members

    No registered users viewing this page.

  • Patrocinador



  • ×