Blogger'da Youtube Videoları Mobil Uyumlu Hale Nasıl Getirilir?

Blogger'da Youtube videolarını responsive (mobil uyumlu) hale nasıl getirebileceğinizi anlatan bilgilendirme yazısı.


Birçok Blogger kullanıcısı yazı içeriğinde Youtube videoları kullanmış ve kullanmaya devam etmektedir. Fakat bu videolar mobil uyumlu olmadığı taktirde, görünümü göze hitap etmeyen bir şekilde olacaktır. Bu sebeple göze hitap etmesi için mobil uyumlu hale getirmek gerekir. Aşağıda vereceğim birkaç satırlık kodu gerekli yere yapıştırdığınız zaman videolarınız mobil uyumlu hale gelecektir. Anlatmaya çalıştığım olayı aşağıdaki ekran görüntülerinden daha iyi anlayabilirsiniz.

Blogger'da Youtube Videoları Mobil Uyumlu Hale Nasıl Getirilir?

Görselden de anlaşıldığı üzere Youtube videoları mobil uyumlu olmadığı zaman, Youtube görseli tam olarak çıkmıyor ve en-boy oranında ise orantısızlık oluşuyor. Mobil uyumlu hale getirdiğiniz taktirde bu sorunu ortadan kaldıracak ve daha iyi görüntüleyebileceksiniz. Yazımı çok fazla uzatmadan kısaca yapmanız gerekenlere geçeyim ben.

  • Blogger Kontrol Paneli'nde bulunan Şablon > HTML'yi düzenle seçeneklerine tıklayın.
  • Kodların bulunduğu alana bir kez tıklayın ve Ctrl+F tuşlarına tıklayıp gelen arama ekranına ]]></b:skin> yazıp Enter tuşuna tıklayın.
  • ]]></b:skin> kodunu bulup bir üst satırına aşağıda vermiş olduğum CSS kodunu yapıştırın.
[/* CSS Only */ .post-body iframe{width:100%!important;} @media screen and (max-width:960px){ .post-body iframe{max-height:90%}} @media screen and (max-width:768px){ .post-body iframe{max-height:75%}} @media screen and (max-width:600px){ .post-body iframe{max-height:60%}} @media screen and (max-width:480px){ .post-body iframe{height:auto!important;max-height:auto!important}}]

  • Son  olarak Şablonu Kaydet seçeneğine tıklayın
Böylece Youtube videolarını mobil uyumlu görüntüleyebilirsiniz. Varsa sorularınız sorabilirsiniz. Ayrıca yapamayanlar için de yardımcı olurum. Peki sizler bu eklenti hakkında neler düşünüyorsunuz?

Yorumlar

Blogger: 33
  1. Her zaman ki gibi ilaç gibi bir yazı olmuş. Bende diyordum. Benim videolar niye böyle? Kalemine sağlık :)

    YanıtlaSil
    Yanıtlar
    1. Faydalı olduysam ne mutlu. Eklentiyi kullanarak videolarınızı düzeltebilirsiniz. Yorum için teşekkürler.

      Sil
  2. Deneyeceğim.Dilerim yapabilirim :)

    YanıtlaSil
  3. Yanıtlar
    1. Yorum için teşekkürler 😂 Faydalı olabilmek için burdayım.

      Sil
  4. Bilmeyenler için gerçekten temiz bir yayın olmuş. Seni bana da beklerim dostum :)

    YanıtlaSil
    Yanıtlar
    1. Kesinlikle dediğiniz gibi, yorum için teşekkürler.

      Sil
  5. En kısa zamanda deneyeceğim. Hiç bakmadım mobilede blogumdaki videoların nasıl gözüktüğüne.

    YanıtlaSil
    Yanıtlar
    1. Konu kullandım, çok iyi çalışıyor. Fakat en-boy oranında biraz oyna yapmak gerekli.

      Sil
    2. Tabiki isteğe göre en boy oranı da ayarlanabilir. Mesajımı dikkate alıp kullandığınız için teşekkürler.

      Sil
  6. Böyle bir şey arıyordum senin bloguna denk geldim Semih.
    Harikasın, kodlar çok güzel çalışıyor. Gerçekten istediğim gibi oldu şimdi
    Paylaşım için teşekkür ederim. Paylaşan ellerin dert görmesin :)

    YanıtlaSil
    Yanıtlar
    1. Abi klavyenden bal damlıyor be. Bu ne güzel kelimeler böyle. Aradığın birçok şeyin cevabı bende aslında, sadece bir mail uzaklığında.

      Sil
    2. Eyvallah kardeşim, bundan sonra daha sıkı takip edeceğim seni inşallah :) bu tür paylaşımlar her zaman dikkatimi çekmiştir :)

      Sil
    3. Bu tür paylaşımlar benim de dikkatimi çekiyor fakat ülkemizde yazan pek yok. Mecbur yabancı blogları takip edip anladıklarımı aktarmaya çalışıyorum işte.

      Sil
  7. Güzel çalışıyor fakat masaüstü görünümünde video çok geniş görünüyor.

    YanıtlaSil
    Yanıtlar
    1. Bu kodlar masaüstü görünümünü etkilemiyor. Embed kodu içerisindeki height ve width değerlerini istediğin değerleri yazarak istediğin görünüme kavuşturabilirsin.

      Sil
  8. Olmadı bende.Benim temam modil uyumlu acaba o yüzden mi olmadı?Acil yardım
    ruhsa.blogspot.com.tr baksanıza

    YanıtlaSil
    Yanıtlar
    1. Şu anda blogumda kullanıyorum ve gayet başarılı bir şekilde çalışıyor. Çalışmamasının sebebi kullandığınız temayla alakalı değildir diye düşünüyorum.

      Sil
    2. Peki önceden olan videolara etkisi var mi?

      Sil
    3. Blogunuza eklediğiniz tüm videoları mobil görünümde daha düzgün gösterir sadece.

      Sil
  9. Yanıtlar
    1. Kodları doğru bir şekilde yapıştırdığınıza emin misiniz? Şu anda kullandığım bir eklenti ve bende başarılı bir şekilde çalışıyor.

      Sil
    2. Evet yaptım mailinizi verirseniz ekran görüntüsünü göndereyim bide siz bakın lütfen

      Sil
  10. başkan ben bunun ayarları ile nasıl oynayabilirim mesela ben boyutunu telefoda 200 yabmak istiyorum yükseklik olarak bilgisayarda da 400 ama olmadı?

    YanıtlaSil
    Yanıtlar
    1. Kodlar içerisindeki height ve width değerlerini istediğiniz şekilde değiştireceksiniz.

      Sil
  11. Vallahi bravo çok teşekkürler. Bayadır bu konu hakkında araştırma yapıyordum bu konuyu görünce bir denemek istedim ve sonuç muhteşem

    YanıtlaSil
  12. süpersin kardeşim eline sağlık

    YanıtlaSil
  13. Çok işime yarayacak bir kod, teşekkür ederim

    YanıtlaSil

Ad

1. Cilt,1,100,1,1080P,1,11.22.63,1,12 Kızgın Adam,1,2018,1,4. Sezon,1,44. Çocuk,1,A Thousand Kisses Deep,1,Aksiyon Filmleri,3,Alcatraz'dan Kaçış,1,Alexa,2,Amelie,1,Analiz,1,Android,14,Android Haberleri,1,Android İpuçları,2,Android Uygulamaları,10,Animasyonlu İndirme Butonu,1,Anket,1,Antonio Banderas,1,Antremanlarla Matematik,1,Apk,2,Apk İndir,2,Arama Açıklaması,1,Arama Motorları,1,Araştırma,1,Arı,1,Ayrton Senna,1,Bana Dair,76,Base,1,Başarı,1,Başlık Efekt,1,Blog,2,Blog Keşif Etkinliği,1,Blog Nasıl Açılır?,1,Blogger,58,Blogger Eklentileri,18,Blogger Eklentisi,1,blogger haberleri,1,Blogger İpuçları,18,Blogger İstatistikler Widget'ı,1,Blogger Nedir,1,Blogger Sayfa Kaydırma Efekti,1,Blogger Sorunları,1,Blogger Tavsiyeleri,1,Blogger Temaları,6,Blogger Widget'ları,7,Blogger Yedekleme,1,Boks,1,Buton,2,camera,1,Can Dostum,1,Checker Gmail,1,Child 44,1,Chroma Keyboard,1,Cillian Murphy,1,Clev Note,1,CSS,2,Deadpool,1,Deadpool İndir,1,Diğer Kategoriler,10,Dinlediklerim,5,Dives İkon,1,Dizi,1,Dizi Replikleri,1,Drama Filmleri,3,Drop Caps,1,Duvar Kağıtları,1,Düşünce,1,Editörün Seçtikleri,4,Eklenti,2,Elementary,1,Etkileşim,1,Etkinlik,1,exi2.net,1,Fabrizio De André,1,Facebook,1,Film,6,Film İncelemesi,1,Film Puanlama,1,Film Replikleri,2,Filmler,6,First Character,1,First Letter,1,Flat İcon,1,Font,1,Forever,1,Formula 1,1,Forrest Gump,2,Frank Sinatra,1,Fringe,3,Galeri,5,Gary Oldman,1,Geçmişin Gölgesinde,2,Gerilim Filmleri,2,GetSiteControl,2,Google,2,Google Chrome,2,Google Fonts,1,Google Friend Connect,1,Google Plus,1,Google+,1,Google+ Toplulukları,1,Görsel,2,Guadalupe Pineda,1,Hayal Gücü Yüksek Sorular,1,Hayat ve Düşünce,1,Historia De Un Amor,1,HTML,2,Hugh Jackman,1,Instagram,1,Intoucheables,1,İcon,1,İkon Paketleri,1,İndex,1,İndir,4,İndirme Butonu,1,İnfografik,1,İstatistikler,1,İzlediklerim,20,Kalıcı Bağlantı,1,Kaliteli Blogger Eklentileri,1,Kaptan Amerika Kahramanların Savaşı,1,Kim Bu Semih,1,Kimdir,1,Kingsman: Gizli Servis,1,Kişisel Blog,9,Kişisel Yazılar,43,Kitap,1,Kullandıklarım,5,Launcher,1,Leonard Cohen,1,Logan,1,Logo Efekt,1,Lost in Translation,1,Material,2,Material Design,3,MeloCloud+ Music Player,1,Meta Açıklaması,1,Mijia Quartz Watch,1,Mim,10,Minimal Design,1,Mobil,2,Mobil Uyumlu Blogger Temaları,1,Muhammad Ali,1,Muhammad Ali Sözleri,1,Muhammad Ali'nin Hayatı,1,Müzik,7,Müzisyen,1,Nah Neh Nah,1,Nasıl Yapılır,5,Nasıl Yapılır?,3,Nedir,3,OGInstagram,1,Okuduklarım,2,Osmia Avosetta,1,Önemi,1,Öp Evlen Uçurumdan At,1,Özel Başlık Etiketleri,1,Paris'te Gece Yarısı,1,Paylaşım,1,PC,2,PC Uygulamaları,1,Peaky Blinders,2,Peppino Gagliardi,1,Pocket,1,Popüler Yayınlar,1,Radiogram,1,Radyo,1,Renato Carosone,1,Replikler,2,Repo Men,1,Resim ve Video,1,Resimli İndirme Butonu,1,Responsive,2,Robots txt,1,Rodrigo Amarante,1,Romantik Filmler,1,Root,2,Satın Aldıklarım,1,Schindler'in Listesi,2,Scroll Smooth,1,SEO,3,SEO Ayarları,1,Shareaholic,1,Shareit,2,Sherlock,3,Sherlock Holmes,1,Sıralama,1,Sinema,1,Site Haritası,1,Social Meter,1,Sosyal Medya,2,Soundcloud,1,Sözler,1,Spor,1,Sting,1,Tasarım,1,Tavsiyelerim,1,Teknoloji,1,Tema,1,Template Clue,1,The Blacklist,1,The Mentalist,2,The Mentalist Replikleri,1,The Pianist,1,Tom Hardy,2,Tozlu ve Yıkık Blog,1,True Detective,2,Tuyo,1,TVShow Time,2,Uygulama,1,Ücretsiz İkon,1,Üst Sıralara Çıkmak,1,Vaya Con Dios,1,Video,2,Videolar,1,Website,1,WhatFont,1,Woorank,1,Word Count,1,Wordpress,1,Xiaomi,1,Yabancı Diziler,9,Yabancı Radyo,1,Yardımlaşma,1,Yayın Ayarları,1,Yaz Tatili,1,Yazar Olmak,1,Yazı,2,Yazı Kutusu,1,Yazı Yazmak,1,Yıl Dönümü,1,Yıldız Sıralamalı,1,Yıldızlararası,1,Youtube,1,Ziyaretçi Trafiği,1,
ltr
item
Semih Keçecioğlu - Kişisel Blog: Blogger'da Youtube Videoları Mobil Uyumlu Hale Nasıl Getirilir?
Blogger'da Youtube Videoları Mobil Uyumlu Hale Nasıl Getirilir?
Blogger'da Youtube videolarını responsive (mobil uyumlu) hale nasıl getirebileceğinizi anlatan bilgilendirme yazısı.
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLM_tdcH3t6VZHDbL2cVM45h_RkZ-r6BZh7nSmeX_Uj8OeSd4boFBBXekE5zaE4QNeWBRYNoqiYMdfANRpbE0USxc1y2VDi9EjLsAcij8Ugj92BmgHHAS0nwHlMljFxOmk6I4fmf-80Jc/s640/Blogger%2527da+Youtube+Videolar%25C4%25B1+Mobil+Uyumlu+Hale+Nas%25C4%25B1l+Getirilir.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLM_tdcH3t6VZHDbL2cVM45h_RkZ-r6BZh7nSmeX_Uj8OeSd4boFBBXekE5zaE4QNeWBRYNoqiYMdfANRpbE0USxc1y2VDi9EjLsAcij8Ugj92BmgHHAS0nwHlMljFxOmk6I4fmf-80Jc/s72-c/Blogger%2527da+Youtube+Videolar%25C4%25B1+Mobil+Uyumlu+Hale+Nas%25C4%25B1l+Getirilir.png
Semih Keçecioğlu - Kişisel Blog
https://semihkececioglu.blogspot.com/2016/07/bloggerda-youtube-videolari-mobil-uyumlu-hale-nasil-getirilir.html
https://semihkececioglu.blogspot.com/
https://semihkececioglu.blogspot.com/
https://semihkececioglu.blogspot.com/2016/07/bloggerda-youtube-videolari-mobil-uyumlu-hale-nasil-getirilir.html
true
3247702708061337910
UTF-8
Tüm yazılar yüklendi. Hiçbir yazı bulunamadı. Tümünü Gör Devamını Oku Yanıtla Yanıtlamaktan Vazgeç Sil Yazan: Ana Sayfa Sayfalar Yazılar Tümünü Gör BENZER YAZILAR Etiket Arşiv Ara Tüm Yazılar Bulunamadı Geri Ana Sayfa Pazar Pazartesi Salı Çarşamba Perşembe Cuma Cumartesi Paz Pzt Sal Çar Per Cum Cmt Ocak Şubat Mart Nisas Mayıs Haziran Temmuz Ağustos Eylül Ekim Kasım Aralık Oca Şub Mar Nis Mayıs Haz Tem Ağu Eyl Eki Kas Ara şimdi 1 dakika önce $$1$$ minutes ago 1 saat önce $$1$$ hours ago Dün $$1$$ days ago $$1$$ weeks ago 5 haftadan uzun bir süre önce Takipçiler Takip Et Premium STEP 1: Share to a social network STEP 2: Click the link on your social network Tüm kodları kopyala Tüm kodları seç Tüm kodlar kopyalandı Çalışmazsa CTRL+C kombinasyonunu kullan Table of Content