Bloggerınızda Kod Penceresi yapımını size Blogger Kod Penceresi Yapımı yazımıda gösterdik. Şimdi daha değişik bir yöntem ile Göster/Sakla yöntemi ile değişik bir kod penceresi yapımı göstermek istiyoruz. Bu kod penceresi size neler kazandıracak?
- Daha düzenli bir görünüm
- Daha kısa ve anlaşılır bir yazı
- Daha basit anlatım
</head> tagını bulun ve ondan önce aşağıdaki kodları yapıştırın
<style type="text/css">
/* Göster/Sakla Kod Penceresi 10LineNET */
.spoilerbutton {display:block;margin:5px 0;}
.spoiler {overflow:hidden;background: #f5f5f5;}
.spoiler > div {-webkit-transition: all 0.2s ease;-moz-transition: margin 0.2s ease;-o-transition: all 0.2s ease;transition: margin 0.2s ease;}
.spoilerbutton[value="Göster"] + .spoiler > div {margin-top:-100%;}
.spoilerbutton[value="Sakla"] + .spoiler {padding:5px;}
</style>
Bu işlemi bitirdikten sonra geriye HTML kısmı kaldı. aşağıdaki kodları bu özelliği kullanmak istediğiniz yere yapıştırın.
<input class="spoilerbutton" type="button" value="Göster" onclick="this.value=this.value=='Sakla'?'Göster':'Sakla';"> <div class="spoiler"><div> Saklanacak ve gösterilecek içerik buraya </div></div>
Şimdi bu özelliği kod penceresi olarak nasıl göstereceğiz diyenler için burdaki yazıda anlattığımız yazılanları yaptıktan sonra <pre><code>Kodları Buraya Yazın</code></pre> şeklinde kod kullanımını aağıdaki gibi düzenlemek olacak.
<input class="spoilerbutton" type="button" value="Göster" onclick="this.value=this.value=='Sakla'?'Göster':'Sakla';">
<div class="spoiler"><div>
<pre><code>Kodları Buraya Yazın</code></pre>
</div></div>
Umarım faydalı olur. Hata ile karşılaşan olursa lütfen bize bildirin.
kişi tarafından okundu.
tsk ederim hocam soruma hemen makale hazirlayip cvp verdiginiz icin, ben yaptim demo linkim de su link, http://demotestin.blogspot.com/2013/03/piyanist.html burada goster sakla butonlarini degistirip hakkinda butonu fragman butonu izleme secenekleri butonu yorumlar butonu gibi butonlari yanyana yatay sekilde olusturmak istiyorum, yani hakkinda butonuna basan film hakkinda bilgi alacak fragman butonuna basan fragman videosunu gorecek izleme secenekleri butonuna basan izleme linklerini gorecek, tum bu butonlarin ornekteki linkim gibi alt alta olmasini istemiyorum yanyana olsun, boyle bir sey yapabilme imkanimiz var mi
YanıtlaSilmerhaba hocam tablar ile birseyler yapabilirim ama bunu alternatif olarak sakliyorum, yani onceligim size bahsetmis oldugum kutucuklar seklinde. bu tablar elbet isimi gorur ama eksik kalacaktir.
YanıtlaSilburada benim yapmak istedigimi soyle anlatayim size. bir sinema sitesi yapmak istiyorum, insanlari ayrintilarla ve reklamlarla bogmayacak, sosyal iletisimi guclu bir sinema sitesi. boyle bir site ancak sosyal yonu agir basan bir temadan gecer. insanlar genelde wordpress altyapisini kullanarak ve reklamlarla sisirerek bir sinema sitesi yaparlar, bu boyle olmaz. ne yorum bolumu adam gibidir ne film bolumu, hep ayrintilarla gereksiz bilgilerle sinema siteleri tabiri caizse copluk gibi olmustur. insanlar film yayinlayip adeta kacarlar. ben boyle bir sey yapmak istemiyorum. ayrintilari ve film bilgilerini o kutucaklarin icine saklicam, amacim temiz goruntu. sitenin iletisim yonunu gelistirerek insanlarin bir aile ortamina geldigini hissetmesini ve birbirleriyle iletisim kurmasini istiyorum, film seyret cik git olsun istemiyorum. bu ise belli bir butce de yatiricam ama yapmisken her seyi dort dortluk yapmak istiyorum ve bu isin benim icin temel noktasi o kutucuklari yanyana koymak gerisi corap sokugu gibi gelecektir.
bu site isinde idolum dizimag com dur, mukemmel ve her sey yerli yerinde, gerci dizi sitesi ama hizlilik olsun tema olsun hizmet olsun cesitlilik olsun her seyin yerli yerinde olmasi olsun avrupai capta, yani cok kaliteli. simdi bu siteden ornek vermek gerekirse http://www.dizi-mag.com/arrow adresine gittiginizde bilgi forum yorum benzer reyting poster gibi menuler var. aynisini bende yapmak istiyorum ama menu olarak degil, kutucuklar seklinde, sizden istedigim bu kutulari yanyana getirmek. onceki yaptigimiz goster gizle kutularini alt alta degil de yanyana yapablir miyiz ve tablari kullanmadan, bunu yaparsam temamin yuzde ellisi tamamlanmis demektir
Çok basit bir şekilde deneyin yukarda verilen kodu yazı eklerken html kısmında yan yana yazın. arada boşluk olmamasına dikkat edin. Sonucu yazarsanız sevinirim. Olmazsa başka birşey deneyelim
YanıtlaSildediginiz gibi yaptim bu adrese yaptim ama olmadi aaabbb gibi bitisik kelime yazip ayni kodu aaa ve bbb kismina yapistirdim olmadi adres http://demotestin.blogspot.com/2013/03/96-saat-taken-online-izle2008.html sayin admin bu temanin adresi demo ve indirme linki http://www.mastemplate.com/2013/02/johny-prett.html adresinde. isterseniz ayni tema uzerinde bir de siz deneyin...tekrar tskler.
YanıtlaSilŞimdi zaman bulup denedim, fakat imkansız gibi farklı bir eklenti, kod kullanmadan. Siz bunun örneğini herhangi bir yerde gördünüz mü? Ordan yardım alabiliriz. Nasıl yaptığına bakabiliriz. Açılıp genişleyen birşey olduğundan yandakinide etkiliyor. Bu sefer görüntü olarak çirkin birşey oluyor.
YanıtlaSilhttp://jqueryui.com/tabs/ burası bence yapmak istediğin şey tam olarak. Görüntü olarakta çok iyi diyebiliriz. Sizin için bir örnek göstereyim, http://sitildene.blogspot.com/2013/03/goster-gizme-deneme.html burda harika oldu yani bence. hem uygulanışı kolay hem de hızlı. Zaten jquery bir devrimdir. Bende kullanmayı düşünüyorum.
YanıtlaSilSiz ilk açıldığında tab'ın açık olduğunu düşünüyorsanız eğer ilk taba düzegün birşeylar koyabilirsiniz. ya da http://sitildene.blogspot.com/2013/03/spoiler-jqry-tab.html şeklinde saklayabilirsiniz. Ama yan yana getirileceğini sanmıyorum. Aslında ben getirdim ama dediğim gibi açıldığında altta genişleyen bir içerik olduğundan iki buton arasındaki mesafe açılıyor. Bu nedenle çirkin bir görüntü oluşuyor. Butonun altındaki içeriği yok sayamadım. Belkide daha bilgili birine sormalısınız. WMaracinda konu açmayı denediniz mi? Burdaki kodları verin bunlar nasıl yan yana koyarım deyin. Eğer bilen varsa mutlaka yardımcı oluyorlar. Ama dediğim gibi jquery en mantıklısı ve en düzgünü
http://jqueryui.com/tabs/ bunu bu blogun kod gösterim kısımlarını daha düzenli hale getirmek için uygulamaya karar verdim. Bakalım ne kadar stabil çalışıyor.
YanıtlaSilevet galiba imkansiz sadece size degil bircok kod bilen arkadasa sordum ancak cozum yok, onlarda tab seceneklerine yonlendirdiler. bir arkadas sana kodlari duzenleyeyim dedi 2 gundur bekliyorum hala, neyse saglik olsun bende tablar ile bir sey yapmaya calisirim,ama tespitin dogru ilk acildiginda tabin acik olacak olmasi canimi sikiyor, ilk basa fragman konmasinin yerini adam akillli ve estetik film bilgileri ile doldurmam gerekecek veya afis olacaktir, saklama secenegi tek bir butonla olursa guzel olmaz. neyse sende zahmet edip bu kadar ugrasip ilgilendin, cozumler uretmeye calistin, cok tsk ederim,valla baba adamsin. tema ve kodlarla alakali baska konularda takildigimda sana yine sormak isterim hatta aklimda bi tane bile var, su benim demo linkin anasayfasinda ki resimler iki kat buyuk olamaz mi...
YanıtlaSilanasayfadaki hangi resimler acaba. Slider gibi birşey var ama ben açtım hiçbir resim göremedim orda sadece üstte kategoriler dönüyor herhalde. Diğer resimlerde gayet yerinde detaylı bilgi verirsen yardımcı olmaya çalışırım
YanıtlaSilanasayfadaki latest article seritinin hemen altinda 7 resim var. resmin uzerine geldiginde arkasinda yazilar olan kismi diyorum, her ne kadar yerinde gibi dursada yinede bir bucuk veya iki kat daha buyuk olmasi, temada nasil dururdu diye merak ediyorum. buradaki amacim resmin uzerine geldiginde ve resim kayboldugunda arkada cikacak yazilara daha cok bilgi eklemek istiyorum, gerci resim ebatinin buyumesi ile yazi coklugu arasinda baglanti var mi bilmiyorum.bu konuda da site ornegim baglanfilmizle com adresidir. anasayfadaki resimlerin arkasindaki bilgiler fena degil.
YanıtlaSilbir de o resimlerin uzerinde 5 tane yildiz var. o yildizlari atip, yildizlarin yerine bir baska birseyler koymak mumkun mu. ornegin izlenme sayisi veya tr dublaj alt yazili gibi veya imdb linki gibi veya baska bir widget eklenti . gerci o yildizlar graddit adresine gidiyor ve orda yesil kirmizi el gibi youtube tarzi cok hos widget var ama secenekler ne kadar fazla olursa o kadar iyi benim icin...tekrar tesekkurler...bu arada slider kismina da etiket girmedigim icin slider kisminda resim yok, yoksa orada dedigin gibi kategori donuyor.
müsait bir zamanda bakayım
YanıtlaSilYıldız kısmının gayet güzel olduğunu söylemek isterim. Gerçek bir değerlendirme şeklinde olmuş. Bununla beraber örnek verdiğin sitenin blogger olmadığını biliyorsunuzdur. Blogger kodları biraz daha zor gibi geliyor bana. Resimleri büyüttüğünüzde arka bilgiler ne durumda olur bilemiyorum. ama kodlarınızıda ilgili yeri bulun kelime uzunluğu ile ilgili bir kod var mı bakın. Bu kodlarla oynayarak daha fazla bilgi gösterilmesini sağlayabilirsiniz.
YanıtlaSilsayin admin tesekkurler, yildiz kismi pek fonksiyonel degil diye tercih etmiyorum, resim kisminida ugrasicaz artik ne yapalim...
YanıtlaSilkolay gelsin. bu yaptığınız bütün değişikliklerin seo açısından da siteyi etkileyeceğini unutmayın. sitenin geç açılması gibi olumsuzluklara neden olabilen değişikliklere ve kodlara dikkat etmek lazım. örneğin ben geçen gün bu tür film sitelerini gezerken bir tanesini direk kapatmamın tek sebebi geç açılmasıydı.
YanıtlaSilmuhakkak ama zannedersem bloggerda daha hizli acilma icin javascript in etkisini azaltan kod uygulamalari var genede yaniltici bilgi vermek istemem. ayrica cok gec acilma diye birsey pek fazla soz konusu degil bence. cunku ben videoyu siteme yuklemicem zaten host yok embed kodlarini da koymucam bilgileri metin seklinde vericem senin o jquery dedigin yerden yaparsam zaten hizli orasi, yani eklentilerle kodlarla o kadarda bogmuyacagim siteyi zaten. mesela film de gecen muzikleri koyucam ama youtube adresine link vericem yani suanlik oyle dusunuyorum, mesela filmin embed kodunu koymayip upload ettigim 3-4 sitenin linkini vericem. bunun disinda sitemi kasan seyler neler olabilir sen soyle.
YanıtlaSilbirde su var hep eskiden beri dusunurum, seo acisindan sitenin tasarimsal olarak gelismis olmasi mi onemli yoksa sitenin hizli acilmasi mi. mesela mashable gec aciliyor, ayni sekilde armorgames adresi de biraz gec aciliyor ve daha bir cok site gec acilmalarina ragmen basi cekiyor. yani seo acisindan iki onemli kavram dan tasarim ve tasarimla birlikte verilen hizmet daha onemli bence. sitenin gec acilmasi goreceli olarak daha az oneme sahip. ama tabiiki sitenin hizli acilmasi da onemli.ben seoyu oyle aham saham kafaya takmiyorum bir de bu var. yillarca seoyu arastirdim test ve denemeler yaptim ama geldigim nokta su oldu. tasarim, bilgi,hizli hizmet ve guven. sitenin gec acilmasi, dofollow, nofollow, link cikisi, reklamin yer konumu, backlink alma, yorum backlink,pr degeri,on-of page seo,marketing calismalari vs gibi envai cesit seo uygulamasindan geldigim nokta tasarim, bilgi, hizlilik ve guven oldu. artik su seo dunyasinda gorecelilik kavraminin da ortaya konmasi gerekiyor, bir ana temel seo calismalari vardir bir de goreceli oneme sahip seo calismalari.ana seoyu site uzerindeki tasarimin,bilgin ve bilgiyi veris seklin olusturur. diger butun hersey teferruattir gozumde. tasarimini begenen bilgilerini de guzel bulan, dilinden uslubundan hizmetinden hoslanan zaten senden ayrilmayacaktir, ben adini vermek istemedigim bir blogumda hic tanitim ve seo calismalari yapmadigim halde yuzlerce takipcim olmustu,bazi makalelerde googlede illk siradaydim sonra devam ettirmedim sitemi,bir seye sinirlendim biraktim.hatta suan bir blog acsam siyaset ekonomi din guncel mevzular internet ve dunyasi uzerine yazilar yazsam, kendime inaniyorum bir yilda yuzlerce takipcim binlerce yorumum olur, cunku kendime,bilgilerime ve bilgileri veris seklime guveniyorum, neyi nasil yapacagimi biliyorum.biraz buyuk konustum ama gercek bu sayin admin.hatta baska bir blogumda 3 aylik bir blogdu gundelik yasantim ve dusuncelerimi yaziyordum geldigim nokta da bir suru yorum,bir suru begeni ve yuksek okunma sayisi. halbuki hic seo calismalarim olmadi o sitelerde.o siteyi biraktim sonra,bende devamlilik sorunu var galiba.mesela wp den hic seo calismasi yapmadigim bir oto blog olusturdum rss den icerik aktariyordum otomatik olarak, kopya icerigi google uste tasimaz ama orada bile facebook twitter takipcilerim fena degildi,tabi yorumlarda fena degildi ama spam yorumlar bir hayli vardi. ama sitenin tasarimina onem vermistim. yani seonun temelini gorece onemi az uygulamalar degil, tasarim bilgi ve guven olusturur, sonra hepsi kendiliginden gelir, hatta az bir seo calismasi yapsan daha da iyi yerlere gelir siten. gunumuzde insanlar kendi sitesinin temelini oturtmadan seoyu disarda facebook youtube yada forumlarda ariyorlar, halbuki seo kendi sitenden baslar.
yani benim yapacagim film sitesinde site kasilmasini onemsiyorum ama halledemiyecegim bir sorun gibi gozukmuyor.biraz uzun yazdim heralde uzun zamandir bir blog makalesi yazmadigimdan, yazi yazma acligimi gidermek icin boyle uzun yazdim, umarim fazla sikmamisimdir...
Açıkcası hepsini okudum, okumam gerekir :) Şöyle birşey var sitenin hızlı açılması veya açılmaması bir çok nedene dayanbilir. Serverla ilgili problem olabilir siteden kaynaklanmasa bile. Benim orda dediğim küçük bir nedendir. Kodlarla çok oynarsan yaptığın ama gözle görülmeyen bir hata bile sitene olumsuzluk kazandırabilir. Yavaş açılır, sitenin bir yeri bir tarayıcının herhangi bir sürümünde bozuk görünüt ya da açılmaz gibi. Site geç açılsa bile çok başarılıda olabilir. Herşey arama motorunda bitmiyor saonuçta direk gelen ziyaretçilerde çok önemli. Arama motorları bunuda değerlendiriyor. Genel olarak senin ne kadar hizmet verebildiğine ve ne kadar yararlı olabildiğine bakıyor. Arama motoru için yapıldığından seo'nun kişiye özel birşey olacağınıda düşünmüyorum ben açıkcası. Arama motoruna öze yapılabilir ama :)Umarım başarılı olursunuz çünkü bende takip etmek isterim. Sizden iyi haberler beliyoruz.
YanıtlaSilevet bir de su devamlilik sorunum olmasa, birakip kacip gitmesem biseyler olucak...
YanıtlaSilmerhaba hocam nasilsin bugunlerde epey arastiriyorum ama biri olmadan galiba basaramayacagim. simdide tooltips lere taktim. linkin uzerine geldiginde resmin cikmasi tooltiplerle oluyormus onu ogrendim ama bir turlu bloggera nasil entegre edildigini yapamadim. ornegin su sitede http://www.hotajax.org/jquery/tooltips/69-jquery-imgpreview.html linkin ustune gelince gunesli manzara cikacaginin ornegini vermis. ornegin su sitede download uzerine gelince yine resimli bilgi cikiyor http://jquerytools.org/demos/tooltip/any-html.html . bir de dizimag dan ornek vereyim http://www.dizi-mag.com/prison-break sol tarafta oyuncularin uzerine geldiginde oyuncuarin resimleri cikiyor. iste boyle bir seyi bloggerda uygulamak mumkun mu, mumkunse nasil, tesekkurler...
YanıtlaSilBlogger'ın en kötü yanı ne biliyor musun Wordpress kadar basit olmaması. Örneğin bu Tooltipleri Wordpress'e daha basit ve etkin şekilde eklenebiliyor. eklenti yardımıyla elbette ama Blogger'da öyle birşey yok. Bunu eklemek için her yazıda ve her uygulayacağınız yerde ayrıca kod kullanmanız gerekecek. Biraz zahmetli olabilir ama yakın zamanda anlatacağım. Burdan yine size link veririm. Umarım işinizi görür.
YanıtlaSilBlogger'ın en kötü yanı ne biliyor musun Wordpress kadar basit olmaması. Örneğin bu Tooltipleri Wordpress'e daha basit ve etkin şekilde eklenebiliyor. eklenti yardımıyla elbette ama Blogger'da öyle birşey yok. Bunu eklemek için her yazıda ve her uygulayacağınız yerde ayrıca kod kullanmanız gerekecek. Biraz zahmetli olabilir ama yakın zamanda anlatacağım. Burdan yine size link veririm. Umarım işinizi görür.
YanıtlaSilTekrar merhaba; bazı kodlarda biraz düzenleme yaparak şöyle bir örnek çıkardım. http://webmaster.10line.net/2013/04/bloggera-tooltip-eklemek.html Bundan sonraki bu tarz kodları ilgilendiren konuları bu sitede paylaşacağım. İnceleyip fikirlerinizi bildirin. Belkide araştırarak blogunuza kolay bir şekilde entegre edebiliriz.
YanıtlaSiltsk ederim hocam kodu uyguladim sorun verdi ilgili adresine yorum biraktim. kodlarla ilgili paylasimlariniz icin bu adresde bilgi verecek olmaniz guzel olmus, ayrica bu webmaster subdomaini nasil yaptiniz ben gecen yil o kadar arastirdim wordpress icin buldum ve yaptim ama blogger icin bir turlu beceremedim acaba yeni bir domain mi almak gerekiyor...
YanıtlaSilGodaddy kullanıyorum. Yapmam gereken sadece DNS ayarlamak oldu. Başka birşeye gerek yok. Bunuda çok yakın zamanda anlatmayı düşünüyorum yine webmaster blogunda. Çünkü internette anlatılanlara baktım hem eksik hem anlaşılır değil hem de özellikle Godaddy DNS arayüzü değişimiş gibi. Anlatılan arayüz şimdikine hiç benzemiyor. Az çok bilen birileri belki aradığınız bulabilir ama daha önce bu işlemi yapmayanlar için basit bir anlatım yayınlamak istiyorum. İlginize teşekkür ederim.
YanıtlaSilvalla super olur yalniz anlatimlarinizi masaustu ekran programlari veya screen com gibi araclarla videolu yapabillirseniz daha super ollur.benim sinema sitem icin de muhtesem olur bu subdomainler.
YanıtlaSilŞu an anlatıyorum görsel ekliyorum. Umarım faydalı olur. Kapsamlı şekilde yapıyorum. En son subdomain eklemek kısmına geleceğim
YanıtlaSilhttp://webmaster.10line.net/2013/04/bloggera-subdomain-eklemek.html adresinde subdomain yönlendirmek ile ilgili detaylı bir anlatım yaptım. Sorularınız olursa bana yine sorun açıklamak isterim.
YanıtlaSiltesekkurler hocam inceleyecegim google sifrem telefonuma bagli oldugundan telefonumda suan servis disi oldugundan girip deneme imkanim olmadi ama deneyecegim.
YanıtlaSilbir de hocam bende sorular cok da hepsini birden siralamak istemiyorum ozellikle bu sinema sablonu icin orjinal bi sey yapmak istiyorum, bu bakimdan cok soru sormam lazim ))))
Mutlaka sorun. Bizde çok merak ediyoruz.
YanıtlaSil