kaxigt.com

Jag skriver om webben för webben

Dynamisk bild i din header alternativ 2

Postad: 20 februari 2009 | PHP/ASP/SSI · Wordpress | No Comments
Lästid: < 1 minut

I föregående guide så använde vi oss av $num variabeln och PHP rand(). Detta alternativ är betydligt enklare. I princip handlar det om att infoga en lös bild inuti div-blocket header. I bildkoden lägger vi in bildens storlek samt vilka bildformat som koden ska exekvera.

Denna post innehåller kod-snippar som du kan använda. Det är alltid bra att ta en backup av din stilmall och funktionsfil innan.

Gör så här

  1. Börja med att skapa dina bilder
  2. Se till att bildens storlek överensstämmer med divblockets storlek. Du behöver inte använda den nuvarande storleken som angivs i koden men alla bilder måste ha samma
  3. Skapa en särskild mapp för bilderna inuti din befintliga bildmapp. Här utgår vi från att den nya mappen ska heta headers
  4. Sökvägen till dina bilder som ska rotera blir följande: wp-content/themes/ditt_tema/images/headers/
  5. Öppna sedan din header.php
  6. Lägg följande kod inuti divblocket header
<?php $curdir=getcwd(); chdir(get_template_directory() . "/images/headers"); $files=glob("*.{gif,png,jpg,gif}", GLOB_BRACE); chdir($curdir); $file=$files[array_rand($files)]; ?>

<img src="<?php echo(get_bloginfo('template_url')." />" width="770" height="140" alt="<?php bloginfo('name'); ?> random header image" />

Koden ovanför kommer att generera en bildkod som ser ut så här:

<img src="http://din.domän/wp-content/themes/ditt_tema/images/headers/bilden.jpg" alt="bloggens namn random header image" width="770" height="140" />

Du kan ändra informationen random header image i alttaggen till vad du vill

<?php bloginfo('name'); ?> <span style="color: #b06523;">roterande bild</span>" />

Hämtat från zzamboni.org/brt/