En iyi ve en yeni blogger temaları Tam Bir Blogda

Blogspot için her gün yepyeni profesyonel temalar hazırlanıyor. Bunları sizlere sunmaya devam ediyorum.
En iyi ve en yeni blogger temaları Tam Bir Blogda

Photoshop hiç bu kadar kolay olmamıştı.

Resimlerinize efekt uygulamak için saatlerce uğraşmanıza gerek kalmadı.Photofunia size bunu tek tıkla sunuyor.Yapmanız gereken tek şey resmi upload etmek. Tam Bir Blog logosuyla yaptığım çalışmalarla sitenin ne kadar eğlenceli olduğunu görebilirsiniz.
Photoshop hiç bu kadar kolay olmamıştı.

Blogger İpuçları ve Önemli Noktaları

Daha iyi bir blog için neler yapabilirsiniz? Tüm ince noktalar,hileler, yeni ve kullanışlı araçlar...
Blogger İpuçları ve Önemli Noktaları

Blogger Resimli Son Yazılar Eklentisi

Bu eklenti sayesinde son yazılarınızı resimleri ve yorum sayısıyla birlikte blogunuzda gösterebileceksiniz. Hem kullanışlı hem de görsel açıdan zengin ve tasarımınıza göre ayarlarıyla oynayabilirsiniz:
Blogger Resimli Son Yazılar Eklentisi

Blogger'a Smile Ekleyin.. Yazılarınız Şenlensin:D

Blogger'da çok smile kullanmak istemez misin. Yalnızca Firefoxta kullanabileceğiniz bu eklenti sayesinde artık yazılarınız daha renkli, daha sevimli...
Bloggera Smile Ekleyin.. Yazılarınız Şenlensin:D
blogger sorgusu için yayınlar alaka düzeyine göre sıralanmış olarak gösteriliyor. Tarihe göre sırala Tüm yayınları göster
blogger sorgusu için yayınlar alaka düzeyine göre sıralanmış olarak gösteriliyor. Tarihe göre sırala Tüm yayınları göster

Blogger (Blogspot) Şablonları (Templates)

Blog sitesi olmayan kaldı mı? İnternet ile alakalı olup da blog sitesi olmayan çok az kişi kaldı. Bedava Blog servisleri sayesinde fazla bilgi ve zahmete gerek kalmadan birkaç adımda internette yer edinebiliyorsunuz. Bu servisi sunan en popüler site tabii ki blogger.com. Google satın aldıktan sonra popüleritesi daha da arttı.

Bir şekilde blogger'dan site oluşturduysanız varolan şablonu beğenmeyebilirsiniz. Kendinize özel hoş bir şablon arıyorsanız aşağıdaki linklere başvurabilirsiniz.



kaynak: kaynakçı
5 Eylül 2008 Cuma

Blogger Yorumlara Avatar Ekleme

Yepyeni, mükemmel bir eklentiyle daha karşınızdayım.Blogger Gravatar Eklentisi... Bu eklentiden haberim olmasını sağlayan Savaş Çocukları'na ve eklentinin sahibi o-om'a teşekkür ederim...
Bu eklentinin ismi sanırım wordpress'te gravatar olarak geçiyor. Eklentiyi kurmadan önce MyBlogLog sitesine kayıt oluyoruz ve kayıt olduktan sonra My sites and Services bölümünden tüm kullandığımız sosyal ağ sitelerini ve websitemizi kaydettiriyoruz. Burada en önemlisi tabii ki blogger'ı kaydettirmek, avatarımızın gözükmesi için bu şart.
Peki Blogger id'mizi nasıl bulacağız?
Blogger'a giriş yaptıktan sonra profili görüntüle kısmına tıklıyoruz.
Açılan pencerede tarayıcımızda gözüken id numaramızı alıp MyBlogLog'da blogger servisine kaydediyoruz. İsterseniz add website bölümüne tıklayarak da blogunuzun MyBlogLog'da yer almasını sağlayabilirsiniz. Bu işlemleri yaptıysak artık kodlarımıza geçip yorumlara avatar ekleyebiliriz. Bu blogger için büyük bir gelişme:D
MyBlogLog sitesine nasıl blogger id kaydedilir? Resimli açıklama:
Önce profilimizdeki gülücük resmine tıklayıp profil kısmına geliyoruz ve burada change image kısmına tıklayarak avatar resmimizi yüklüyoruz.

Avatar resmini yükledikten sonra anasayfaya tekrar dönüp servisleri ve websitemizi ekliyoruz.
(Önemli olan blogger idsi elbette, websiteniz tercihinize kalmış...)



Eklentinin görünümü:


Bir dakika yazıma devam etmeden önce yazılarımı kendine mal eden arkadaşlara sesleneyim, emeğe birazcık saygı gösterin ben burada zamanımı harcayıp bir şeyler paylaşmaya çalışıyorum. Emek hırsızlığına artık bir son verin!!!

Türkiyede İlk defa Tam Bir Blog'da...:)))


Html kodları:
1. Blogger'a giriş yapıyoruz.
2.Yerleşim---->Html'yi Düzenle---->Widget şablonlarını genişlet.
3.Html kodlarımızdan </head> kodunu buluyoruz.
4. Head kodunu bulduktan sonra. Bu kodun önüne aşağıdaki kodları yapıştırıyoruz.





<script type='text/javascript'>
//<![CDATA[
/*
Merlinox and Napolux MyBlogLog Avatar Creator
created by Merlinox (blog.merlinox.com)
helped by Napolux (www.napolux.com)
turkish by TamBirBlog (http://tambirblog.blogspot.com)
version 0.1 (20061214)
version 0.2 (20061215)
compatible with all blogger blog
*/




if(typeof(myLayer)!='function'){
function myLayer (x){
//individuo l'oggetto
if(document.layers){ // browser="NN4";
lay=document.layers[x];
}
if(document.all){ // browser="IE";
lay=eval("document.all." + x);
}
if(!document.all && document.getElementById){ // browser="NN6+ or IE5+ if you're willing to dump the !document.all stuff";
lay=document.getElementById(x);
}
return lay;
}
}


//lo prendo da blogger
function myBlogAvatar(codiceCommento,autore,stile){
//scrivo lo span
//var myBlogSpan = "myBlog-" + codiceCommento;
//document.write("<span id='" + myBlogSpan + "'><i>myBlogLog...</i></span>");
//metto tutto minuscolo perchè indexOf è case sensitive
if (autore != ""){
alt="MyBlogLog: " + autore;
myBlog = "<a target='_blank' href=\"http://www.mybloglog.com/buzz/co_redir.php?href=" + autore + "\" rel='nofollow'><img src=\"http://pub.mybloglog.com/coiserv.php?href=" + autore + "\" alt=\"" + alt + "\" title=\"" + alt + "\" border=\"1\" class=\"myBlogAvatar\"></a>";
//myLayer(myBlogSpan).innerHTML = myBlog + myLayer(myBlogSpan).innerHTML;
//myLayer(myBlogSpan).innerHTML = myBlog;
document.write(myBlog);
}
}
//]]>
</script>


5.Kodları yapıştırdıysak şimdi <b:loop values='data:post.comments' var='comment'> kodunu temamızın html kodlarında arıyoruz.
Bulduk mu? Bulduysak süper 6. adıma geçebilirsiniz.

6.Bulduğumuz kodun hemen önüne ve arkasına aşağıdaki kodları yapıştırıyoruz. http://tambirblog.blogspot.com





<div style='border:0;float:left;margin: 0 5px 0 0;'>
<script>
myBlogAvatar('<data:comment.id/>','<data:comment.authorUrl/>');
</script>
</div>

7. Artık işimiz bitti. Temayı kaydedip çıkıyoruz ve artık yorumcularınızın avatarları var.


NOT:
*1.Tam Bir Blog, daha iyi bir blog için çalışmalarına devam ediyor sizde blogumu desteklemek istiyorsanız sidebardaki (yan menüdeki) email ile üyelik kısmında bloguma üye olabilir, sitene ekle bölümünden blogumun ufak butonunu sitenize ekleyebilir ya da destek verin bölümündeki bannerlerden 1 tanesini sitenize yerleştirebilirsiniz. Blogumu takip ettiğiniz için ve destekleriniz için binlerce kez teşekkürler:))

**2.Bu eklentiyi kumadan önce lütfen şablonunuzun yedeğini alınız. Şablonunuzun başına gelebilecek herhangi bir problemden Tam Bir Blog sorumlu değildir:)))

Temama bende bu eklentiyi kurdum. Yorumlarda avatarınızın gözükmesini istiyorsanız. Sizi MyBlogLog sitesine üye olmaya davet ediyorum...



Creative Commons License
http://tambirblog.blogspot.com/2009/04/blogger-yorumlara-avatar-ekleme.html by Tam Bir Blog is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License.
Based on a work at tambirblog.blogspot.com.
Permissions beyond the scope of this license may be available at http://tambirblog.blogspot.com/.
28 Nisan 2009 Salı

Blogger Renkli Etiket Bulutu

Rengarenk etiket bulutu yapmak artık çok kolay. Hemde etiket özgürlüğünüzden ödün vermeden sadece en önemli etiketleri belirlemeniz yeterli...

Etiket bulutu kullanıcılara kaynaklık eder.Sitenize ilk kez helen bir ziyaretçiyi blogunuzun hangi konular üzerien olduğu konusunda kısa bir fikir verir... Fakat etiket sayısınız arttıkça bloggerda sahip olduğunuz etiketler widgetı canınızı sıkabilir. İşte bu harika uygulamayla etiketler konusunda özgür olacaksınız...
İşe koyulalım:)


1. Kodlar
<div style="width: 265px;  background-color: #e5e7db;  text-align: left;  ; font-family: 'Verdana';">
</div>

2. Kodlar
<a style="font-size: 14px; color: #87a800; text-decoration: none;
" href="http://tambirblog.blogspot.com/search/label/programlar">programlar</a>






Önce
Yerleşim>Sayfa öğelerine gelip html/javascript aracını ekliyoruz. Daha sonra 1. Kodu yapıştırıyoruz. Daha sonra 2. kodları istediğimiz kadar kopyalarak 1. koddaki
</div>
kodunun önüne yapıştırıyoruz. (Kaç tane etiket kullanacaksanız o kadar yapıştırın.)

Şimdi bu kodlarda yapmamız gereken ayarlara gelelim...
1. kodda yapmanız gereken ayarlar: Aşağıdaki kırmızı kodları kendinize göre değiştirebilirsiniz.

width: 265px > etiket bulutunun genişliğini ayarlar. 265 i kendinize göre ayarlayabilirsiniz.
background-color: #e5e7db; > kategori bulutumuzun arkaplan resmini ayarlamanızı sağlıyor.
font-family: 'Verdana' > etiketlerinizin fontunu bu kodla ayarlayabilirsiniz.

2. kodda yapmanız gereken ayarlar: Aşağıdaki yeşil kodları kendinize göre değiştirebilirsiniz.

font-size: 14px; > etiketinizin boyutunu belirler.
color: #87a800; > etiketinizin rengini belirler.
http://tambirblog.blogspot.com/search/label/programlar > etiketinizin ismini ve gideceği Url'yi buradan ayarlayabilirsiniz.
programlar > etiketinizin ismini belirleyebilirsiniz.

"*Her bir etiket için 2. kod ayarlarını yapmanız gerekmektedir. 1. kod zaten bir defa kullanılacaktır. 2. kodları 1. koddaki div kodunun önüne yapıştırmayı unutmayın.."


Eğer yapamadıysanız hazır bir örnek sizler için yaptım:
<div style=" background-color: #FFFFFF;  text-align: left;  ; font-family: 'Verdana';">
<a href='http://tambirblog.blogspot.com/search/label/blogger%20templates' style="font-size: 22px; color: #039faf; text-decoration: none;">blogger temaları</a>
<a href='http://www.logiprint.co.uk/en/Printing.html' style="font-size: 12; color: #00CCCC; text-decoration: none;">printing</a>
<a href='http://tambirblog.blogspot.com/search/label/blogger%20templates' style="font-size: 21px; color: #006600; text-decoration: none;">blogger temaları</a>
<a href='http://tambirblog.blogspot.com/search/label/blogger%20templates' style="font-size: 18px; color: #00CCCC; text-decoration: none;">blogger temaları</a>
<a href='http://tambirblog.blogspot.com/search/label/blogger%20templates' style="font-size: 20px; color: #006600; text-decoration: none;">blogger temaları</a>
<a href='http://tambirblog.blogspot.com/search/label/blogger%20templates' style="font-size: 19px; color: #00CCCC; text-decoration: none;">blogger temaları</a>
</div>

http://tambirblog.blogspot.com/
Renk kodlarını bulmakta zorlanmamanız için aşağıda renk kodlarını da verdim. Kolay gelsin....
10 Mart 2009 Salı

5 Premium Blogger Teması

Hep ücretsiz blogger temalarından bahsetmiştim bugüne kadar. Eğer html kod bilginiz pek yoksa ve diğer bloglardan biraz daha farklı görünmek istiyorsanız imdadınıza ücretli tema düzenleyen siteler yetişiyor. Wordpress temalarını bloggera düzenleyen wordpresstoblogger sitesinden en güzel temaları ufak bir ücret karşılığında satın alabilirsiniz.
İşte wordpressten bloggera uyarlanmış en dikkat çeken temalar:


1.Gallery Blogger Template: Wordpressin en güzel temalarından biri. Siyah arkaplanıyla göz kamaştıran bir tema galeri teması sizlere profesyonel bir blogger deneyimi yaşatacak.






2.Wp - New Mag: Estetik arayüzüyle wp-new magazin blogger şablonu.





3.Falkner Press Template: Manşet, twitter, rss abonelik, otomatik devamını oku eklentilerinin içinde bulunduğu 3 sütunlu blogger teması.






4.VideoPhotoGame Blogger Template:
Bloggerla Flash oyun sitesi, video sitesi ve fotoğraf galerisi bir arada. Adsense reklamları da bu temaya çok güzel yerleştirilmiş. Wordpressin en güzel temalarından biri de artık sizinle...





5. Viewport Blogger Template: Viewport teması, anasayfa yazılarınızın resimlerini geniş bir şekilde gösterir. Daha çok projeler için uygun olan bu temayı wordpresstoblogger sitesinden temin edebilirsiniz.






6 Temmuz 2009 Pazartesi

Zinmag Primus Resimli Manşet/Slide Yapımı

Zinmag Primus, bildiğimiz gibi bu senenin en beğenilen blogger temalrından oldu. Hem profesyonelliği hem de sahip olduğu eklentilerle bloggerı bir adım daha öteye taşıyan bir temaydı. Bu temanın tabiiki en dikkat çeken kısmı resimli manşet/slide show menüsüydü. Bir çok arkadaş bana nasıl diğer şablonlara uyarlayacağımızı da sormuştu. "Oom" bunu bizler için yapmış bulunuyor. Bizde ona değerli bilgileri için teşekkür ediyoruz. Slide showun nasıl olduğunu merak edenlere orjinal temadan önizleme.



1. Adım:İlk olarak şablonumuzda Html kodlarından ]]></b:skin> kodunu buluyoruz ve hemen önüne aşağıdaki kodları yapıştırıyoruz.


#slider {
background:url(http://img99.imageshack.us/img99/9594/slide.png);
height: 254px;
overflow: hidden;
position: relative;
margin: 5px 0;
}
#mover {
width: auto;
position:absolute;
overflow:hidden;
}
.slide {
padding: 20px 0px;
width: 1000px;
float: left;
position: relative;
height:200px;
}
.slide h2 {
font-family:georgia, Helvetica, Sans-Serif;
font-size: 24px;
color: #ac0000;
padding:0px 0px 0px 30px;
margin:0px 0px;
width:500px;
overflow:hidden;
}
.slide h2 a:link, .slide h2 a:visited {
color:#fff;
background-color: transparent;
}
.slide h2 a:hover {
color: #ddd;
background-color: transparent;
}
span.slmet {
color: #ee0909;
font-size: 10px;
font-family:Tahoma, georgia, Helvetica, Sans-Serif;
line-height: 20px;
width: 500px;
padding:0px 0px 0px 30px;
margin:0px 0px;
text-transform:uppercase;
}
.slide p {
color: #999;
font-size: 12px;
font-family:georgia, Helvetica, Sans-Serif;
line-height: 20px;
width: 500px;
padding:0px 0px 0px 30px;
margin:0px 0px;
}

.slide img {
position: absolute;
top: 20px;
left: 577px;
background:#fff;
padding:10px 10px;
}

#slider-stopper {
position: absolute;
font-family: Georgia, Helvetica, Sans-Serif;
top: 113px;
right: 65px;
color: #AC0000;
padding: 3px 8px;
font-size: 14px;
text-transform: uppercase;
z-index: 1000;
}


2. Adım: Şimdi ]></b:skin> kodundan sonra aşağıdaki kodları yapıştırıyoruz.



<script src='http://bloggerstyles.com/data/templates/000/Zinmag-Primus/js/jquery-1.2.6.min.js' type='text/javascript'/>
<script src='http://bloggerstyles.com/data/templates/000/Zinmag-Primus/js/slider.js' type='text/javascript'/>
<script type="text/javascript"><!--//--><![CDATA[//><!--
sfHover = function() {
var sfEls = document.getElementById("catmenu").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
//--><!]]></script>


3. Adım: Şimdi aşağıdaki kodları arıyoruz.

<div id='header-wrapper'>
.......... ..........
......... .........
</b:section> </ b: section>


4. Adım: Header-wrapper kodunun bittiği b:section kodundan sonra aşağıdaki kodları ekliyoruz. Header-wrapper kodu temanızda bulunmayabilir, o zaman sadece header olarak da aratabilirsiniz. Yalnız temanızın yedeğini almayı unutmayın. Temayı kaydetmeden önce de önizleyin. Geniş temalar için uyumludur.



<!-- Casing -->
<div id='casing'>
<!-- Slider -->
<div id='slider'>
<div id='mover'>
<div class='slide'>
<span class='slmet'> Tam Bir Blog tarafından yayınlandı </span>
<h2><a href='http://tambirblog.blogspot.com/2009/04/resimli-son-yazlar-eklentisi.html'>Resimli Son Yazılar Eklentisi</a></h2>
<p>Bu eklenti Türkiye'de ilk kez Tam Bir Blog'da. Bu eklenti sayesinde son yazılarınızı resimleri ve yorum sayısıyla birlikte blogunuzda gösterebileceksiniz. Hem kullanışlı hem de görsel açıdan zengin ve tasarımınıza göre ayarlarıyla oynayabilirsiniz.</p>
<img alt='' src='http://img5.imageshack.us/img5/3928/resimlisonyazlartambirb.jpg'/>
</div>
<div class='slide'>
<span class='slmet'> Tam Bir Blog tarafından yayınlandı. </span>
<h2><a href='http://tambirblog.blogspot.com/2009/04/blogger-yorumlara-avatar-ekleme.html'>Blogger Yorumlara Avatar Ekleme</a></h2>
<p>Bloggerda yepyeni bir eklentiyle daha karşınızdayım. Bloggerda yorumlarımıza MyBlogLog aracılığyla yorumcularımızın avatarlarını blogumuzda yayınlayabileceğiz.</p>
<img alt='' src='http://img5.imageshack.us/img5/1571/yorumlaraavatarekleme.jpg'/>
</div>
<div class='slide'>
<span class='slmet'> Tam Bir Blog tarafından yayınlandı. </span>
<h2><a href='http://tambirblog.blogspot.com/2009/04/blogger-yorumlara-avatar-ekleme.html'>Blogger Yorumlara Avatar Ekleme</a></h2>
<p>Bloggerda yepyeni bir eklentiyle daha karşınızdayım. Bloggerda yorumlarımıza MyBlogLog aracılığyla yorumcularımızın avatarlarını blogumuzda yayınlayabileceğiz.</p>
<img alt='' src='http://img5.imageshack.us/img5/1571/yorumlaraavatarekleme.jpg'/>
</div>
</div>
<!-- /Mover -->
</div>
<!-- /Slider -->
</div>
<div class='clear'/>


Şimdi kaydediyoruz ve blogu görüntülüyoruz.
Peki nasıl düzenleyebiliriz bu kodları temamız göre? 1) Eklentinin daha hızlı çalışması için tüm javascript dosyalarını ücretsiz host sitelerine upload edebiliriz. Javascript dosyalarını buradan indirebilrisiniz.

2) Arkaplan başka bir resim mi koymak istiyorsunuz ya da farklı bir renkli bir arkaplan mı yerleştireceksiniz; yapmanız gereken tek şey kodlardan
# slider (background: url (http://img99.imageshack.us/img99/9594/slide.png); height: 254px;
overflow: hidden;
position: relative;
margin: 5px 0;)

kodunu bulup yeşil renkli linkle kendi resim Url'nizin yerini değiştirmek.

3) Slide showuna resim ve yazı eklemeye geldi sıra. 4. adımda bulunan aşağıdaki kodları farkedeceksiniz. Bu kodlar slide showdaki yazı ve resimlerinizin görünmesini sağlayacaktır. Birazdan vereceğim kodu 4. adımda istediğiniz kadar çoğaltarak birden fazla yazınızın manşette çıkmasını sağlayabilirsiniz.

<div class='slide'>
<span class='slmet'> Tam Bir Blog tarafından yayınlandı. </span>
<h2><a href='http://tambirblog.blogspot.com/2009/04/blogger-yorumlara-avatar-ekleme.html'>Blogger Yorumlara Avatar Ekleme</a></h2>
<p>Bloggerda yepyeni bir eklentiyle daha karşınızdayım. Bloggerda yorumlarımıza MyBlogLog aracılığyla yorumcularımızın avatarlarını blogumuzda yayınlayabileceğiz.</p>
<img alt='' src='http://img5.imageshack.us/img5/1571/yorumlaraavatarekleme.jpg'/>
</div>

Lacivet kod: yazınızın linki,
Mor kod: Yazınızın başlığı.
Yeşil kod: Yazınızın özeti.
Kırmızı kod: Slide showda gözükmesini istediğiniz resmin Urlsi.

Tekrar yinelemek istiyorum. 4. Adımda verdiğim kodlarla yalnızca slide showunuzda 3 adet yazı çıkacaktır. Siz yukarıdaki kodu 4. adımda istediğiniz kadar yapıştırarark daha fazla yazınızın manşette gözükmesini sağlayabilirsiniz.


Bugünlük bu kadar... Biraz geç de olsa yazıyı yayınlayabildim. Güle güle kullanın...
3 Mayıs 2009 Pazar

Bloggera Resimleri Daha Büyük Geniş Nasıl Yükleriz? "HQ"

Bloggerda resimleri yüklediğimizde üç boyut var büyük,küçük ve orta boyutlarda olmak üzere. Resmi büyük yüklediğimizde bile blogger otomatik olarak resmi küçültüp önizleme boyutuna getiriyor. Bu boyutlar da maalesef temalarımızda küçük kalıyor.
İşte bunu mümkün kılan bir ipucu açıklayacağım.
Yüklediğimiz resimlerin daha öne çıkmasını ve temanıza daha uyumlu olmasını kendi belirlediğiniz genişliklerde yazılarınızın içinde gözükmesini istiyorsanız bu yöntem tam size göre.
Resmimizin yazı içerisinde normaldeki büyük görünümü:


Bu hileyi yaptıktan sonra resmimizin görünümü:



Önce htmlyi düzenle kısmına giriyoruz ve yazı alanımızın genişliğine bakıyoruz. Eğer klasik şablon kullanıyorsunuz main-wrapper veya main bölümünde bulabilirsiniz yazı alanı genişliğinizi. Bulmakta zorluk çektiyseniz hileyi uyguladıktan sonra temanıza göre genişliğiyle oynayıp düzeltebilirsiniz.
Koldarımızın içerisinden aşağıdaki kodu buluyoruz.

]]></b:skin>

Kodu bulduysak hemen üstüne aşağıdaki kodlarımızı ekliyoruz:

img {
max-width: 600px;
width: expression(this.width > 600 ? 600: true);
}

***Lacivert ile gösterilen sayılar resminizin büyük boyutta göstermek istediğiniz genişliğini vermektedir. İlk adımda bulduğunuz genişlik şu anda işe yaramaktadır. Örneğin yazı alannızın genişliğini 610 bulduysanız resim boyutunu 600 yaparak temanızda daha güzel durmasını sağlayabilirsiniz.
Adımları tamamladıktan sonra şablonumuzu kaydedebiliriz. Şimdi yüklediğimiz resmi büyük boyutta göstermeye geldi.

Resimlerimizi normal yüklediğimiz gibi yükleyelim. Resmimizi yükledikten sonra yazı içerisinde HTML'yi Düzenle kısmına gelip aşağıdaki kodlara benze kodları göreceksiniz. Bu kodlar yüklediğimiz resmin kodlarıdır.

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcpRH6sIvMBKKat5jx8Wa4oTApDbPUxkM1yaVRvmqhm07D38ZcnBq8A3ihTXKNHpD9GxS4CdvhxDOyyen0QmhetQszlmymX7v1i4A3fsQv4bbnxzYUt50CxZOqH5S8x_7uUTdcqsgjBWgl/s800/Image3.png"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 400px; height: 291px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcpRH6sIvMBKKat5jx8Wa4oTApDbPUxkM1yaVRvmqhm07D38ZcnBq8A3ihTXKNHpD9GxS4CdvhxDOyyen0QmhetQszlmymX7v1i4A3fsQv4bbnxzYUt50CxZOqH5S8x_7uUTdcqsgjBWgl/s400/Image3.png" alt="" id="BLOGGER_PHOTO_ID_5356425568508049202" border="0" /></a>

Resmi daha büyük boyutta yazı içerisinde göstermek için artık tek yapmanız gereken yukarıdaki kodlarda mor kodları silmek ve mavi s400 yerine s800 yazmak.

Aşağıdaki örneği inceleyebilirsiniz:

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcpRH6sIvMBKKat5jx8Wa4oTApDbPUxkM1yaVRvmqhm07D38ZcnBq8A3ihTXKNHpD9GxS4CdvhxDOyyen0QmhetQszlmymX7v1i4A3fsQv4bbnxzYUt50CxZOqH5S8x_7uUTdcqsgjBWgl/s1600-h/Image3.png"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcpRH6sIvMBKKat5jx8Wa4oTApDbPUxkM1yaVRvmqhm07D38ZcnBq8A3ihTXKNHpD9GxS4CdvhxDOyyen0QmhetQszlmymX7v1i4A3fsQv4bbnxzYUt50CxZOqH5S8x_7uUTdcqsgjBWgl/s800/Image3.png" alt="" id="BLOGGER_PHOTO_ID_5356425568508049202" border="0" /></a>

Evet artık yazı içerisinde büyük ve ferah resimler sergileyebileceksiniz. Anlayamadığınız bir yer olursa yardımcı olurum yorumlara sorununuzu yazmanız yeterli.
Kaynak: bloggertricks.com
9 Temmuz 2009 Perşembe

Blogger Otomatik Devamını Oku Bağlantısı-2

blogger otomatik devamını oku bağlantısı
Otomatik devamını oku eklentisi tüm blogger kullanıcıları çok sevdi. Fakat 1. eklentide bazı sorunlar çıkmıştı. Otomatik devamını oku artık yazılarımıza tek tek kod eklemek zorunda kalmayacağımız mükemmel bir eklenti. Artık sadece yazınızı yazdıktan sonra yayınla tuşuna basmanız yeterli. Ana sayfanızda resminiz ve devamını oku bağlantınız otomatik olarak gözükecektir. Eklentinin önizlemesi:

blogger otomatik devamını oku tambirblog

Şimdi bu eklentiyi blogumuza nasıl uygulayacağımıza geçelim.
Bildiğimiz gibi yayınladığım eklentilerin çoğunda javascript dosyaları var. Dosyalarımızın blogumuzda daha hızlı çalışmasını istiyorsak bu dosyaları kendi hostumuza yükmemiz gerekiyor. (Hotlinks, 110 mb iyi birer alternatif). Bu dosyalaı önce buradan indiriyoruz. Daha sonra ücretsiz hostlarımızdan birine yükleyip linklerimizi bir yere kaydediyoruz.

Şimdi Blogger'a giriş yapıyoruz. Yerleşim > Html'yi Düzenle ve Widget Şablonlarını genişletin.

Html kodlarımızdan </head> kodunu buluyoruz. (Ctrl+f tuş kombinasyonuyla arama yapabilirsiniz.) Kodu bulduysak aşağıdaki kod dizisini bulduğumuz head kodundan önce yapıştırıyoruz.




<script type='text/javascript'>var thumbnail_mode = "no-float" ;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 100;
img_thumb_width = 120;
</script>
<script src='http://js_dosyasını_yüklediğiniz_hostu/devamini_oku_tambirblog.js' type='text/javascript'/>

Kırmızı renkli linki siliyoruz ve yüklediğimiz .js dosyasının Url'sini yapıştırıyoruz. Aksi halde eklenti çalışmayacaktır. (javascript yüklerken sorun yaşayanlar için ben bir tane yükledim. İşte bu linki kırmızı kodla yer değiştirebilirsiniz. Yalnız dikkat etmeniz gereken bir konu var bu linki kullanan birden fazla site olunca doğal olarak siteniz çok az yavaşlayacaktır.)

Yukarıdaki kodları kendi temamıza göre düzenleyebiliriz.

summary_noimg = 430; resimsiz yazınızın boyu;
summary_img = 340; resimli yazınızın boyu;
img_thumb_height = 100; ana sayfada gözükecek resmin boyu;
img_thumb_width = 120; ana sayfada gözükecek resmin genişliği;

Şimdi <data:post.body/> kodu buluyoruz. Tamamızda bu koddan birden fazla olabilir. Siz en son kodu buluyorsunuz.

Ve aşağıdaki kodla yer değiştiriyorsunuz.


<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");
</script> <span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'> Devamını oku "<data:post.title/>"</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>


Temamızı şimdi önizlemeye alıyoruz. Eğer eklenti temamızda sorunsuz çalıştıysa kaydediyoruz. Artık devamını oku eklentisinin keyfini çıkarabilirsiniz:D


Otomatik devamını oku eklentisi-1'i kullanıp sorun yaşayan arkadaşlar, temanızda eski kodlar olduğu için html düzenle kısmından eski kodları temizlemenizde yarar var.

15 Mayıs 2009 Cuma

Şefle Tanış - Aşçıların Türkçe Blogger Teması

Profesyonel bir blogger teması daha. Hem de bedava... Yemek blogları sahiplerinin daha fazla ilgisini çekecektir. Şık ve sade tasarımıyla, kullanıcılarınızı etkileyecek bir yapıya sahip. Bu güzel temayı düzenleyen Gisele Jaquenod'a teşekkür ediyorum. Sizler için en yeni, profesyonel temaları Türkçe editlemeye devam ediyorum. Diğer blogger temaları için: Türkçe Blogger Temaları



Temanın özellikleri:
#3 kolonlu,
#Sağ ve sol sidebar,
#Pembe ve kahve tonlarında,


Şefle Tanış Türkçe Blogger Temasını:

ÖNİZLE


İNDİR


6 Mayıs 2009 Çarşamba

Blogger'da İzleyici Sayınız mı Düşüyor?

Blogger'da varolan izleyici sayınız bir anda düştüyse paniğe kapılmayın. Sorun sizde değil sizi takip edenlerde:D
Daha açık anlatmam gerekiyor galiba, sorunun nedeni şöyle açıklanıyor:
Hem google friend hem de blogger follow kullanıyorsanız 'tıpkı benim gibi' şu anda blogger izleyecileride sizde anonim olarak gözüküyorsunuz. Daha doğrusu izlediğiniz bloglarda gözükmüyorsunuz.
Bunu düzeltmenin kolay bir yolu var.
Hemen Blogger kullanıcı panelimizi açıyoruz. İzlediğimiz blogların hemen altındakı "yönet"e tıklıyoruz. Eğer takip ettiğiniz bloglarda "anonim" olarak gözüküyorsanız "herkese açık" hale getiriyoruz.
Herkes durumunu bu şekilde ayarlarsa bu sorunda ortadan kalkacaktır. Bilgi için bloxoo'dan abbasinan'a teşekkürler.
http://tambirblog.blogspot.com/
23 Şubat 2009 Pazartesi

Blogger Yazılarınızı Mobil Cihazınızla Veya Eposta ile Gönderme


Blogger'a giriş yaptığınızda yeni bir değişikliği daha farketmişsinizdir. İki tane yeni ikon gözüküyor blogunuzun isminin yanında, biri mail biri mobil cihaz olmak üzere. Artık nerede olursanız olun blog yazabileceksiniz.
Peki nasıl email ile blog yazısı yazacaksınız? Çok kolay sadece mail ikonuna tıklayıp yeni blogger mailimize sahip oluyoruz. Bu mail adresi sizin blogger mail edresiniz olacak. Mail yazar gibi artık blog yazısı yazıp gönderebileceksiniz. Ayrıca maille birlikte resimde yükleyebiliyorsunuz. Blogger gelişmeye devam ediyor. Umarım daha iyi yerlere gelecektir...
17 Nisan 2009 Cuma

Bloggerdan Hesap Nasıl Açılır?

Blog yazmaya başlayan bir daha bu bloglamayı bırakamıyor. Dünyada her geçen gün artan blog sitelerinde siz de yer almak istiyorsanız bu iş hiçte zor değil. Bir çok ücretsiz blog hizmeti veren siteler var bunlardan en iyileri : wordpress,blogger,blogcu,joomla...
Benim en sevdiğim ise blogger, çünkü blogger google üyesi.... Google'a en kolay indexlenen blogda doğal olarak blogger...
Bloggerdan hesap açmak için önce sizi buraya alalım.

Blogunuzu Şimdi Oluşturun butonuna tıklayarak bloglamaya başlayabilirsiniz. En fazla 5 dk. içinde bir blog sahibi oluyorsunuz.
Blogger olma yolunda ilk adımı8 attınız başarılar...:)
10 Eylül 2008 Çarşamba

Tek Tıkla Blogger'da Devamını Oku Devri


Blogger 10. yılı sebebiyle kullanıcılarının isteklerini yerine getiriyor. İşte bu yeniliklerden bir tanesi tek tuşa tıklayarak devamını oku özelliğini etkinleştirebilirsiniz.
24 Eylül 2009 Perşembe

Art Blogger Template - Türkçe Blogger Teması

En yeni blogger temalarını Türkçe düzenlemeye devam ediyorum. Tama idebagus tarafından dizayn edildi. Private Krankenversicherung | Internetdesign | Website optimieren siteleri tarafından internete sunuldu. Renk uyumu mükemmel olan tema 2 kolondan oluşuyor. Mavi ve yeşil karışımı bir renk hakim. Gözü yormayan art blogger teması tamamen tarafımdan Türkçeleştirildi. Kullanmak isteyenler gönül rahatlığıyla kullanabilirler. Sitenin alt tarafındaki linklerle oynamadığınız sürece tema ücretsiz.



Art Blogger Template- Türkçe Versiyonunu: ÖNİZLE





***Temada tarih kısmını manuel olarak düzenlemeniz gerekiyor. Yardımcı olması için bir resim yüklüyorum:





5 Mayıs 2009 Salı

Blogger'a Şablon Nasıl Yüklenir?

Yeni başlayan arkadaşlar için 3. parti blogger temaları nasıl yüklenir hemen anlatmaya başlayalım.
Arkadaşlar blogger için bir çok tema mevcut. Peki indirdiğimiz temaları nasıl yükleyeceğiz?
1.Önce Blogger'a giriş yapıyoruz. Kumanda panelinden şablon yükleyeceğimiz blogu seçiyoruz.
2.Daha sonra Yerleşim---->Html'yi Düzenle kısmına geliyoruz.
3.Hemen aşağıda Gözat ve yükle butonlarını göreceksiniz. Gözat'a tıklayarak bilgisayar indirmiş olduğumuz şablonu seçeceğiz. İndirdiğimiz şablonu klasöründe bir çok dosya bulunabilir telaşlanmayın bize .xml dosyası lazım. .Xml dosyasını bulup açıyoruz.
4. Şimdi yükle butonuna basıyoruz.
5.Temayı kaydetmeden önce önizlemeye alalım.Eğer temayı önizlemeye alabiliyorsak kaydet'e basıp temamızı yüklemiş oluyoruz. Yeni temamız vatana millete hayırlı olsun:))

Resimli anlatımda aşağıda:

Blogumda bulunan temalar için buraya bakabilirsiniz...
-http://tambirblog.blogspot.com/
14 Nisan 2009 Salı

Vector Flower ve Yaz Geliyor Blogger Temaları

2 yeni Türkçe tema daha;

Vector Flowers Türkçe Blogger Teması: Not defteri teması arayanlara sıcacık rengarenk bir çalışma. Tema 2 kolondan oluşuyor. Biraz daha bayanlara hitap ediyor.

Vector Flowers Temasını;
İNDİR | ÖNİZLE

Yaz Geliyor Türkçe Blogger Teması: Yazın en tatlı renkleri bu temada. 2 kolonlu ve çok sade bir şablon. Siz de yazın cıvıl cıvıl renklerini blogunuza yansıtmak istiyorsanız bu şablonu deneyebilirsiniz.



Yaz Geliyor Temasını;
İNDİR | ÖNİZLE

Temalarda yaşadığınız her problemi çekinmeden sorabilirsiniz yorum kutusu sizi bekliyor...
Blogger Temalarının Türkçe adresindesiniz lütfen kanallarınızla oynamayınız, oynayacaksanız buradan oynayın:)) Temaların yaratıcısı deluxetemplates.com'a çalışmalarından dolayı teşekkür ediyorum.
30 Mayıs 2009 Cumartesi

Blogger Şablonu Yüklerken Bx Hatalarıyla mı Karşılaşıyorsunuz? Problemin Kesin Çözümü...

Blogger tema yükleme hatalarının kesin çözümü:
Bir kaç aydır blogger kullanıcıların büyük sıkıntısı haline gelmeye başladı Bx-Errors. 3. parti temaları yüklerken en sık rastlanan bx-hata kodları:Bx-errors Kesin çözüm
  • bx-bliced
  • bX-ev85ll
  • bX-39cc9q
  • bX-y6cz0v
  • bX-982020
bu şekilde uzayıp gidiyor hata kodları. Sizde tema yüklerken bu hatalara rastlamışsınızdır muhakkak.
Bu hatanın kesin çözümü bulunmuş. Çözüm basamaklarını şu şekilde özetleyebiliriz.



1. Bx hatası veren temanızı bilgisayara kaydedin.

2.Eğer temanız bir .xml dosyası ise bu dosyayı wordpad veya notepad ile birlikte açın. Temanız bir .xml dosyası değil bir text ddosyası ise dosyanızı notepade kolayca kopyalayıp yapıştıralım.
3. Temamızda b:widget id= ile başlayan bütün kodları araştıralım. (ctrl+F yaparak kolayca arayabiliriz.)
Örneğin sizin bulduğunuz widget kodları aşağıdaki gibiyse:
  • b:widget id='Header1'
  • b:widget id='Blog1'
  • b:widget id='Label4'
  • b:widget id='HTML3'
Bu kodları bulduktan sonra, Header1'i Header2, Blog1'i Blog2, Label4'ü Label5,HTML3'ü HTML5 olarak değiştirelim. Yani widget idlerini bir arttırıyoruz.
4. Bütün widget idleri bir sayı arttırdığımızdan emin olduktan sonra dosyamızı kaydediyoruz.
5.Evet değişiklikleri temamızda yaptıktan sonra. Şablonumuzu yüklüyoruz. Tema yükleme basamakları : Yerleşim>Html'yi düzenle>Tam şablonu yükle. Eminim bu basamakları yaptıktan sonra hata kodlarını almadınız.

Bu basamakları yaptıktan sonra hala bx-errors alıyorsanız. Browserınızdaki çerezleri,kurabiyeleri ne varsa temizleyin.Hala hatayı almayı sürdürüyorsanız Cc cleaner programını kullanıp kökten bir temizlik yapın.

Yeni uygulayacağım temada bu sıkıntıyı yaşıyordum.Şu anda bx-hatası vermiyor. Blogger bustera makalesi için teşekkür ederim.
http://tambirblog.blogspot.com/
26 Şubat 2009 Perşembe

Bloggerda Her Yazınızın Altına İmzanızı Atın


Her yazınızın altına imza atmayı ister misiniz? Bu yazılarınıza profesyonel ve daha güzel bir görünüm verecektir. Bu blogger hilesi en kolay ve en çok bilinen hilelerden bir tanesi.
Diğer blogger ipuçlarını merak ediyorsanız Blogger İpuçları'na bakabilirsiniz.
Peki imzamızı blogumuza nasıl yüklüyoruz?

1)MyLiveSignature sitesine 10 saniyemizi alan bir üyeliğin ardından "New sign--->Using the signature creation wizard" bölümüne girip imzamızı oluşturuyoruz. (İmzanız sitenizin logosu da olabilir.)

2) Oluşturduğumuz imzanın Urlsini kopyalıyoruz.

3) Şimdi Blogger'a giriş yapıyoruz.

4) Yerleşim > Html'yi Düzenle > Widget Şablonunu genişlet

5) Aşağıdaki kodu html kodlarımızda buluyoruz. (ctrl+f yardımcı olacakttır.)
</p><data:post.body/></p>

(Blogunuzda eğer devamını oku eklentisi kullanıyorsunuz en son kodu buluyoruz. Bir de p leri siyah yaptım bazı şablonlarda yok.-http://tambirblog.blogspot.com/)

6) Kodu bulduktan sonra kodun hemen yanına aşağıdaki kodu düzenleyip yapıştırıyoruz.
<p><div align="right"><img src="http://imzanızın ya da logonuzun Url'si"/></div></p>


Bu kadar artık sizinde bir imzanız var....



Kodlarla ilgili sorun yaşayan arkadaşlar için iki tane resim ekliyorum iki farklı şablondan umarım yardımcı olur.

ÖRNEK 1:


ÖRNEK 2:
17 Nisan 2009 Cuma

Meraklı Türkçe Blogger Teması

2009 Blogger temaları için bir dönüm noktası oldu diyebilirim. Her geçen gün birbirinden profesyonel şablonların sayısı artıyor ve bu şablonlar kredileriyle oynamadığınız sürece ücretsiz olarak dağıtılıyor. Bugün ki temamız Meraklı Türkçe Blogger Teması (Curious Template) . Temanın wordpress yaratıcısı Web Revolutionary.


Temanın özellikleri:
#2 kolonlu,
#sağ sidebar,
#koyu arkaplan,
#özel arkaplan.


Meraklı Türkçe Blogger Temasını;

22 Mayıs 2009 Cuma

Blogger Yazı İçine Adsense Ekleme Yöntemleri

Bloggerda yazı içine Google adsense reklamlarını eklemek istiyordum ama benim şablonumda biraz sorun çıktı maalesef. Neredeyse denemediğim yöntem kalmadı. Temam için en başarılı yöntemi sonunda buldum. Sizlere bir kaç farklı şekilde yazı içine adsense kodlarını nasıl entegre ederiz bunu anlatacağım.
Öncelikle blogger adsense kod çeviriciyi kullanmamız gerekiyor. Bu aracı kullarak adsense kodumuzu blogger html kodlarına uyumlu hale getiriyoruz. Çevirdiğimiz kodu kopyalıyoruz ve aşağıdaki yerleştirme adımlarını uyguluyoruz.

Sayfa Öğeleri>>>Html'yi düzenle widget şablonlarını genişlete tıklayıp temanızın kodlarında en son bulunan <data:post.body/> kodunu buluyoruz. Eğer adsense kodları yazınızın üst kısmında durmasını istiyorsanızın aşağıdaki adımları bu kodun hemen üstüne yapıştıracaksınız, eğer yazınızın alt kısmında adsense reklamlarını göstermek isyitorsanız bulduğumuz kodun hemen aşağısına aşağıdaki adımları uygulamanız gerekiyor.


1.Adsense kodununu yazınızın içinde sağ tarafta göstermek istiyorsanız <data:post.body/> kodunun hemen üstüne veya hemen altına aşağıdaki kodları yapıştırmanız yeterli.

<div style='float: right;'>
ADSENSE KODUNUZ
</div>



2.Adsense kodununu yazınızın içinde sol tarafta göstermek istiyorsanız <data:post.body/> kodunun hemen üstüne veya hemen altına aşağıdaki kodları yapıştırmanız yeterli.

<div style='float: left;'>
ADSENSE KODUNUZ
</div>



3.Adsense kodununu yazınızla karışmasını istemiyorsanız <data:post.body/> kodunun hemen üstüne veya hemen altına aşağıdaki kodları yapıştırmanız yeterli.

<div style='float: center;'>
ADSENSE KODUNUZ
</div>




Umarım işinize yaramıştır..
10 Temmuz 2009 Cuma

Blogger Resimli Manşet(Featured Content) Yapımı-1

Blogger slide show

Tam Bir Blog daha iyi bir bloga sahip olmanız için yardımcı olmaya devam ediyor. Gelecek üç yazımda sizlere bloggerda üç değişik manşet yapımını göstereceğim. Bu eklenti sayesinde blogunuzdaki en özel ve en iyi içerikli yazılarınızı blogunuzun istediğiniz bir yerine taşıyabileceksiniz. İnanılmaz slideshowlar artık sizinde blogunuzda yer alabilecek. Yazınızın başlığı ve kısa bir özeti farklı efektleriyle etkileyici bir görselliğe sahip.
Tabiiki demosunu incelemeden olmaz. İşte üç farklı özel içerik eklentisinin tamanının önizlemesi

Bu üç eklenti temanıza göre tamamen özelleştirilebilir. Enini,boyunu temanıza uyumlu hale getirmek sizin elinizde, sadece Tam Bir Blog farkıyla sizlerle… “(Bu sıralar yazılarımın çok fazla kopyalandığını görüyorum, yazılarımdan eğer faydalanmak istiyorsanız ya da blogunuzda yazıma yer vermek istiyorsanız lütfen altına alıntıdır ibaresiyle yazının ulaşılabilir linkini veriniz.)”

Özel İçerik-Manşet (Featured Content-Slayt Şov)-1
Blogger slide show
1. Adım:
Bir sorun yaşamamak için aşağıdaki dosyaları bilgisayar indirmenizi ve varsa kendi hostunuza yoksa bşrazdan isimlerini vereceğim sitelere yükleyebilirsiniz. Böylece eklentiler güvenli ve hızlı çalışacaktır.
jquery.js
s3Slider.js

Dosyaları buradan indirebilirsiniz.
2. Adım:
İndirdiğim,iz bu iki dosyayı varsa kendi hostumuza yoksa HotLinkFiles.com ya da SigMirror.com adreslerine yüklüyoruz. Tabikii önce kayıt oluyoruz. Daha sonra yüklediğimiz dosyaların direkt linkini bir yere not alıyoruz.
3. Adım:
Şimdi kod bölümüne geldik. Blogger’a giriş yaptıktan sonra Yerleşim---->Html’yi düzenle---->Widget şablonunu genişlet diyoruz.
Aşağıdaki kodu buluyoruz.
</head>
Kodu bulduktan sonra bu kodun hemen önüne aşağıdaki kodlarımızı yapıştırıyoruz.

<!--SLIDE-SHOW-BASLANGICI-->
<!-- JavaScripts-->
<script type="text/javascript" src="http://hotlinkfiles.com/........./jquery.js"></script>
<script type="text/javascript" src="http://hotlinkfiles.com/........./s3Slider.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#slider').s3Slider({
timeOut: 3000
});
});
</script>
<!-- CSS -->
<style type="text/css" media="screen">
#slider
width: 410px; /* important to be same as image width */
height: 300px; /* important to be same as image height */
position: relative; /* important */
overflow: hidden; /* important */
}
#sliderContent {
width: 410px; /* important to be same as image width or wider */
position: absolute;
top: 0;
margin-left: 0;
}
.sliderImage {
float: left;
position: relative;
display: none;
}
.sliderImage span {
position: absolute;
font: 10px/15px Arial, Helvetica, sans-serif;
padding: 10px 13px;
width: 384px;
background-color: #000;
filter: alpha(opacity=70);
-moz-opacity: 0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
color: #fff;
display: none;
}
.clear {
clear: both;
}
.sliderImage span strong {
font-size: 14px;
}
.top {
top: 0;
left: 0;
}
.bottom {
bottom: 0
left: 0;
}
ul { list-style-type: none;}
</style>
<!--SLIDE-SHOW-BITISI-http://tambirblog.blogspot.com-->
Mavi olan linklieri silip, 2. adımda yüklemiş olduğumuz dosyaların linkini yapıştırıyoruz. Şimdi şablonumuzu önizlemeye alıyoruz. Eğer bir sorun yoksa kaydediyoruz. Yukarıdaki kırmızı renkteki sayılar ise eklentinin genişliğidir. Onları kendi temanıza göre düzenlemeniz gerekmektedir.
4. Adım
Şimdi Yerleşim---->Sayfa Öğeleri kısmına geliyoruz.Gadget ekleye basıp Html/Javascripti seçiyoruz.
Daha sonra aşağıdaki kodları içine yapıştırıyoruz.

<div id="slider">
<ul id="sliderContent">
<li class="sliderImage">
<a href="#"><img src="images/410/1.jpg" alt="1" /></a>
<span class="top"><strong>Title text 1</strong><br />Content text...</span>
</li>
<li class="sliderImage">
<a href="#"><img src="images/410/2.jpg" alt="2" /></a>
<span class="top"><strong>Title text 2</strong><br /&gt;Content text...Content text...Content text...Content text...Content text...Content text...Content text...Content text...Content text...Content text...Content text...</span>
</li>
<li class="sliderImage">
<a href="#"><img src="images/410/3.jpg" alt="3" />
<span class="top"><strong>Title text 3</strong><br />Content text...</span>
</li>
<li class="sliderImage">
<a href="#"><img src="images/410/4.jpg" alt="4" />
<span class="top"><strong>Title text 4</strong><br />Content text...</span>
</li>
<li class="sliderImage">
<a href="#"><img src="images/410/5.jpg" alt="5" />
<span class="top"><strong>Title text 5</strong><br />Content text...</span>
</li>
<div class="clear sliderImage"></div>
</ul>
</div>
Kırmızı kodları silip gözükmesini istediğimiz resimlerin linkini giriyoruz.
class=”bottom/top” ise yazılarınızın üstte mi altta mı görünmesini istiyorsanız ona göre değiştirebilirsiniz. (Top:yukarı bottom:aşağı)
# işaretinin yerine ise yazının gideceği adresi giriyoruz.
Mavi kodlar ise anlaşılacağı gibi (Text title) yazınızın başlığı ve (content text) yazınızın özeti:)) Eklentide resimlerinizin daha hoş durmasını istiyorsanız. Temanıza göre ayarlamış olduğunuz eklentinin genişlik ve eninin yükleyeceğiniz resimlerle aynı ölçüde olmasına dikkat ederseniz daha iyi sonuçlar elde edebilirsiniz.
Şimdi widgetı kaydediyoruz ve istediğimiz yere sürüklüyoruz. Bence en iyi yer blog yazılarınızın üst kısmı olacaktır. Diğer iki eklentiyi kullanmak istiyorsanız tabiiki biraz beklemeniz gerekecek:))
20 Nisan 2009 Pazartesi

Bunu Okudunuz Mu?


Son Eklenen Yazılar

Son Yorumlar

Kategoriler

Online İletişim

Link to...

Son Yazılar

Son Yorumlar

Translate

İzleyiciler