Flash header yapımı

17
Mar

Drupal sitelerimizde en zorlandığımız konu flash banner gibi düşünülsede en kolayı odur. Gerci bunu dinamik olarak yapan bir modül varmı bilmiyorum ben burada manuel olarak nasıl yaparız onu anlatacağım.

Aşamalı olarak anlatmak gerekirse:

  • SWFobject javascript dosyasını sistemimize entegre edeceğiz.
  • Tema dosyasında gerekli ayarlamaları yapacağız.

Şimdi sıra ile yapalım:

İlk olarak buradanSwfObject apisini indirip eklentiler bölümünden drupal sitemizde eklentiyi aktif ediyoruz.

Sıra tema dosyamızda değişiklik yapmaya geldi. Temamızı yüklediğimiz dizine ftp aracılığı ile ulaşarak page.tpl.php sayfasını bir editor yardımı ile açıyoruz.

Aşağıdakine benzer bir şekilde div tanımlaması olacaktır:

<div id="header"><div id="header-inner" class="clear-block">
....
....
</div></div>

Bu bölümün içersindeki kod satırlarını siliyoruz.
sildiğimiz satırlar drupalin temelindeki başlık, logo, açıklama metni, v.b. (belkide arama bölümüde dahildir) sitemizin üst header bölümünden kaldırmış oluyoruz.

Page.tpl.php dosyası içersindeki değiştireceğimiz kod satırları aşağıdakine benzer şekildedir:

<div id="header"><div id="header-inner" class="clear-block">
      <?php if ($logo || $site_name || $site_slogan): ?>
        <div id="logo-title">
          <?php if ($logo): ?>
            <div id="logo"><a href="<?php print $base_path; ?>" title="<?php print t('Home'); ?>" rel="home"><img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" id="logo-image" /></a></div>
          <?php endif; ?>
          <?php if ($site_name): ?>
            <div id='site-name'>
              <a href="<?php print $base_path; ?>" title="<?php print t('Home'); ?>" rel="home">
                <strong><?php print $site_name; ?></strong>
              </a>
            </div>
          <?php endif; ?>
          <?php if ($site_slogan): ?>
            <div id='site-slogan'><?php print $site_slogan; ?></div>
          <?php endif; ?>
        </div> <!-- /#logo-title -->
        <?php if ($search_box || $header_right): ?>
          <div id="header-bar"><div id="header-bar-inner" class="region region-header-bar">
            <?php if ($search_box): ?>
              <h3 id="search-title"><?php print t('Search'); ?></h3>
              <div id="search-box">
                <?php print $search_box; ?>
              </div> <!-- /#search-box -->
            <?php endif; ?>
            <?php if ($header_right): ?>
              <div id="header-right-blocks" class="region region-header-right">
                <?php print $header_right; ?>
              </div> <!-- /#header-right-blocks -->
            <?php endif; ?>
          </div></div> <!-- /#header-bar-inner, /#header-bar -->
        <?php endif; ?>
      <?php endif; ?>
      <?php if ($header): ?>
        <div id="header-blocks" class="region region-header">
          <?php print $header; ?>
        </div> <!-- /#header-blocks -->
      <?php endif; ?>
    </div></div> <!-- /#header-inner, /#header -->

Yukarıdaki kod satırlarında:

<?php if ($logo || $site_name || $site_slogan): ?>
        <div id="logo-title">
          <?php if ($logo): ?>
            <div id="logo"><a href="<?php print $base_path; ?>" title="<?php print t('Home'); ?>" rel="home"><img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" id="logo-image" /></a></div>
          <?php endif; ?>
          <?php if ($site_name): ?>
            <div id='site-name'>
              <a href="<?php print $base_path; ?>" title="<?php print t('Home'); ?>" rel="home">
                <strong><?php print $site_name; ?></strong>
              </a>
            </div>
          <?php endif; ?>
          <?php if ($site_slogan): ?>
            <div id='site-slogan'><?php print $site_slogan; ?></div>
          <?php endif; ?>
        </div> <!-- /#logo-title -->
        <?php if ($search_box || $header_right): ?>
          <div id="header-bar"><div id="header-bar-inner" class="region region-header-bar">
            <?php if ($search_box): ?>
              <h3 id="search-title"><?php print t('Search'); ?></h3>
              <div id="search-box">
                <?php print $search_box; ?>
              </div> <!-- /#search-box -->
            <?php endif; ?>
            <?php if ($header_right): ?>
              <div id="header-right-blocks" class="region region-header-right">
                <?php print $header_right; ?>
              </div> <!-- /#header-right-blocks -->
            <?php endif; ?>
          </div></div> <!-- /#header-bar-inner, /#header-bar -->
        <?php endif; ?>
      <?php endif; ?>
      <?php if ($header): ?>
        <div id="header-blocks" class="region region-header">
          <?php print $header; ?>
        </div> <!-- /#header-blocks -->
      <?php endif; ?>

Kısımlarını siliyoruz.

<div id="header"><div id="header-inner" class="clear-block">
....
....
</div></div>

Görünümünü elde ediyoruz.

Flash dosyamızı drupale entegre ettiğimiz swfobject api formatı ile eklemek istersek:

<div id="header"><div id="header-inner" class="clear-block">
<?php

   $url = "swf_dosyasının_adı.swf"; //path to flash file
   $params = array('width' => 100, 'height' => 100 ); // Animasyonun boyutunu giriyoruz.
   //Eklemek istediğimiz ses ve resim dosyaları yoksa bu bölümü silebilirsiniz.
$vars =  array(
     'file' => base_path() . path_to_theme() .'/files/song.mp3',
     'image' =>  base_path() . path_to_theme() ./files/image.jpg,  
    );
//Eklenecek dosya yok ise buraya kadar silinir.
   print theme("swfobject_api", $url, $params, $vars);

?>
</div></div>

Bu şekilde eklemeyi başaramadı iseniz direk olarak html kodları ile ekleyebiliriz.

<div id="header"><div id="header-inner" class="clear-block">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="780" height="420">
        <param name="movie" value="swf_dosya_adı.swf" />
        <!--[if !IE]>-->
        <object type="application/x-shockwave-flash" data="swf_dosya_adı.swf" width="780" height="420">
        <!--<![endif]-->
          <p>Alternative content</p>
        <!--[if !IE]>-->
        </object>
        <!--<![endif]-->
      </object>
</div></div>

width="780" height="420" kısımlarını flash dosyanızın boyutları ile değiştirmeyi unutmayınız.

Sadece ana sayfada flash bannerımız ve diğer sayfalarda normal headerımız görünsün istersek:

<div id="header"><div id="header-inner" class="clear-block">
<?php if ($is_front): ?> // Veya <?php if ($page == 0): ?>
<?php
   $url = "swf_dosyasının_adı.swf"; //path to flash file
   $params = array('width' => 100, 'height' => 100 ); // Animasyonun boyutunu giriyoruz.
   //Eklemek istediğimiz ses ve resim dosyaları yoksa bu bölümü silebilirsiniz.
$vars =  array(
     'file' => base_path() . path_to_theme() .'/files/song.mp3',
     'image' =>  base_path() . path_to_theme() ./files/image.jpg,  
    );
//Eklenecek dosya yok ise buraya kadar silinir.
   print theme("swfobject_api", $url, $params, $vars);
?>
<?php endif; ?>

<?php if ($page != 0): ?>
<?php if ($logo || $site_name || $site_slogan): ?>
        <div id="logo-title">
          <?php if ($logo): ?>
            <div id="logo"><a href="<?php print $base_path; ?>" title="<?php print t('Home'); ?>" rel="home"><img src="<?php print $logo; ?>" alt="<?php print t('Home'); ?>" id="logo-image" /></a></div>
          <?php endif; ?>
          <?php if ($site_name): ?>
            <div id='site-name'>
              <a href="<?php print $base_path; ?>" title="<?php print t('Home'); ?>" rel="home">
                <strong><?php print $site_name; ?></strong>
              </a>
            </div>
          <?php endif; ?>
          <?php if ($site_slogan): ?>
            <div id='site-slogan'><?php print $site_slogan; ?></div>
          <?php endif; ?>
        </div> <!-- /#logo-title -->
        <?php if ($search_box || $header_right): ?>
          <div id="header-bar"><div id="header-bar-inner" class="region region-header-bar">
            <?php if ($search_box): ?>
              <h3 id="search-title"><?php print t('Search'); ?></h3>
              <div id="search-box">
                <?php print $search_box; ?>
              </div> <!-- /#search-box -->
            <?php endif; ?>
            <?php if ($header_right): ?>
              <div id="header-right-blocks" class="region region-header-right">
                <?php print $header_right; ?>
              </div> <!-- /#header-right-blocks -->
            <?php endif; ?>
          </div></div> <!-- /#header-bar-inner, /#header-bar -->
        <?php endif; ?>
      <?php endif; ?>
      <?php if ($header): ?>
        <div id="header-blocks" class="region region-header">
          <?php print $header; ?>
        </div> <!-- /#header-blocks -->
      <?php endif; ?>
<?php endif; ?>
</div></div>

Yukarıdaki kod bölümü ile flash bannerımız sadece anasayfada gözükecek diğer sayfalarda drupal header normal olarak gözükecektir.

Yeni yorum veya soru gönder

Bu alanın içeriği gizlenecek, genel görünümde yer almayacaktır.
  • PHP source code can also be enclosed in <?php ... ?> or <% ... %>.
  • You may insert videos with [video:URL]

Biçimlendirme seçenekleri hakkında daha fazla bilgi


6 + 3 =
Basit matematik sorusunuz çözünüz. Örn; 1+3= 4