PRETTY TEMA ÜST MENÜ VE SOSYAL PAYLAŞIM BUTONU EKLEME

THEMES BLOCK ücretsiz blog temaları sitesinden indirdiğiniz PRETTY THEME temasını kullanıyorsanız HTML kodlarında yapacağınız bazı ekleme ve düzenlemelerle yukarıdaki resimde göründüğü gibi sosyal paylaşım butonları ve Ana Menü ekleyebilirsiniz. Temayı indirmeden önce mutlaka blogunuzun yedeğini almayı unutmayın.

PRETTY THEMES İNDİR

Temayı bilgisayarınıza yükledikten sonra aşağıda verdiğim bilgiler dahilinde sosyal paylaşım adreslerinizi kendinize göre düzenlemeyi unutmayın. Şimdi Blog Yönetim Panelinden ŞABLON yazısına tıklayın YEDEKLE/GERİ YÜKLE'ye tıklayın. Bilgisayarınıza indirdiğiniz temayı DOSYA SEÇ'e tıklayarak seçin ve YÜKLE'ye tıklayın. Bazı ayarlarınızı baştan yapmak zorunda kalabilirsiniz. Mutlaka temanızın yedeğini almayı unutmayın. 

1- Aşağıdaki kod dizilimi ANASAYFA (getana) ikonunun sayfa üzerindeki konumunun belirlendiği yerdir. Buradaki rakamları değiştirerek ikonu dilediğiniz yere alabilirsiniz. URL ise ikonun bulunduğu adresi belirtir. Eğer ikonları değiştirmek isterseniz. Beğendiğiniz ikonun url adresini kopyalayarak MAVİ renkli alana yapıştırmanız yeterli olacaktır. İkonun boyutu 75 x 75 px'dir.  Aşağıdaki aynı kod dizilimi getcilt, getsac, getkozmetik, getvideo, getrss, getface, gettwit, getgoog içinde geçerlidir. Eğer ekleme yapmak isterseniz kod dizilimini ŞABLON/ HTML DÜZENLE alanından kod sayfasına aşağıdaki kod dizilimini bulup altına kopyalayın. kırmızı alandaki get'in yanına yeni ikonunuzun adını yazın sarı alandaki top ve width kodunun karşısındaki rakamlardan sayfa üzerindeki konumunu belirleyin, ikonun url adresini girin ve kaydedin.

#getana a{
position:absolute;
right:10px; 
top:150px;
height:60px;
width:875px;
display: block;
text-indent:-10000px;
background: url(http://i974.photobucket.com/albums/ae227/nettenekisimkani/ikon/anasayfa_zpsa14c7824.png) no-repeat 0 0;
overflow: hidden;
}

2-  Yukarıdaki kod dizilimi ile fark ettiyseniz kırmızı ile yazılmış olanları aynıdır.Yukarıdaki kod aynı zamanda ikonun üzerine gelindiğinde el işaretinin çıkmasını sağlar. Aşağıdaki kod diziliminde ise ikona tıklandığında hangi adrese (aşağıdaki kod diziliminde yer alan mavi yazılar) gideceğini belirtirsiniz. Yeni bir ekleme yaptığınız zaman aşağıdaki kodlardan birini kopyalayarak (kırmızı alanların aynı olması şartı ile) url adresini girmeniz yeterli olacaktır. Yeşil alan ise ikonun üzerine geldiğinizde el işaretinin hemen yanında görülen açıklama yazısı içindir. Eğer bir açıklama görünmesini istemiyorsanız >  < işaretleri arasındaki açıklamayı silmeniz yeterli olacaktır.

ANA MENÜ BUTONLARI

<div id='getana'><a expr:href='data:blog.Url + &quot;http://deneme551974.blogspot.com&quot;' title='Anasayfa'>Ana Sayfa</a></div> 

<div id='getcilt'><a expr:href='data:blog.Url + &quot;http://deneme551974.blogspot.com/search/label/cilt%20bak%C4%B1m%C4%B1&quot;' title='Cilt Bakım'>Cilt Bakım</a></div> 

<div id='getsac'><a expr:href='data:blog.Url + &quot;http://deneme551974.blogspot.com/search/label/sa%C3%A7%20bak%C4%B1m%C4%B1&quot;' title='Saç Bakım'>Saç Bakım</a></div>    

<div id='getkozmetik'><a expr:href='data:blog.Url + &quot;http://deneme551974.blogspot.com/search/label/kozmetik&quot;' title='Kozmetik'>Kozmetik</a></div> 

<div id='getvideo'><a expr:href='data:blog.Url + &quot;http://deneme551974.blogspot.com/search/label/video&quot;' title='Video'>Video</a></div> 

SOSYAL PAYLAŞIM BUTONLARI

<div id='getrss'><a expr:href='data:blog.Url + &quot;http://www.feedburner.com&quot;' title='RSS'>Rss Feed</a></div> 

<div id='getface'><a expr:href='data:blog.Url + &quot;http://www.facebook.com&quot;' title='Facebook'>Facebook</a></div>

<div id='gettwit'><a expr:href='data:blog.Url + &quot;http://www.twitter.com&quot;' title='Twitter'>Twitter</a></div>

<div id='getgoog'><a expr:href='data:blog.Url + &quot;https://plus.google.com&quot;' title='GooglePlus'>GooglePlus</a></div>


ÖRNEK
Diyelim ki rss ikonunun yerine INSTAGRAM ikonunu eklemek istiyorsunuz.

a) Kod sayfasından getana'yı CTRL+F yaparak bulun (aşağıdaki kod dizilimi) ve hemen altına örnekteki gibi kopyalayıp mavi alanları değiştirin. Yeşil alanlarda değişiklik yaparak ikonun konumunu belirtin.

#getana a{
position:absolute;
right:10px; 
top:150px;
height:60px;
width:875px;
display: block;
text-indent:-10000px;
background: url(http://i974.photobucket.com/albums/ae227/nettenekisimkani/ikon/anasayfa_zpsa14c7824.png) no-repeat 0 0;
overflow: hidden;
}

#getinstagram a{

position:absolute;

right:10px; 

top:150px;      

height:60px;

width:875px;

display: block;

text-indent:-10000px;

background: url(INSTAGRAM İKONUNUN URL ADRESİ) no-repeat 0 0;

overflow: hidden;

}

b) Tekrar CTRL+F yaparak getana'yı bulun (aşağıdaki örnek gibi) CTRL+F ile kopyalayın ve getana'nın altına yapıştırın. Kod diziliminde aşağıdaki örnekteki gibi değişiklikleri yapın ve kaydettin. Örnekte kırmızı alanların aynı olmasına dikkat edin.

<div id='getana'><a expr:href='data:blog.Url + &quot;http://deneme551974.blogspot.com&quot;' title='Anasayfa'>Ana Sayfa</a></div> 

<div id='getinstagram'><a expr:href='data:blog.Url + &quot;İKONA TIKLANDIĞINDA GİDECEĞİ ADRESİ - INSTAGRAM URL'NİZİ&quot;' title='instagram'>instagram</a></div> 

Paylaş :