Hur du gör dina videor lyhörda i WordPress med FitVids

Hur du gör dina videor lyhörda i WordPress med FitVids

NÀr du bÀddar in en video i WordPress svarar dessa videor som standard inte. Med ökningen av responsiva WordPress-teman kommer anvÀndare som besöker din webbplats pÄ mindre skÀrmar att se videokontainrar som Àr strÀckta och oproportionerliga. I den hÀr artikeln visar vi dig hur du gör dina videor lyhörda i WordPress med FitVids.

FitVids Àr ett jQuery-plugin som lÄter dig göra dina videoinbÀddar lyhörda. Om du vill anvÀnda den pÄ din WordPress-webbplats behöver du bara installera och aktivera FitVids för WordPress-plugin. Efter aktivering mÄste du gÄ till Utseende »FitVids och ange en CSS-vÀljarklass. WordPress lÀgger automatiskt till .post-klass i artiklarna, sÄ du kan bara anvÀnda det.

InstÀllningar för FitVids för WordPress-tillÀgg

Det Àr allt, spara dina Àndringar och förhandsgranska din webbplats. Du mÄste Àndra storlek pÄ webblÀsarens skÀrm för att se videor som anpassar sig efter det.

Videohandledning

Prenumerera pÄ WPBeginner

Om du inte gillar videon eller behöver fler instruktioner, fortsÀtt lÀsa.

LÀgg till FitVids manuellt för att göra dina videoklipp responsiva pÄ WordPress

Om du inte vill installera FitVids för WordPress-plugin-programmet kan du lÀgga till FitVids jQuery-plugin manuellt. Det första du behöver göra Àr att ladda ner och extrahera FitVids jQuery-plugin till din dator. Nu mÄste du ladda upp den extraherade mappen FitVids.js-master till ditt temas js-katalog.

Du mÄste ansluta till din webbplats med en FTP-klient som Filezilla och öppna din temakatalog. Det Àr möjligt att ditt WordPress-tema kanske inte har en js-mapp. Om den inte finns dÀr mÄste du skapa en och sedan ladda upp FitVids.js-master-mappen frÄn din dator.

Inne i js-mappen mÄste du skapa en ny fil och ge den namnet FitVids.js. Redigera den hÀr filen och klistra in den hÀr koden i den.


(function($) {
  $(document).ready(function(){
    // Target your .container, .wrapper, .post, etc.
    $(".post").fitVids();
  });
  
  })(jQuery);

OvanstÄende kod ber FitVids att leta efter .post CSS-vÀljarklass. Nu nÀr du har gjort FitVids redo Àr det dags att korrekt lÀgga till javaskript i ditt WordPress-tema.

Kopiera och klistra in följande kod i temas funktioner.php-fil:


wp_enqueue_script('fitvids', get_template_directory_uri() . '/js/FitVids.js-master/jquery.fitvids.js', array('jquery'), '', TRUE); 

wp_enqueue_script('fitvids-xtra', get_template_directory_uri() . '/js/FitVids.js', array(), '', TRUE);

NÀr du vÀl har gjort det Àr du klar. Du har gjort dina WordPress-videor lyhörda.

Vi hoppas att du tyckte att den hÀr artikeln var anvÀndbar. För feedback och frÄgor Àr du vÀlkommen att lÀmna en kommentar nedan eller gÄ med pÄ Twitter och Google+.