ilkönce
public_html/catalog/view/theme/default/stylesheet
Klasorundeki stylesheet.css dosyasının içinde uygun bir yere mesela
label {
cursor: pointer;
}
/* layout */
Kısmının altına
#facelike {
position: absolute;
top: 64px;
left: 270px;
}
kodlarını yapıştırıyoruz ve like butonunun pozisyonlarının nerede olduğunu belirtiyoruz.
Daha sonra
public_html/catalog/view/theme/default/template/common/header.tpl
dosyasını açıp
<?php echo $google_analytics; ?>
</head>
<body>
kodlarının altına enter ile geçip
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/tr_TR/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
script dosyamızı yapıştırıyoruz.
header.tpl dosyamızdan çıkmadan
<div id="container">
<div id="header">
satırlarını bulup altına enter ile geçip
<div id="facelike">
<div class="fb-like" data-href="http://www.opencart-tr.com" data-send="true" data-width="30" data-show-faces="false" data-font="arial"></div></div>
kodlarını yapıştırıyoruz. Ve kaydedip sayfamızı yeniliyoruz.
Eğer Logonuz kurulum sırasındaki gelen logo boyutları ile aynı ise verdiğim kodlar tam olarak logonun yanından başlar ve para biriminin altından ilerler. Yani tam orantılıdır. Tabiki siz pozisyon ayarlaması yapabilirsiniz.
Pozisyon ayarlamak için sytlesheet dosyasına kaydettiğimiz #face css kodlarından
top: 64px; kodu yukarıdan mesafeyi ayarlar. (Kendinize göre değiştirin)
left: 270px; kodu logo başlangıcına (bitim değil) olan uzaklığı ayarlar. (kendinize göre değiştirin)
begen butonundaki web adresi yani opencart-tr.com u kendi sitenize göre değiştirmeyi unutmayın. Eğer begen/gönder düğmesini genişletmek isterseniz
data-width="30" kısmındaki "30" rakamını değiştirerek genişletebilirsiniz.
Beğen seçeneğini kendinize göre ayarlamak ve yeniden kod oluşturmak için
Like Button sayfasını ziyaret edip kod oluşturun. Script dosyasını eklemenize gerek yok
<div class="fb-like" data-href="http://www.opencart-tr.com" data-send="true" data-width="30" data-show-faces="false" data-font="arial"> diye oluşturduğu kodu benim verdiğim kodlar ile değiştirin kendinize göre ayarlamış olacaksınız. Begenenlerin resimlerini görmek isterseniz verdiğim kodda
data-show-faces="false" olan seçeneği
data-show-faces="true" yaparak facebook resimlerinide görebilirsiniz. Fakat stylesheet.css den biraz daha yukarı kaydırmanız gerekecek.
Aşağıda kodların ilgili dosyalara eklenmiş halinin kısmen örneğini vereceğim. Yanlışlıkla kod silip silmediğinizi kontrol edin. Ayrıca YEDEK almayı da unutmayın. Ne olur ne olmaz.
Stylesheet.css dosyası örnek
select {
background: #F8F8F8;
border: 1px solid #CCCCCC;
padding: 2px;
}
label {
cursor: pointer;
}
/* layout */
#facelike {
position: absolute;
top: 64px;
left: 270px;
}
#container {
width: 980px;
margin-left: auto;
margin-right: auto;
text-align: left;
}
header.tpl dosyası örnek
</head>
<body>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/tr_TR/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div id="container">
<div id="header">
<div id="facelike">
<div class="fb-like" data-href="http://www.opencart-tr.com" data-send="true" data-width="30" data-show-faces="false" data-font="arial"></div></div>
<?php if ($logo) { ?>
<div id="logo"><a href="<?php echo $home; ?>"><img src="<?php echo $logo; ?>" title="<?php echo $name; ?>" alt="<?php echo $name; ?>" /></a></div>
<?php } ?>
<?php if (count($languages) > 1) { ?>
Problem olursa zaman buldukça yardımcı olmaya çalışırım. Ek'teki resimde nasıl göründüğüne bakabilirsiniz. Umarım faydalı olur.[/b]