Wordpress Sitenize Edge Animasyonunuzu Ekleyin

Edge tarafından oluşturduğunuz animasyonunuzu publish ettikten sonra wordpress sitenize ekleyebilirsiniz.

Merhaba, öncelikle ilk defa böyle bir anlatımda bulunuyorum. Hatalarım varsa şimdiden affınıza sığınıyorum.

Edge tarafından oluşturduğunuz animasyonunuzu publish ettikten sonra wordpress sitenize ekleyebilirsiniz.

Şimdi gelelim yapacağımız işe. Mantık olarak bütün yol edge dosyasını publish edip yollarını değiştirmekten geçiyor ama yine de problem çıkmıyor değil. Bir de benim böyle anlatımlarda en sevmediğim şeydir okuyanı bazı şeyleri biliyor varsaymak, onun için ayrıntılı yapmaya çalışacağım. Lütfen sıkılmayın, sonuç güzel.

Öncelikle sizler de benim gibi profesyonel edge kullanmıyorsanız ve edge dosyası için acele ediyorsanız hemen buradan örnek indirebilirsiniz. Boyutları biraz problem ama artık o kadar kusur olacak.

Dosyanızı indirdikten sonra hemen Wordpress sitenizde kullandığınız temanın dosyalarının içerisine atabilirsiniz. Örneğin temanız twentyeleven ise wp-content/themes/twentyeleven yolunu izleyerek atmanız lazım.

Dosyaları attıktan sonra hemen yine temanın header.php sayfasını açıyorsunuz. önce edge_includes içerisindeki dosyaları ve css dosyanız var ise onları dosyaya çağırıyorsunuz burada dikkat etmeniz nokta wp_head bitmeden önce yazmak hemen ben benim dosyalarıma göre örnek kodu aşağıya yazıyorum


<?php  if (is_front_page()) {?>

<script type=?text/javascript? charset=?utf-8? src=? bloginfo(?template_directory?); ?>/edge_includes/jquery-1.7.1.min.js?></script>

<script type=?text/javascript? charset=?utf-8? src=? bloginfo(?template_directory?); ?>/edge_includes/jquery.easing.1.3.js?></script>

<script type=?text/javascript? charset=?utf-8? src=? bloginfo(?template_directory?); ?>/edge_includes/edge.0.1.6.min.js?></script>

<script type=?text/javascript? charset=?utf-8? src=? bloginfo(?template_directory?); ?>/edge_includes/json2_min.js?></script>

<link rel=?stylesheet? href=? bloginfo(?template_directory?); ?>/novecento.css?/>

 }?> ?>



Evet, dikkat ettiyseniz içerisine yazılmakta buna da dikkat ettikten sonra sıra geldi diğer dosyalara.

Geriye animasyonadı_edge.js , animasyonadı_edgeActions.js , animasyonadı_edgePreload.js şeklinde üç dosyamız kaldı onları da aşağıdaki gibi header.php dosyamıza dahil ediyoruz.


<script type=?text/javascript? charset=?utf-8? src=? bloginfo(?template_directory?); ?>/animasyonadı_edge.js?></script>

<script type=?text/javascript? charset=?utf-8? src=? bloginfo(?template_directory?); ?>/animasyonadı_edgeActions.js?></script>

<script type=?text/javascript? charset=?utf-8? src=? bloginfo(?template_directory?); ?>/animasyonadı_edgePreload.js?></script>



Şu an için header.php dosyası ile işimiz bitti, kaydedebiliriz.
Ardından animasyonadı_edge.js dosyasını açıp eğer var ise bütün görsellerinizin yolunu düzenlemeniz gerekecektir.

Örneğin:

Resimdeki gibi bütün görsellere yollarını verip animasyonadı_edge.js dosyamızı da kapatıyoruz.

Ardından animasyonadı_edgePreload.js dosyasını açıyoruz.



Resimdeki gibi gelen load bölümlerini düzenlemeniz gerekmekte. Aşağıdaki resimdeki gibi kendi tema adınıza göre yazıyorsunuz.



Bu işlemden sonra dosyamızı kaydedip kapatabiliriz.

Şimdi son bir küçük işlem kaldı edge tarafından oluşturulan .html dosyasını açıyoruz. Orada tanımlı bir div göreceksiniz.
Örneğin:

<div id="stage" class="EDGE-281551585></div>

şeklinde bu kodu alıp header.php dosyasında görünmesini istediğiniz header bölümüne ekliyorsunuz. Ve kaydedip değişiklik yaptığınız dosyalarınızı güncelliyorsunuz. Kolay gelsin : )

Bu arada örnek olarak header kullandık ama istediğiniz dosyalara div etiketi ile ekleyebilirsiniz.
  • Etiketler;
Nesrins Nesrins
Sanalkurs.net
Yorum Yaz

Yorum yazabilmek için üye girişi yapmanız gerekiyor!

çok teşekkür ederiz değerli paylaşımınız için.
Ben teşekkür ederim yorumunuz için..

Yukarı Git