AzizName: blog

blog etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

31 Ocak 2012

BLOGGER’da Devamını Oku Düzenlemesi Yapalım

BLOGGER’da Devamını Oku >> nasıl yapılır? Bu gün onu anlatacağım.

Dostlar bu gün burada çok önceleri 14.Temmuz.2006 da yazmış olduğum “BLOGGER’DA SİTE İÇİ LİNK” adlı yazıma Oğuzhan adlı dost bir yorum bırakmış “selam yazınınızı okudum ancak pek anlayamadım bende ihtiyarus ‘daki gibi devamını oku tarzında ana sayfamı rahatlatmak istiyorum biraz daha detaylı bir anlatım yaparsanız sevinirim” .Dostlar takdir edersiniz ki o yazıyı yazdığım tarihlerdeki BLOGGER özelliklerine zaman içinde duyulan ihtiyaçlar doğrultusunda devamlı ilaveler yapıldı ve geliştirildi. Eğer özel bir tema(şablon) kullanıyorsanız yukarıda bahsi geçen özelliği barındırıyor olabilir. O zaman da zaten böyle bir uygulamaya ihtiyaç duymayacaksınız. Ama yok ben normal

Devamı Oku »

21 Ağustos 2011

uçan twitter Kuşunu Blogger’da uçurmak

Dostlar bugün SEDEF adlı bir izleyicim bir yorum bırakmış. Bu yorumda benden bir ricada bulunmuş.

Devamı Oku »

02 Şubat 2011

Kendi Widgetinizi Nasıl Yaparsınız?

Dostlar bu yazıyı 12 Aralık 2008 tarihinde yazmıştım. Ancak bu gün blogumu ziyaret eden bir dost BLOGGER SİDE BAR ARAÇLARI (GADGET) yazıma bir mesaj bırakmış. Bıraktığı mesajla ilgili daha önce bir yazı yazdığımı hatırladım. Ama daha önce yazdığım yazının artık güncelliğini yitirdiğini, o günden bu güne köprülerin altından çok sular aktığını gördüğüm için bu yazıyı güncellemeye karar verdim. O zamanlar yazımda bahsettiğim GOOGLE ın hizmetlerinden GOOGLE PAGE CREATOR (SAYFA OLUŞTURUCU) artık yok. Hizmetten kaldırdı yerine GOOGLE SİTES i oluşturup oradaki abone verilerini de GOOGLE SİTES e taşıdı. Tabi GOOGLE SİTES in sunduğu bazı araçlar burada farklı çalışıyor. O nedenle bu yazıda anlatacağımız olayda kısaca artık burası bizim işimize yaramıyor. O nedenle burayı artık kullanmayacağız. Burasının yerine başka bir online depolama alanını size önereceğim ama tabii sizler diğer onlarca online depolama alanlarından her hangi bir tanesini de kullanabilirsiniz. Gelelim konumuza o günlerde bir kardeşim "BLOGGER SİDE BAR ARAÇLARI (GADGET)" Yazıma “hocam bişey sorcam ben. gadget ekleme kısmında kendinizinkini ekleyin diye biyer var. nasıl ekleniyor? nasıl gadget yapılıyor? bi bilgi verirsen sevinirim.” diye bir yorum bırakmıştı. Bende bu yorum üzerine o günlerde bu yazıyı yazmıştım.

Hani bazı bloklarda butonlar görürüz. Technorati, feedburner, furl, magnolia, Facebook v.s sosyal sitelerin bookmark butonları gibi bende kendi butonumu yaptım. Sizlerde benimki gibi bir butonu FİREWORKS veya PHOTOSHOP gibi bir grafik, resim editörü programı ile yapın. Dosya boyutunu küçük olacak bir resim formatında kaydedin. Bu butonun ebatlarını ben 100X36 yaptım.

Siz istediğiniz boyutta yapabilirsiniz. Her neyse butonu yapın ve photobucket gibi bir beleş siteye yükleyin. Daha sonra resmininizi nereye yüklediyseniz sitenin vereceği resim URL sini yani adresini widget kodlarındaki aşağıdaki resimde gösterilen yere koyacaksınız. Resminize aşağıdaki resimde görüldüğü gibi blogunuzun adresini gireceksiniz. Yani resme tıkladığınızda tarayıcı sizin blogunuzu açacak. Diğer yerede resmi yüklediğiniz yerdeki adresini gireceksiniz.

Widget bittiğinde widget xhtml kodunun tamamında renkli görülen bölümler aşağıda görüldüğü gibi size ait bölümler olacak.

Şimdi tekrar bir tarayıcı açın ve adres satırına http://code.google.com/intl/tr/apis/gadgets/docs/legacy/gs.html#GGE adresini kopyala yapıştır deyip yapıştırın veya üşenmeyip aynen yazın.

Açılan sayfada yukarıda resimde ki yeri bulun ve aşağıdaki kodu kendinize göre daha önce resimlerle anlattığım gibi düzenleyip aşağıda resimlerle sırasıyla gösterdiğim gibi widget html kodunu ilgili yere koyuyorsunuz.

Kopyala Yapıştır Kodu:

Title başlığı yani aşağıdaki resimde görüldüğü gibi düzenliyorsunuz.

Daha sonra aşağıda resimde görüldüğü gibi widgetimizin Preview sekmesine tıklayıp ön izlemesine bakıyoruz.

Daha sonra sırasıyla resimlerdeki gibi save e tıklayıp kaydetme işlemine geçiyoruz. Widgetimize bir ad veriyoruz.

Kaydettikten sonra resimde görüldüğü gibi widgetimizin adına tıklıyoruz.

Tarayıcıda açılan sayfada resimdeki gibi adresi kopyalıyoruz.

İşte eylem artık çok kolay. Yerleşim sekmesinde side bar da gadget ekle linkine tıkladınız,

Gadget Ekle aracı açıldı, solda aşağıda Kendinizinkini ekleyin linkine tıklıyorsunuz, açılan pencerede Blogunuza eklemek istediğiniz widget in kopyaladığımız URL'sini giriyoruz..

Resimlerdeki gibi işlemleri sırasıyla yapıyoruz.

Ta taaaaa…. He he! Widgetiniz tamam. Kolay gelsin….

02 Haziran 2009

Blogger için Arşiv Takvim Widgeti Yapmak

Sevgili dostlar ne zamandır aradığım bir aleti buldum.Birkaç gün önce bir önceki yazımı yazarken phydeaux3 de uğramışken biraz sağı solu kurcalayayım dedim. Sağa sola bakarken (ARCHİVE CALENDER) ARŞİV TAKVİM gözüme çarptı. Daha önce görmemiştim. Ya da vardı da sanki benim dikkatimi çekmemişti. Her neyse hemen blogun sağını solunu aramaya başladım ve de buldum.

Evet yanılmamışım phydeaux3 BLOGGER kullananlar için bir ARŞİV TAKVİM tasarlamış. Takvimi denedim ve de çok güzel çalıştığını gördüm. Benim hoşuma gitti belki sizin de hoşunuza gider düşüncesiyle burada BLOGGER a nasıl uyarlayacağınızı anlatmaya çalışacağım. Bu takvimi denerken gördüm takvimin hazır birkaç değişik görünüşünün de hazır kodlarını vermiş sayın phydeaux3. Ama bu da sizi kesmezse takvim görünüşünü istediğiniz gibi basitçe düzenleyebileceğiniz kodları da vermiş. Ama yok ben daha değişik bir takvim istiyorum derseniz de gerisi artık sizin sınırsız yeteneğinize kalıyor. Bu arada belirtmeden geçemeyeceğim . phydeaux3 bilmenizi isterim bu takvim için epeyce emek harcamış. Her neyse ARŞİV TAKVİM Blogger’a nasıl uyarlanacak onu anlatmaya başlayalım.

Bu sadece Yeni Blogger Şablonlarında HTML’yi Düzenle kullanarak uygulanabilir. (Blogspot veya özel alan).. Klasik Şablonlara uygulanamaz.

Ayrıca, mesaj için beslemeler için ayarlar bölümünde (Blogger> Kontrol Paneli> Ayarlar> Site Beslemesi> Yazı Beslemesi ya Tam veya Kısa ayarlı olabilir) etkin olmalıdır. Özel herkesin ziyaret edemediği izine bağlı bloglarda da uygulanamaz, bu yüzden beslemeler desteklenmez.

1. ADIM :

İşleme başlamadan evvel her zamanki gibi şablonunuzun bir yedeğini alın. Şablonda Git > HTML’yi Düzenle sekmesine. Bu Widget Şablonlarını Genişlet kutusunu da (varsayılan) işaretlemeyin

Bu kod Arşiv widgeti yerini alacak. Aşağıdaki kod satırlarını şablon kodları içinde bulun. Bu kod satırları aşağıdaki gibi bir şey olacaktır.

Yukarıda vurgulanmış mavi renkli satırı aynı şekilde seçin ve aşağıdaki kod kümesini kopyalayıp seçili satırın üstüne yapıştırın.

<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + "_ArchiveList"'>
<b:if cond='data:style == "HIERARCHY"'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == "FLAT"'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == "MENU"'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
<b:include name='quickedit'/>
</div>
</b:includable>
<b:includable id='toggle' var='interval'>

</b:includable>
<b:includable id='flat' var='data'>
<div id='bloggerCalendarList'>
<ul>
<b:loop values='data:data' var='i'>
<li class='archivedate'>
<a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)
</li>
</b:loop>
</ul>
</div>

<div id='blogger_calendar' style='display:none'>
<table id='bcalendar'><caption id='bcaption'>

</caption>

<thead id='bcHead'></thead>



<tbody><tr><td id='cell1'> </td><td id='cell2'> </td><td id='cell3'> </td><td id='cell4'> </td><td id='cell5'> </td><td id='cell6'> </td><td id='cell7'> </td></tr>
<tr><td id='cell8'> </td><td id='cell9'> </td><td id='cell10'> </td><td id='cell11'> </td><td id='cell12'> </td><td id='cell13'> </td><td id='cell14'> </td></tr>
<tr><td id='cell15'> </td><td id='cell16'> </td><td id='cell17'> </td><td id='cell18'> </td><td id='cell19'> </td><td id='cell20'> </td><td id='cell21'> </td></tr>
<tr><td id='cell22'> </td><td id='cell23'> </td><td id='cell24'> </td><td id='cell25'> </td><td id='cell26'> </td><td id='cell27'> </td><td id='cell28'> </td></tr>
<tr><td id='cell29'> </td><td id='cell30'> </td><td id='cell31'> </td><td id='cell32'> </td><td id='cell33'> </td><td id='cell34'> </td><td id='cell35'> </td></tr>
<tr id='lastRow'><td id='cell36'> </td><td id='cell37'> </td></tr>
</tbody>
</table>
<table id='bcNavigation'><tr>
<td id='bcFootPrev'></td>
<td id='bcFootAll'></td>
<td id='bcFootNext'></td>
</tr></table>

<div id='calLoadingStatus' style='display:none; text-align:center;'>
<script type='text/javascript'>bcLoadStatus();</script>
</div>
<div id='calendarDisplay'/>

</div>

<script type='text/javascript'> initCal();</script>

</b:includable>
<b:includable id='posts' var='posts'>

</b:includable>
<b:includable id='menu' var='data'>
Configure your calendar archive widget - Edit archive widget - Flat List - Newest first - Choose any Month/Year Format
</b:includable>
<b:includable id='interval' var='intervalData'>
Configure your calendar archive widget - Edit archive widget - Flat List - Newest first - Choose any Month/Year Format
</b:includable>
</b:widget>

Bu noktada siz şablonu kaydetmek isteyebilirsiniz. Eğer yukarıdaki kodları doğru kopyalayıp yine tarif edilen yere doğru yapıştırdığınızdan tekrar kontrol ederek emin olun. Şablonu bence henüz bu aşamada kaydetmeyin. Çünkü daha kopyalayıp yapıştıracağımız çok kod var.

Şimdi, kopyalama yapıştırma işlemine devam edelim. Eğer bir dış sunucu yani kullandığınız online dosya depolama alanınız varsa (hiçbir düzeltme yapmadan / script etiketleri ile biten) ve. Js uzantılı bir dosya olarak aşağıdaki script kodlarını not pad e kopyalayıp yapıştırın ve kaydedin, daha sonra bu dosyaya bağlantı vererek de bu dosyayı script kodlarını çalıştırabilirsiniz. Ya da şu anda tarif edeceğim yere aşağıdaki script kodlarını direk kopyalayıp yine tarif edeceğim yere yapıştırın. Bu işlem daha kolay gibi geliyor bana. Yinede tercih sizin. Evet artık devam edebiliriz.

2.ADIM :

Şablonunuzda Bu bitiş etiketini à ]]></ b: skin> ve kapanış à </ head> etiketini bulun. Bu etiketler aynen yazıldığı gibi olacaktır.

Yukarıdaki resimde mavi renkle vurguladığımız daha önce bahsettiğimiz iki kapanış etiketinin arasına aşağıdaki kodları kopyalayıp yapıştıracağız. Bu bölümde daha önce bu bölüme konmuş başka script kod kümeleri olabilir. O zaman kafanızın karışmaması ve yanlış yapmamanız için ya </head> kapanış etiketinin hemen üstüne veya ]]></ b: skin> kapanış etiketinin hemen altına da yapıştırabilirsiniz.

<script type='text/javascript'>
//<![CDATA[

var bcLoadingImage = "http://phydeauxredux.googlepages.com/loading-trans.gif";
var bcLoadingMessage = " Loading....";
var bcArchiveNavText = "View Archive";
var bcArchiveNavPrev = '◄';
var bcArchiveNavNext = '►';
var headDays = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];
var headInitial = ["Su","Mo","Tu","We","Th","Fr","Sa"];

// Nothing to configure past this point ----------------------------------
var timeOffset;
var bcBlogID;
var calMonth;
var calDay = 1;
var calYear;
var startIndex;
var callmth;
var bcNav = new Array ();
var bcList = new Array ();

//Initialize Fill Array
var fill = ["","31","28","31","30","31","30","31","31","30","31","30","31"];
function openStatus(){
document.getElementById('calLoadingStatus').style.display = 'block';
document.getElementById('calendarDisplay').innerHTML = '';
}
function closeStatus(){
document.getElementById('calLoadingStatus').style.display = 'none';
}
function bcLoadStatus(){
cls = document.getElementById('calLoadingStatus');
img = document.createElement('img');
img.src = bcLoadingImage;
img.style.verticalAlign = 'middle';
cls.appendChild(img);
txt = document.createTextNode(bcLoadingMessage);
cls.appendChild(txt);
}
function callArchive(mth,yr,nav){
// Check for Leap Years
if (((yr % 4 == 0) && (yr % 100 != 0)) || (yr % 400 == 0)) {
fill[2] = '29';
}
else {
fill[2] = '28';
}
calMonth = mth;
calYear = yr;
if(mth.charAt(0) == 0){
calMonth = mth.substring(1);
}
callmth = mth;
bcNavAll = document.getElementById('bcFootAll');
bcNavPrev = document.getElementById('bcFootPrev');
bcNavNext = document.getElementById('bcFootNext');
bcSelect = document.getElementById('bcSelection');
a = document.createElement('a');
at = document.createTextNode(bcArchiveNavText);
a.href = bcNav[nav];
a.appendChild(at);
bcNavAll.innerHTML = '';
bcNavAll.appendChild(a);
bcNavPrev.innerHTML = '';
bcNavNext.innerHTML = '';
if(nav < bcNav.length -1){
a = document.createElement('a');
a.innerHTML = bcArchiveNavPrev;
bcp = parseInt(nav,10) + 1;
a.href = bcNav[bcp];
a.title = 'Previous Archive';
prevSplit = bcList[bcp].split(',');
a.onclick = function(){bcSelect.options[bcp].selected = true;openStatus();callArchive(prevSplit[0],prevSplit[1],prevSplit[2]);return false;};
bcNavPrev.appendChild(a);
}
if(nav > 0){
a = document.createElement('a');
a.innerHTML = bcArchiveNavNext;
bcn = parseInt(nav,10) - 1;
a.href = bcNav[bcn];
a.title = 'Next Archive';
nextSplit = bcList[bcn].split(',');
a.onclick = function(){bcSelect.options[bcn].selected = true;openStatus();callArchive(nextSplit[0],nextSplit[1],nextSplit[2]);return false;};
bcNavNext.appendChild(a);
}
script = document.createElement('script');
script.src = 'http://www.blogger.com/feeds/'+bcBlogId+'/posts/summary?published-max='+calYear+'-'+callmth+'-'+fill[calMonth]+'T23%3A59%3A59'+timeOffset+'&published-min='+calYear+'-'+callmth+'-01T00%3A00%3A00'+timeOffset+'&max-results=100&orderby=published&alt=json-in-script&callback=cReadArchive';
document.getElementsByTagName('head')[0].appendChild(script);
}

function cReadArchive(root){
// Check for Leap Years
if (((calYear % 4 == 0) && (calYear % 100 != 0)) || (calYear % 400 == 0)) {
fill[2] = '29';
}
else {
fill[2] = '28';
}
closeStatus();
document.getElementById('lastRow').style.display = 'none';
calDis = document.getElementById('calendarDisplay');
var feed = root.feed;
var total = feed.openSearch$totalResults.$t;
var entries = feed.entry || [];
var fillDate = new Array();
var fillTitles = new Array();
fillTitles.length = 32;
var ul = document.createElement('ul');
ul.id = 'calendarUl';
for (var i = 0; i < feed.entry.length; ++i) {
var entry = feed.entry[i];
for (var j = 0; j < entry.link.length; ++j) {
if (entry.link[j].rel == "alternate") {
var link = entry.link[j].href;
}
}
var title = entry.title.$t;
var author = entry.author[0].name.$t;
var date = entry.published.$t;
var summary = entry.summary.$t;
isPublished = date.split('T')[0].split('-')[2];
if(isPublished.charAt(0) == '0'){
isPublished = isPublished.substring(1);
}
fillDate.push(isPublished);
if (fillTitles[isPublished]){
fillTitles[isPublished] = fillTitles[isPublished] + ' | ' + title;
}
else {
fillTitles[isPublished] = title;
}
li = document.createElement('li');
li.style.listType = 'none';
li.innerHTML = '<a href="'+link+'">'+title+'</a>';
ul.appendChild(li);

}
calDis.appendChild(ul);
var val1 = parseInt(calDay, 10)
var valxx = parseInt(calMonth, 10);
var val2 = valxx - 1;
var val3 = parseInt(calYear, 10);
var firstCalDay = new Date(val3,val2,1);
var val0 = firstCalDay.getDay();
startIndex = val0 + 1;
var dayCount = 1;
for (x =1; x < 38; x++){
var cell = document.getElementById('cell'+x);
if( x < startIndex){
cell.innerHTML = ' ';
cell.className = 'firstCell';
}
if( x >= startIndex){
cell.innerHTML = dayCount;
cell.className = 'filledCell';
for(p = 0; p < fillDate.length; p++){
if(dayCount == fillDate[p]){
if(fillDate[p].length == 1){
fillURL = '0'+fillDate[p];
}
else {
fillURL = fillDate[p];
}
cell.className = 'highlightCell';
cell.innerHTML = '<a href="/search?updated-max='+calYear+'-'+callmth+'-'+fillURL+'T23%3A59%3A59'+timeOffset+'&updated-min='+calYear+'-'+callmth+'-'+fillURL+'T00%3A00%3A00'+timeOffset+'" title="'+fillTitles[fillDate[p]].replace(/"/g,'\'')+'">'+dayCount+'</a>';
}
}
if( dayCount > fill[valxx]){
cell.innerHTML = ' ';
cell.className = 'emptyCell';
}
dayCount++;
}
}
visTotal = parseInt(startIndex) + parseInt(fill[valxx]) -1;
if(visTotal >35){
document.getElementById('lastRow').style.display = '';
}
}

function initCal(){
document.getElementById('blogger_calendar').style.display = 'block';
var bcInit = document.getElementById('bloggerCalendarList').getElementsByTagName('a');
var bcCount = document.getElementById('bloggerCalendarList').getElementsByTagName('li');
document.getElementById('bloggerCalendarList').style.display = 'none';
calHead = document.getElementById('bcHead');
tr = document.createElement('tr');
for(t = 0; t < 7; t++){
th = document.createElement('th');
th.abbr = headDays[t];
scope = 'col';
th.title = headDays[t];
th.innerHTML = headInitial[t];
tr.appendChild(th);
}
calHead.appendChild(tr);
for (x = 0; x <bcInit.length;x++){
var stripYear= bcInit[x].href.split('_')[0].split('/')[3];
var stripMonth = bcInit[x].href.split('_')[1];
bcList.push(stripMonth + ','+ stripYear + ',' + x);
bcNav.push(bcInit[x].href);
}
var sel = document.createElement('select');
sel.id = 'bcSelection';
sel.onchange = function(){var cSend = this.options[this.selectedIndex].value.split(',');openStatus();callArchive(cSend[0],cSend[1],cSend[2]);};
q = 0;
for (r = 0; r <bcList.length; r++){
var selText = bcInit[r].innerHTML;
var selCount = bcCount[r].innerHTML.split('> (')[1];
var selValue = bcList[r];
sel.options[q] = new Option(selText + ' ('+selCount,selValue);
q++
}
document.getElementById('bcaption').appendChild(sel);
var m = bcList[0].split(',')[0];
var y = bcList[0].split(',')[1];
callArchive(m,y,'0');
}

function timezoneSet(root){
var feed = root.feed;
var updated = feed.updated.$t;
var id = feed.id.$t;
bcBlogId = id.split('blog-')[1];
upLength = updated.length;
if(updated.charAt(upLength-1) == "Z"){timeOffset = "+00:00";}
else {timeOffset = updated.substring(upLength-6,upLength);}
timeOffset = encodeURIComponent(timeOffset);
}

//]]>
</script>
<script src='/feeds/posts/summary?max-results=0&alt=json-in-script&callback=timezoneSet'></script>

4 Mayıs 2007 itibariyle yazılar için saat dilimi ayarlarınız Autodetect olacaktır. Yani otomatik algılanacaktır. Burada bazı şeyler değiştirilebilir olmalı, ama bir kaç şey, bazı insanlar yapılandırmak isteyebilir. (özellikle İngilizce olmayan bloglar) ama şimdi varsayılan normal ayarlarda da yaptık. Eğer bazı şeyleri değiştirmek istiyorsanız (özellikle de) sonra bunu da yapabileceğiniz CSS kodlarını da birazdan aşağıda vereceğim.

Sonra, şablonda bitiş ]]></b:skin> etiketini bulun ve aşağıdaki verilen CSS stil kodlarını tarif edeceğimiz yere kopyalayıp yapıştırın.

Şimdi vereceğimiz kodlar tamamen takvimin biçimini belirleyen kodlardır. Aşağıda çeşitli hazır stil kodları da bulacaksınız.

3.ADIM :

Plain Base Style

Bu stil sizin için uygun olabilir, ancak tüm diğer stilleride denemek isteyebilirsiniz. Ben sizin için bir kaçını denedim.

/* Calendar
----------------------------------------------- */

/* div that holds calendar */
#blogger_calendar { margin:5px 0 0 0;width:98%;}

/* Table Caption - Holds the Archive Select Menu */
#bcaption {border:1px solid #000;padding:2px;margin:10px 0 0}

/* The Archive Select Menu */
#bcaption select {}

/* The Heading Section */
table#bcalendar thead {}

/* Head Entries */
table#bcalendar thead tr th {width:20px;text-align:center;padding:2px; border:1px solid #000; font-family:Tahoma; font-weight:normal;}

/* The calendar Table */
table#bcalendar {border:1px solid #000;border-top:0; margin:0px 0 0px;width:95%;}

/* The Cells in the Calendar */
table#bcalendar tbody tr td {text-align:center;padding:2px;border:1px solid #000;}

/* Links in Calendar */
table#bcalendar tbody tr td a {font-weight:bold;}

/* First Row Empty Cells */
td.firstCell {visibility:visible;}

/* Cells that have a day in them */
td.filledCell {}

/* Cells that are empty, after the first row */
td.emptyCell {visibility:hidden;}

/* Cells with a Link Entry in them */
td.highlightCell {background:#FFFF99;border:1px outset #000!important}

/* Table Footer Navigation */
table#bcNavigation {width:95%;}
table#bcNavigation a {text-decoration:none;}
td#bcFootPrev {width:10px;}
td#bcFootAll{text-align:center;}
td#bcFootNext {width:10px;}
ul#calendarUl {margin:5px auto 0!important;}
ul#calendarUl li a{}

Basic styles for Dark Templates

Bu sadece bazı çok temel tarzı olduğu için karanlık şablonlar. Bu, bir vurgulamak ile takvim girişleri etrafında beyaz sınırları vardır. İçinde gawdy yellow. bir gawdy sarı kullanılmıştır. Bu takvimde varsayılan bağlantı renkleri tutmalı.

/* Calendar
----------------------------------------------- */

/* div that holds calendar */
#blogger_calendar { margin:5px 0 0 0;width:98%;}

/* Table Caption - Holds the Archive Select Menu */
#bcaption {border:1px solid #fff;padding:2px;margin:10px 0 0;}

/* The Archive Select Menu */
#bcaption select {}

/* The Heading Section */
table#bcalendar thead {}

/* Head Entries */
table#bcalendar thead tr th {width:20px;text-align:center;padding:2px; border:1px solid #fff; font-family:Tahoma; font-weight:normal;color:#fff;}

/* The calendar Table */
table#bcalendar {border:1px solid #fff;border-top:0; margin:0px 0 0px;width:95%;}

/* The Cells in the Calendar */
table#bcalendar tbody tr td {text-align:center;padding:2px;border:1px solid #fff;color:#fff;}

/* Links in Calendar */
table#bcalendar tbody tr td a {font-weight:bold;}

/* First Row Empty Cells */
td.firstCell {visibility:visible;}

/* Cells that have a day in them */
td.filledCell {}

/* Cells that are empty, after the first row */
td.emptyCell {visibility:hidden;}

/* Cells with a Link Entry in them */
td.highlightCell {background:#FFFF99;border:1px outset #000}

/* Table Footer Navigation */
table#bcNavigation {width:95%;}
table#bcNavigation a {text-decoration:none;}
td#bcFootPrev {width:10px;}
td#bcFootAll{text-align:center;}
td#bcFootNext {width:10px;}
ul#calendarUl {margin:5px auto 0!important;}
ul#calendarUl li a{}

Plain White

Bu bir düz beyaz isteyenler içindir. Ve takvim içinde siyah harflerle siyah sınırlar kullanılmıştır.

/* Calendar
----------------------------------------------- */

/* div that holds calendar */
#blogger_calendar { margin:5px 0 0 0;width:98%;}

/* Table Caption - Holds the Archive Select Menu */
#bcaption {border:1px solid #000;padding:2px;margin:10px 0 0;background:#fff;}

/* The Archive Select Menu */
#bcaption select {border:1px solid #000;}

/* The Heading Section */
table#bcalendar thead {}

/* Head Entries */
table#bcalendar thead tr th {width:20px;text-align:center;padding:2px; border:1px solid #000; font-family:Tahoma; font-weight:normal;color:#000;}

/* The calendar Table */
table#bcalendar {border:1px solid #000;border-top:0; margin:0px 0 0px;width:95%;background:#fff;}

/* The Cells in the Calendar */
table#bcalendar tbody tr td {text-align:center;padding:2px;border:1px solid #000;color:#000;}

/* Links in Calendar */
table#bcalendar tbody tr td a {font-weight:bold;color:#000;}

/* First Row Empty Cells */
td.firstCell {visibility:visible;}

/* Cells that have a day in them */
td.filledCell {}

/* Cells that are empty, after the first row */
td.emptyCell {}

/* Cells with a Link Entry in them */
td.highlightCell {background:#FFFF99;border:1px outset #000}

/* Table Footer Navigation */
table#bcNavigation {width:95%;background:#fff;border:1px solid #000;border-top:0;}
table#bcNavigation a {text-decoration:none;color:#000;}
td#bcFootPrev {width:10px;}
td#bcFootAll{text-align:center;}
td#bcFootNext {width:10px;}
ul#calendarUl {margin:5px auto 0!important;}
ul#calendarUl li a{}

Blue/Black

Bu stilde mavi, gri, olaylar için siyah ile açık mavi kullanılmıştır.

/* Calendar
----------------------------------------------- */

/* div that holds calendar */
#blogger_calendar { margin:5px 0 0 0;width:98%;}

/* Table Caption - Holds the Archive Select Menu */
#bcaption {border:1px solid #000;padding:2px;margin:10px 0 0;background:#1F1FFF;}

/* The Archive Select Menu */
#bcaption select {border:0px;background:#1F1FFF;color:#fff;font-weight:bold;}

/* The Heading Section */
table#bcalendar thead {background:#000;}

/* Head Entries */
table#bcalendar thead tr th {width:20px;text-align:center;padding:2px; border:1px solid #000; font-family:Tahoma; font-weight:bold;color:#fff;}

/* The calendar Table */
table#bcalendar {border:1px solid #000;border-top:0; margin:0px 0 0px;width:95%;background:#fff;}

/* The Cells in the Calendar */
table#bcalendar tbody tr td {text-align:center;padding:2px;border:1px solid #000;color:#1F1FFF;}

/* Links in Calendar */
table#bcalendar tbody tr td a {font-weight:bold;color:#000;}

/* First Row Empty Cells */
td.firstCell {}

/* Cells that have a day in them */
td.filledCell {}

/* Cells that are empty, after the first row */
td.emptyCell {}

/* Cells with a Link Entry in them */
td.highlightCell {background:#ddd;border:1px outset #000}

/* Table Footer Navigation */
table#bcNavigation {width:95%;background:#1F1FFF;border:1px solid #000;border-top:0;}
table#bcNavigation a {text-decoration:none;color:#fff;}
td#bcFootPrev {width:10px;}
td#bcFootAll{text-align:center;}
td#bcFootNext {width:10px;}
ul#calendarUl {margin:5px auto 0!important;}
ul#calendarUl li a{}

Dusty Blue

Tozlu olayları ile Kinda açık mavi, alt menüsü içinse yine açık mavi kullanılmıştır.

/* Calendar
----------------------------------------------- */

/* div that holds calendar */
#blogger_calendar { margin:5px 0 0 0;padding:3px;1px solid #000;background:#FFF ; width:100%;}
/* Table Caption - Holds the Archive Select Menu */
#bcaption {border:1px outset #000;background:#CCD9FF;padding:2px;margin:10px 0 0}
/* The Archive Select Menu */
#bcaption select {background:#CCD9FF;color:#fff;font-weight:bold;border:0 solid #CCD9FF;text-align:center;}
/* The Heading Section */
table#bcalendar thead {background:#FFF2CC ;color:#111;}
/* Head Entries */
table#bcalendar thead tr th {width:20px;text-align:center;padding:2px; border:1px inset #000; font-family:Tahoma; font-weight:normal;}
/* The calendar Table */
table#bcalendar {border:1px solid #000;border-top:0; margin:0px 0 0px;width:95%;}
/* The Cells in the Calendar */
table#bcalendar tbody tr td {text-align:center;padding:2px;border:1px outset #000;}
/* Links in Calendar */
table#bcalendar tbody tr td a {font-weight:bold; color:#527DFF;}
/* First Row Empty Cells */
td.firstCell {visibility:visible;}
/* Cells that have a day in them */
td.filledCell {background:#fff;}
/* Cells that are empty, after the first row */
td.emptyCell {visibility:hidden;}
/* Cells with a Link Entry in them */
td.highlightCell {background:#FFF2CC;border:1px outset #000!important}
/* Table Navigation */
table#bcNavigation {width:95%;background:#FFF2CC;border:1px inset #000;border-top:0;color:#fff;}
table#bcNavigation a {color:#527DFF;text-decoration:none;}
td#bcFootPrev {width:10px;}
td#bcFootAll{text-align:center;}
td#bcFootNext {width:10px;}
ul#calendarUl {margin:5px auto 0!important;}
ul#calendarUl li a{ color:#527DFF}

Blogger Yazı tiplerini/ Renkleri Ayarlayıcı: (Yazı Tipleri ve Renkler)

Bu çoğunuz için en iyi seçenek olabilir. Bu kodlarla, takvimin tüm renkleri ve yazı tipleri ile iyi bir şekilde oynama yapabilirsiniz. Bu kod bölümü Blogger Yazı Tipleri ve Renkler bölümünden görerek anında istediğiniz değişiklikleri yapabilmenizi sağlayacak.. NOT: Yalnız burada ayarlama yaparken, Blogger Arşiv betiklerini tamamen ön izleme de göremeyebilirsiniz. Burada sadece takvim biçim değişikliklerini görebilirsiniz. Ama yok yeterli görmezseniz o zaman yaptınız her değişiklikten sonra şablonu kaydedin daha sonra başka bir pencere veya sekmede blogunuzun ön izlemesine bakabilirsiniz. Bu şekilde her şeyi görebilirsiniz. Sadece seçimler yapın, sonra, kaydedin ve başka bir sekmede görüntülemek için blogunuzu açın ve görünümü kontrol edin.

Bu kurmak için, sadece gerekli olan CSS ile tüm değişken tanımlamalarının WYSIWYG editörü ile düzenleme ihtiyaçlarınız için aşağıdaki kodu kopyalayıp CSS Style bölümüne yapıştırmanız gerekiyor. Tüm CSS dosyaları gibi görev yapar, sadece aşağıdaki kodları kopyalayıp bitiş ]]></ b: skin> etiketini bulun. hemen üstüne yapıştırın

(buraya yapıştırın) ß

]]></b:skin>

Arşiv Takvim Değişken kurulum ve ARŞİV TAKVİM kodları:

/* Archive Calendar Variable Setups
Do not modify unless you know what's what
=========================================

<Variable name="bcCalenderFonts" description="Calendar Font Sizes"
type="font" default="normal normal 100% Tahoma, Arial, Sans-serif" / value="normal normal 100% Tahoma, Arial, Sans-serif">
<Variable name="bcTableBackgroundColor" description="Calendar Background Color"
type="color" default="#ffffff" value="#ffffff">
<Variable name="bcTableBorderColor" description="Calendar Border Color"
type="color" default="#000000" value="#000000">
<Variable name="bcTableTextColor" description="Calendar Text Color"
type="color" default="#000000" value="#000000">
<Variable name="bcMenuBackgroundColor" description="Calendar Menu Select Background Color"
type="color" default="#ffffff" value="#ffffff">
<Variable name="bcMenuTextColor" description="Calendar Menu Select Text Color"
type="color" default="#000000" value="#000000">
<Variable name="bcTableHeaderBackgroundColor" description="Calendar Header Background Color"
type="color" default="#ffffff" value="#ffffff">
<Variable name="bcTableHeaderTextColor" description="Calendar Header Text Color"
type="color" default="#000000" value="#000000">
<Variable name="bcTableHighLightColor" description="Calendar Highlight Color"
type="color" default="#cccccc" value="#cccccc">
<Variable name="bcCalenderLinksColor" description="Calendar Links Color"
type="color" default="#0000ff" value="#0000ff">
<Variable name="bcCalenderLinksHoverColor" description="Calendar Links Hover Color"
type="color" default="#0000ff" value="#0000ff">
<Variable name="bcTableFooterBackground" description="Calendar Footer Background Color"
type="color" default="#ffffff" value="#ffffff">
<Variable name="bcFooterLinksColor" description="Calendar Footer LinksColor"
type="color" default="#0000ff" value="#0000ff">

===========================================
End Archive Calendar Variables */

/* Archive Calendar CSS
----------------------------------------------- */

/* div that holds calendar */
#blogger_calendar { margin:5px 0 0 0;width:98%;}

/* Table Caption - Holds the Archive Select Menu */
#bcaption {border:1px solid $bcTableBorderColor;padding:2px;margin:10px 0 0;background:$bcMenuBackgroundColor;font:$bcCalenderFonts}

/* The Archive Select Menu */
#bcaption select {background:$bcMenuBackgroundColor;border:0 solid $bcMenuBackgroundColor;color:$bcMenuTextColor;font-weight:bold;text-align:center;}

/* The Heading Section */
table#bcalendar thead {}

/* Head Entries */
table#bcalendar thead tr th {width:20px;text-align:center;padding:2px; border:1px outset $bcTableBorderColor; font:$bcCalenderFonts;background:$bcTableHeaderBackgroundColor;color:$bcTableHeaderTextColor}

/* The calendar Table */
table#bcalendar {border:1px solid $bcTableBorderColor;border-top:0; margin:0px 0 0px;width:95%;background:$bcTableBackgroundColor}

/* The Cells in the Calendar */
table#bcalendar tbody tr td {text-align:center;padding:2px;border:1px outset $bcTableBorderColor; color:$bcTableTextColor;font:$bcCalenderFonts;}

/* Links in Calendar */
table#bcalendar tbody tr td a:link, table#bcalendar tbody tr td a:visited, table#bcalendar tbody tr td a:active {font-weight:bold;color:$bcCalenderLinksColor;}
table#bcalendar tbody tr td a:hover {color:$bcCalenderLinksHoverColor;}

/* First Row Empty Cells */
td.firstCell {visibility:visible;}

/* Cells that have a day in them */
td.filledCell {}

/* Cells that are empty, after the first row */
td.emptyCell {visibility:hidden;}

/* Cells with a Link Entry in them */
td.highlightCell {background:$bcTableHighLightColor;border:1px solid $bcTableBorderColor}

/* Table Footer Navigation */
table#bcNavigation {width:95%;background:$bcTableFooterBackground;border:1px solid $bcTableBorderColor;border-top:0;color:$bcTableTextColor;font:$bcCalenderFonts;}
table#bcNavigation a:link {text-decoration:none;color:$bcFooterLinksColor}
td#bcFootPrev {width:10px;}
td#bcFootAll{text-align:center;}
td#bcFootNext {width:10px;}
ul#calendarUl {margin:5px auto 0!important;}
ul#calendarUl li a:link {}

Artık şablonumuzu kaydedebilirsiniz. Bu aşamada en aşağıda resimde görülen düzeltmeyi yazı sonunda bulacaksınız. O düzeltmeyide yaptıktan sonra artık takvimimize bakabiliriz. Şu ana kadar yaptığınız işlemlerin doğru olup olmadığını kontrol edebilirsiniz.

Daha sonra, sadece Yazı Tipleri ve Renkler bölümünden renkleri ve yazı tiplerini uygun şekilde değiştirebilirsiniz.. Takvim için ilk giriş "Takvim Yazı Boyutları", ve geri kalanı Arşiv Takvim Widgeti Unutmayın, tamamen Fontlar ve Renkler değildir hemde aynı zamanda arşivinizi oluşturan yazılarınızın tümünü içerir takvim olacaktır.

Daha ileri düzeyde kullanıcılar için unutmayın. Eğer istiyorsanız ve ne yaptığınızı biliyorsanız bu değişkenler bölümüne kadar bozulmadan taşımak için güvenli olduğundan emin olduğunuz diğer değişkenler Şablonun üstündeki kurulum şablonun da da vardır. İnsanlar bu şekilde, diğer verilen stil kodlarını temiz bulabilir ve CSS stil kodlarında değişiklikler yapabilirler. Aksi takdirde, sadece verdiğimiz orijinal kodları olduğu gibi bırakırsanız Arşiv Takvim doğru çalışacaktır.

Şimdi şablonunuzu kaydedin. Bu yaptığımız işlemleri hatasız kaydetmek gerekir Yukarıda ki tarif edilen adımları tekrar takip ederek kontrol edebilirsiniz... Bir şey daha var sizin Arşiv Widget'iniz yapılandırılmış olması gerekir. Blogger Arşiv Takvim Ayarlar Sayfasında bulunan tam liste özellikleri bölümünde aşağıda gösterildiği gibi ufak bir düzeltme yapmamız gerekiyor. Şimdi artık Sayfa Öğelerini Ekleyin ve Düzenleyin bölümüne gidip Arşiv Takvim Widget'ini bulmak ve düzenlemek için tıklayın. Aşağıdaki resimdeki gibi düzenlemeleri yapın.

Örnek ARŞİV TAKVİM örneğini sağda side barda bulabilirsiniz. Nasıl çalıştığını kurcalayıp görebilir inceleyebilirsiniz.Hepinize kolay gelsin.

18 Ocak 2009

Tütün: Dünyanın En Eski Blogcusu

Dostlar geçen gün bir süredir uğramadığım bir blogu ziyaret ettim. Ziyaret nedenim ise kendi blogumda verdiğim linkleri kontrol etmekti. Ziyaret ettiğim blog ise ALTI ÜSTÜ TASARIM. Sahibi çok yetenekli, başarılı bulduğum, yazılarını beğendiğim ve sırf bu nedenle de kitabını yayınlar yayınlamaz aldığım Mehmet DOĞAN. Şimdi bu adam ne anlatıyor diyebilirsiniz. Ne anlattığıma gelince.

Mehmet Doğan’ın Kanada’da yaşadığını şimdilerde ise artık Dübai’de yaşadığını biliyorum. Fakat öncelikle bu ziyaretim sonunda çok üzüldüm. Çünkü artık Mehmet Doğan blogunda yazma işine son vermiş. Artık çok değer verdiğim zeka pırıltısını yansıttığı yazılarından mahrum kalacağız. Onu blogunda yayınladığı ve çok beğendiğim bir yazısını iznini almadan sizlere aktaracağım. Umuyorum önümüzdeki günlerde Mehmet Doğan’ın yazılarını tekrar zevkle okuma ve değerli fikirlerinden yararlanma fırsatını buluruz. Değerli kardeşim Mehmet Doğan’a yeni yaşamında mutluluklar ve başarılar dilerim. Aşağıdaki yazısını sizlerde beğenirsiniz umarım.

Tütün: Dünyanın En Eski Blogcusu

mehmet Acemi Blogcu sayesinde öğrendiğim gerçekten ilginç bir konu tartışılıyor Postitler blogunda. Kisaca konu, Türkiye'deki blog dizinlerinin yeteri kadar yeterli olup olmadığı ve bu blog karmaşası içinde “öksüz bırakılan” bloglar.

Konu ile ilgili yorumlarımı Postitler’in ilgili yazısına ekledim ama biraz daha bu konu hakkında yazmak istiyorum.

Ama öncellikle ben birçok kişinin çok iyi bildiği, sinsi, keyifli, öldürücü, en kötü kolonya kokulu bir bitkiden bahsetmek istiyorum: Tütün.

Tütün, isim olarak, belki de dünya üzerinde en iyi tanınan bitkilerden biri. Görünüş olarak diğer bitkilerden çok farklı olmasa da özünde, çok ilginç bir bitki. İlginçliği, insanoğlunun ürettiği sigara ya da o iğrenç kokulu kolonya yapımı ile alakalı değil. Esas ilginç olan, tütün bitkisinin, belki de dünyanın en eski blogcusu olmasında. Evet haklısınız! Tütün bitkisinin blogunu ne blogspotda, ne bloglar aleminde ne de blog kardeşliğinde gördünüz. Hiçbir yazısını okumadınız. Gerçi tütün bitkisinin blogundaki yazılar çok ilginç olmasa da; yazıların içeriği birbirine benzese de, sizin bu blogu okumamanızın sebebi bunlar değil. Çünkü bu bitkinin yazılarını, mesajlarını okuyan bizler değil, Polistes adı verilen bir çeşit arı.

Danimarkalı bir çiftçi Thomas Harttung, bu tütün bloğunun nasıl oluştuğunu bakın nasıl anlatıyor:

Her şey, karnı aç bir hornworm adı verilen tırtılın, en sevdiği yemek olan, tütün yapraklarına tırmanması ile başlar. Tırtıl, göze ve dişe gelir bir yaprağın üzerinde mola verir. Tütün yaprağı bu gelişmeden habersizdir çünkü tütün yaprağını ziyaret eden birçok canlı vardır. Her canlının, her böceğin tehlikeli olacağını bilemez. Fakat bahsi geçen tırtılın, ilk ısırığı sayesinde, bu tırtılın tükürüğünü tanıyan tütün yaprağı, bu ziyaretin iyi bir ziyaret olmadığını anlar ve buna karşılık, kendisi kimyasal bir sıvı salgılamaya başlar (blog yazısı). Kimyasal madde salgılandıktan sonraki tırtıl ısırıkları, bu kimyasal salgının, tırtılın vücuduna girmesini sağlar ve tırtıl bir müddet sonra, tok olduğunu hisseder. Halbuki yeni başlamıştır yemeğe. Fakat tütün yaprağı, zamanının az olduğunu bilmektedir çünkü tırtılın tokluk hissi çok uzun sürmeyecek ve yaprağı yeniden yemeye başlayacaktir. Fakat tütünün salgıladığı bu kimyasal maddeyi fark eden (blog yazısını) yalnızca tırtıl değildir. Hani bizim blog yazıların başka bloglardan linklenmesi, Technorati’de indekslenmesi gibi, bu kimyasal madde, kilometreleri aşarak, polistes adı verilen bir çeşit arıya kadar ulaşır (bir nevi RSS). Kimyasal maddenin içeriği “yardıma ihtiyacım var, üzerimde bir tırtıl, yapraklarımı yiyor. Biliyorum senin yumurtalarını koyacak bir yere ihtiyacın var. İşte aradığın fırsat” demektedir. O küçücük arı, kilometrelerce yolu kateder, binlerce tütün yaprağı içinden, bu yardımı blog yazısını yazan tütün yaprağını, eliyle koymuş gibi bulur. Tabi ki tırtılı da (artık bu arı, blog kardeşliğini mi, bloglar alemini mi, Technorati’yi mı yoksa Google Haritayı mı kullanıyor, o kısmı belirsiz). Arı, bu sorun yaratan tırtılın,üzerine, yumurtalarını yerleştirir çünkü tırtılın yüzeyi, arının yumurtaları için mükemmel bir ortamdır. Tırtılın, bu durumda, çekip gitmek, ya da orada yumurtalara gömülüp, arının ataklarıyla ölmekten başka şansı yoktur. Böylece hem arının gelecek nesilleri hem de tütün yapraklarının yaşamı garantilenmiş olur.

İşte basit bir iletişim, etkili bir networkun doğada oluşturduğu efekt. Tütün bitkisi bile, yaşamı için network, link ve iletişime ihtiyacı varken, blogların böyle bir ortamdan yaşamalarını devam ettirmek için yararlanamayacağını düşünmek bence hata olur.

Siz ne dersiniz?

Dipnot: Eğer tütün işiyle uğraşan bir çiftçi tanıdığınız varsa, yukarıda anlatılanların kendi tütün tarlalarında gerçekleşmediğini, o tırtılların, insan yapımı kimyasal madde (DDT gibi) ile öldürüldüğünü size söyleyecektir. Doğru! Bunun nedeni, günümüzde tütünün ticari bir değeri olması ve bu nedenle, tütünün, gerçek habitatında değil, koşullandırılmış, ticari tarım alanlarında yetiştirilmesi. Bu nedenle, tütün, doğa içinde oluşturulduğu networkden yoksun. Blogunu okuyan arılardan uzak.

KAYNAK: ALTI ÜSTÜ TASARIM

YAZAN: Mehmet DOĞAN

06 Ocak 2009

BLOGLARA MESAJ FORMU EKLEMEK

DDostlar bugün yazacaklarım bana sürekli sorulan bir konu hakkında. Yine nette alakasız bir şey ararken Blogger ve diğer web sitelerinde ihtiyaç duyulan bu hadiseyi şu anda hepiniz merak ediyorsunuzdur. Bloglarınızı veya web sayfalarınızı ziyaret edenlerle aranızda iletişim sağlayan bu araçla ilgili daha önce bir yazı yazmıştım. Yine bu gün iki siteden bahsedeceğim bu siteler size mesaj göndermek isteyen ziyaretçilerin bu isteğini yerine getiriyor. Her ikisinide de blogunuza adapte etmek çok basit.

Yada bana öyle geldi. HTML yani web tasarımı bilmeyen dostlar için söylüyorum. Bilenler zaten hemen bloglarında buna uygun düzenlemeleri hemen yapacaklardır. Bilmeyenler içinse tavsiyem, öncelikle kendinize buna uygun şablon seçmenizi öneririm. Yok ben şablonumdan memnunum diyenler içinde önerilerim olacak tabii. Şimdi gelelim bahsi geçen sitelerin bu hizmetlerini sırayla anlatmaya.

İlk anlatacağım site CONTACTİFY adlı bir site. Burada yapılan işlem çok basit. Bu sitenin giriş sayfasındaki üyelik formunu dolduruyorsunuz. Daha sonraki aşamada size bir link ile birlikte bir hesap numarası veriliyor. Bu verilen linki şablonunuzda varsa eğer yoksa da bir iletişim düğmesi veya resmi yapıp bu yarattığınız düğmeye veya resme atayabilirsiniz. Eğer bu size zor gelirse CONTACTİFY bunu da düşünmüş ve bir WİDGET yapmış. Size bu widget’in embed kodlarını veriyor sizde bunu blogunuzda uygun bir yere koyuyorsunuz. Nasıl mı? Embed kodlarını kopyalıyorsunuz. Blogunuzda Yerleşim sekmesinde sayfa öğeleri bölümünde Gadget Ekle ye tıklıyorsunuz. HTML/JavaScript'i Yapılandır aracını açıp kopyaladığınız kodları yapıştırıp kaydet diyorsunuz. Bu kadar basit….

Bu sitenin verdiği url linkini bir düğmeye veya bir resme de atayabilirsiniz. Bu bir posta kutusu resmi veya İLETİŞİM kelimesi de olabilir

ÖRNEK KOD:

Görünüş:

İLETİŞİM

şeklinde görünecek. Yine bunu HTML/JavaScript aracı ile istediğiniz yere koyabilirsiniz..

Resme atama işini ise ya benim gibi bir resim yapacaksınız veya uygun bir resim bulacaksınız o resme aşağıdaki gibi atama yapacaksınız. Yine HTML/JavaScript aracı ile blogunuzda istediğiniz uygun bir yere koyacaksınız.

Örnek Kod:

GÖRÜNÜŞ:

Gelelim ikinci siteye; Bu sitenin adı ise Email Me Form. Bu siteye de üye oluyorsunuz. Daha sonra birkaç aşamada kendi formunuzu oluşturuyorsunuz. Daha önce anlattığım CONTACTİFY ve Email Me Form un paralı hizmeti de var. Her ikisinde de paralı hizmetlerde extra ilaveler sunuyorlar. Bu sitelerden başka bu hizmeti bedava veren yüzlerce site var. Diğerlerini de google da aratırsanız onları da inceleme fırsatı bulabilirsiniz.

Email For Me size hem Mesaj formunun kodlarını veriyor. Hem de bir link veriyor. Hangisini isterseniz kullanabilirsiniz. Daha önce CONTACTİFY de anlattığım uygulama aşamaları bunun içinde aynen geçerli. Örneklerin uygulama linkleri aşağıda verilmiştir.

ÖRNEK:

Yukarıdaki örnek formu bir düğmeye ataması yapılmış çalışan örneği buradan görebilirsiniz. Diğer örnek uygulamalarıda aşağıdaki linklerden görebilirsiniz.

RESİM UYGULAMASI ÖRNEK: test ediyorum

DÜĞME ÖRNEK: DENEME

BLOG İÇİ UYGULAMASI ÖRNEK: DENİYORUS (Blogda burda olduğu gibi en alta konabilir.)

04 Kasım 2008

BLOGGER ÖZELLİKLERİ

Dostlar epeydir buraya yazı yazmıyordum. Bu gün buraya yazacak birşey buldum. Belki bazılarınızın haberi vardır ama ben bu yazıyı bu olaydan haberi olmayanlar yada farkında olmayanlar için kaleme aldım. Yandaki BLOGGER ın logosunu gördüğünüzden zaten yazının içeriğinin BLOGGER ile ilgili olduğunu hemen anlamışsınızdır. Yazının içeriği henüz BLOGGER ile yeni tanışanların da özellikle ilgisini çekecektir.

Şimdi yeni başlayanlar için blogger da bir blog yaratmayı başardınız yada zaten bir blog sahibi olanlar blogger a giriş yapsınlar. Herhangi bir postu (daha önce yayınlamış olduğunuz bir yazıyı) yada yeni bir yazı yazıp yayınlayın. Yayınlama durumu sekmesine geleceksiniz. Yani aşağıda resmi görülen bölüm.

Bu bölümde sağ alt köşede görülen kutucukdaki Blogger Features Page yazan linke tıkla. Aşağıda resmi görülen kutucuk.

Ta taaa...İşte aşağıda BLOGGER ÖZELLİKLERİ sayfasına hoş geldiniz. Çok detaylı hemde türkçe hazırlanmış. Hoşunuza gidecektir umarım. Ben BLOGGER la tanışıp da ilk blog hazırladığım günlerde böyle bir kolaylık yoktu, ya da vardı da belki ingilizce yazdığı için böyle bir hadiseden şahsen benim haberim yoktu. Hem türkçe kaynak bulmamızda çok zordu. Hemen hemen hiç yokdu desem yeridir. Sonra EMREX(Yunus Emre) konuyla ilgili bir grup oluşturdu. Tabiiki yine konuyla ilgili de bir blog. Ondan çok şey öğrendim. Buradan ona sevgilerimi gönderiyorum. Belki şu anda kulaklarıda çınlıyordur. Hepinize kolay gelsin. BLOGGER ÖZELLİKLERİ sayfasının da resmi ahanda aşağıda.......

Hala bir blog hazırlamadıysanız bu sayfaya direk buradanda Blogger Features Page gidebilirsiniz. Kolay gelsin.......

21 Ağustos 2007

MESAJ FORMU YAPALIM

Bu gün epeydir nasıl yapabileceğimi düşündüğüm İLETİŞİM FORMU üzerine bir Program keşfettim. Kesinlikle nefis bir alet çok da güzel çalışıyor. Spam tehlikesine de çözüm getirilmiş. Gönderilen mesajlar filitreleniyor. İşin güzel yanı hazır formların yanı sıra kendi formlarınızı kendiniz hazırlayabileceğiniz gibi programın kendi kütüphanesinde hazır e-mail ve kontak formlarda var. Yalnız ufak tefek düzeltmeler gerekiyor. Birkaç aşamadan sonra formu istediğiniz gibi yayınlayabilirsiniz. Programı veren site sizin formunuza birisi mesaj yazıp gönderdiği zaman gönderilen mesaj önce programın sitesine gidiyor spama karşı filitreleniyor daha sonrada sizin postanıza geliyor. Bu iletişim formunun BLOGGER ve WORDPRESS uygulaması da var. Ben size bu İLETİŞİM FORMU ‘nun BLOGGER için olanını nasıl hazırlayıp blogunuza nasıl koyacağınızı aşama aşama anlatacağım.

BLOGGER İÇİN

1. Öncelikle buradan formu hazırlayacağımız küçük programı indirip kuracağız.

2. Yine aynı programı aldığımız siteye (acount alacağız) üye olacağız.

3. Daha sonra e-mailimize gelen (Your Form ID: ) Form ID no’muz ve password ‘ümüzle siteye giriş yapacağız.

4. Siteye girdikten sonra karşınıza gelen hesap formunu dikkatli doldurmanız gerekiyor.

NOT: Ancak burada formu doldurmadan önce bir tane İLETİŞİM FORMU dolduran ziyaretçinin yönlendirileceği teşekkür sayfası birde HATA bildiren sayfa hazırlamanız gerekiyor veya teşekkür yerine tekrar blogunuzun ana sayfasına da yönlendirebilirsiniz. Peki bir teşekkür mesajının yayınlandığı sayfa nerde olacak. Bloggerda böyle bir sayfa hazırlama imkanımız yok. Ne yapabiliriz. Bunun için yine elimizin altında ki bir GOOGLE hizmetinden yararlanacağız. O işlemi de ayrı bir başlıkta aşağıda anlatacağım.

5. Daha sonra dönüp bilgisayarımıza kurduğumuz programı çalıştırıyoruz. Basit bir program. Kütüphanesindeki hazır formları açıp nasıl yapıldığını inceleyin. Bu formları türkçeye çevirip yayınlayabilirsiniz. Formu hazırladıktan sonra resimde görülen CREAT CODE yazan butona basıyoruz.

Yine resimde görülen MY USER ID: karşısına mailinize gönderilmiş ID inizi resimdeki gibi yazıyorsunuz.

Daha sonra continue düğmesine basıp resimlerdeki gibi düğmeleri işaretliyorsunuz.

En son geldiğiniz yerde FORM unuzun kod larını göreceksiniz. buradaki Preview in your default browser düğmesine basarsanız tarayıcıda bitmiş halini görebilir ve geriye dönüp gerekli düzeltmeleri yapabilirsiniz. Export as text düğmesine basarak text dosyası olarak kaydedebilirsiniz. Copy to clipboard düğmesine basarak formunuzun kodlarını kopyalabilirsiniz. Biz copy to clipboard düğmesine basacağız. Daha sonra blogumuzu açıp kontrol panelde yeni gönderi linkine basıyoruz. Resimde görüldüğü gibi HTML düzeninde kopyaladığımız kodları yapıştırıyoruz. İletişim Formunun başlığını yazıyoruz. Aşağıda resimde görüldüğü gibi aşağıda sol köşedeki yazı seçenekleri linkine tıklıyoruz resimdeki daire içindeki seçimleri yapıp yazıyı yayınla tuşuna basıp formumuzu yayınlıyoruz.

Benim bitmiş Formumun resmi aşağıda. Hepimize geçmiş olsun. Yeni iletişim formunuzu güle güle kullanın...

TEŞEKKÜR VE HATA SAYFALARININ YAPIMI

Tarayıcımızda Google ana sayfayı açalım. Sağ üst köşedeki oturum açın linkine tıklayacaksınız. Açılan sayfada resimde görülen aynı köşede bu sefer hesabım linkine tıklayacaksınız.

Yine açılan sayfada resimde görülen sayfa oluşturucu linkine tıklayacaksınız.

Eğer bu linki göremiyorsanız telaşa kapılmayın sayfanın altında yine resimde görüldüğü gibi daha fazla linkini bulup tıklayacaksınız. Daha sonra açılan sayfada yine resimde görüldüğü gibi Labs linkine tıklayın. Google Page Creator linkini bulup tıklayacaksınız.

Biraz uzun oldu ama az kaldı. Burada açılan sayfada I'm ready to create my pages düğmesini bulup tıklıyoruz. Gözünüz aydın geldik. Oda ne…! Şimdi karşımıza hazır yapılmayı bekleyen bir web sayfası çıktı. He..he …Evet burada resimlerdeki gibi iki tane basit sayfa hazırlayıp yayınlayacağız. Sonra bunların tarayıcının adres çubuğundaki URL lerini WebFormDesigner sitesindeki acount formunda ilgili yerlere koyacağız. Yani bir TEŞEKKÜR sayfası birde HATA sayfası adreslerini (URL) ilgili yerlerine koyacağız. Evet şimdi İletişim Formu muzu yapıp test edebiliriz. Kolay gelsin. Oh be……

NOT: Acount formu İngilizce olduğundan bende İngilizce bilmediğimden buradaki online tercüme sitesinden yararlandım sizinde denemenizi tavsiye ederim. Çok güleceksiniz……! he he…..!Sayfaları yaptığımız google daki yere istediğiniz kadar resim, video, mp3, doc, v.s. dosya yükleyebilirsiniz Kapasite 100 Mb a kadar aklınızda bulunsun. Yükledikten sonra dosya üstüne tıklayıp tarayıcıdaki adresleri ile de bu dosyaları blogunuzda bir download listesi oluşturup dostlarınızla paylaşabilirsiniz.

BU FORMUN RESMİ

AHANDA BURADAKİ DE ÇALIŞAN KENDİSİ

BANA BURADAN MESAJ GÖNDEREBİLİRSİNİZ...