Facebook video on Wordpress

facebook video 150x150 Facebook video on Wordpress

Facebook video on Wordpress

În urmă cu câteva zile citeam pe blogul lui Francisc un articol despre “Cum pui în Wordpress un film de pe Facebook?“. Francisc prezenta pentru cititorii săi, metoda “Embed Post” oferită de către cei de la Facebook, pentru a adăuga filmulețe video de pe Facebook, pe Wordpress.
Ei bine, am explicat și acolo (în comentarii) că metoda prezentată de Facebook este într-adevăr una “ușoară” pentru utilizatorii de WP mai puțin “avizați”, însă personal nu-mi place pentru că încarca fără rost baza de date a siteului. Cum? Simplu. Practic, același cod va fi adăugat în baza de date pentru fiecare filmuleț de pe Facebook pe care-l adăugați pe Wordpress!

Există bloggeri care au ceva vechime în “online” (ani de zile) iar în tot acest timp au scris o mulțime de articole. Dacă vă numărați printre cei care obișnuiți să utilizați frecvent filmulețele de pe Facebook în articolele voastre și utilizați metoda “Embed Post” oferită de Facebook, trebuie să știți că același cod va fi adăugat de fiecare dată când adăugați un filmuleț în articol! În timp, toate aceste coduri vor însemna o parte semnificativă (ca spațiu) din baza voastră de date, bază de date care pe măsură ce devine mai mare, va deveni tot mai greu de “citit” iar asta va duce la mărirea consumului de resurse de pe serverul pe care este găzduit blogul. Și uite-așa, site-ul vostru va începe să se încarce pe zi ce trece tot mai greu, iar cei de la firma de hosting vă vor trimite un mail de amor de avertizare că depășiți consumul de resurse alocat și că trebuie să vă optimizați siteul, ori că trebuie să alegeți un abonament mai mare deoarece site-ul vostru consumă prea multe resurse pentru un cont de “shared hosting”.

Ei bine, “optimizarea” unui site web se face în pași mărunți, în timp și cu foarte multă răbdare, iar gestionarea bună a resurselor și a codului fac parte din această “optimizare”. Pentru a rezolva problema încărcării fără rost a bazei de date cu coduri/scripturi adăugate de o mie de ori, soluția este să găsim o metodă prin care, cât mai puțină informație de acest gen să fie scrisă în baza de date. Iar pentru adăugarea filmulețelor de pe Facebook pe Wordpress, am creat o funcție cu ajutorul căreia veți putea adăuga foarte ușor filmulețe video de pe Facebook pe Wordpress, fără să copiați întreg codul “embed” oferit de Facebook.

Ce aveți de făcut? Este simplu …

Va trebui să creați un fișier .js care să conțină următorul script Java:

1
2
3
4
5
6
7
8
9
10
11
12
window.fbAsyncInit = function() {
    FB.init({
        xfbml      : true,
        version    : 'v2.3'
    });
    }; (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 = "//connect.facebook.net/en_US/sdk.js";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
window.fbAsyncInit = function() {
    FB.init({
        xfbml      : true,
        version    : 'v2.3'
    });
    }; (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 = "//connect.facebook.net/en_US/sdk.js";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));

Denumiți fișierul astfel: facebook_videos.js

Apoi, încărcați fișierul “facebook_videos.js” în folderul “/js” pe contul vostru de hosting.
Dacă aveți deja creat un director “/js“, atunci încărcați fișierul “facebook_videos.js” în directorul deja existent.
Dacă nu aveți încă un director “/js” creat în “root” (/), atunci creați voi directorul “/js” în “root”.

Deschideți fișierul “header.php” al temei voastre și căutați următorul cod:

</head>

Deasupra lui, adăugați acest cod:

1
<script type="text/javascript" src="/js/facebook_videos.js"></script>
<script type="text/javascript" src="/js/facebook_videos.js"></script>

Apoi, deschideți fișierul “functions.php” al temei voastre și undeva la final, adăugați următorul cod:

1
2
function fbv_shortcode( $atts, $content = null ) { return '<center><div class="fb-video" data-href="https://www.facebook.com/video.php?v='.$content.'" data-width="450" data-allowfullscreen="true"></div></center>';
} add_shortcode( 'fbv', 'fbv_shortcode' );
function fbv_shortcode( $atts, $content = null ) { return '<center><div class="fb-video" data-href="https://www.facebook.com/video.php?v='.$content.'" data-width="450" data-allowfullscreen="true"></div></center>';
} add_shortcode( 'fbv', 'fbv_shortcode' );

În funcție de layout-ul temei voastre, puteți modifica data-width=”450″ cu ce dimensiune doriți, pentru ca filmulețul video să fie încadrat bine în pagina voastră. Dacă aveți instalat ceva plugin de cache, atunci va trebui să goliți cache-ul pentru a vă asigura că noile date sunt încărcate din fișierele modificate și nu din cache-ul existent.

Iar acum, pentru a adăuga un filmuleț în articolul vostru de pe blog, pur și simplu mergeți pe pagina filmulețului și copiați ID-ul filmulețului video de pe Facebook …

Pe Facebook, dați click pe link-ul “video” al filmulețului pe care vreți să-l adăugați pe blog:

facebook video 01 Facebook video on Wordpress

De pe pagina filmulețului, din bara de adrese a browserului, copiați doar ID-ul filmulețului:

facebook video 02 Facebook video on Wordpress

facebook video 03 Facebook video on Wordpress

Acest ID îl introduceți în articolul vostru, între tagurile “fbv“, astfel:

[fbv]ID[/fbv]

EXEMPLU:

[fbv]1194611790554701[/fbv]

Rezultatul obținut va fi acesta:



Succes!

Ţi-a plăcut acest articol ? Atunci votează-l, aici:
   
Comentează acest subiect
Acest articol a fost publicat de , vineri, 2 octombrie 2015 in categoria Diverse, Programare. Poti sa urmaresti raspunsurile catre acest articol prin RSS 2.0 feed. Poti sa adaugi un comentariu, sau poti sa pui un trackback (link) de pe propriul tau site:

Ctrl + C pentru a copia linkul

6 comentarii la subiectul “Facebook video on Wordpress”

  1. francisc

    Așa mă, mură-n gură. Acu pricep și eu ce și cum. Să vedem dacă merge!

  2. francisc

    apare asta sus in header:


    function fbv_shortcode( $atts, $content = null ) { return '
    '; } add_shortcode( 'fbv', 'fbv_shortcode' );

    tu ai pus sa fie aia la final, in

    cred ca trebuie in la inceput, adica inainte de inceput. incerc asa si revin

  3. francisc

    nu merge nici inainte de
    si nici codul

  4. francisc

    eroarea era din functions.php. eu am pus la final de tot. nu stiu ce sa-i fac, la mine nu merge aia clar Ș))

  5. Dan

    Vezi că poate ai pus-o în conținutul altei funcții și-atunci iese o varză … hai că arunc eu un ochi prin cod (pe site-ul tau) și revin …

    UPDATE: Gata, rezolvat, îți merge.

    Folosești shortcode-ul [fbv]ID[/fbv] în articole și postezi de pe Facebook ce filmulețe vrei … Spor.

  6. francisc

    Da, merge. Merci mult!

RSS

Adaugă un comentariu

Autentifică-te pe site și nu va mai trebui să completezi căsuțele de mai sus.

:) :( :d :"> :(( :dancing: :x 8-| /:) :o :-? :-" :-w ;) [-( :peace: arata toate iconitele »

 

Acum poți adăuga pe site, propriile tale articole. Click aici !



Matrimoniale