Eine Umsetzung über benutzerdefinierte Felder (custom fields) war die erste Idee, hatte aber den Nachteil, das der Kunde immer den genauen Link zum Image wissen musste, um diesen im benutzerdefinierten Feld eintragen zu können.

Da seit WordPress 2.9 die Möglichkeit des Artikelbildes (post thumbnails) besteht, war das für mich der einfachste Umsetzungsweg dem Kundenwunsch zu entsprechen.

Umsetzung

Zuerst muss in der function.php folgender Code eingetragen werden, um die Funktion Artikelbild für WordPress verfügbar zu machen.

<?php add_theme_support( 'post-thumbnails' ); ?>

Anschliessend ist die Artikelbild Funktion im Backend verfügbar.

Wordpress Artikel

Danach muss nur folgender Code in das entsprechende WordPress Template eingefügt werden. In meinem Fall habe ich die page.php verwendet, um die Erweiterung nur für die Seiten wirksam werden zu lassen. Der Code muss sich aber innerhalb des Loops befinden.

<div id="content" <?php if ( has_post_thumbnail()) { 
$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large');
echo 'style="background: url(' . $large_image_url[0] . ') no-repeat right top;" ';
} ?>></div>

Im Prinzip habe ich dem Div Container #content nur ein festes Stylesheet zugeordnet und lasse über die Funktion Artikelbild den Link zum Foto einblenden. Mit der if Abfrage sichere ich die Einblendung nur bei ausgewählten Artikelbild ab und mit “large” wird die Originalgröße des Fotos benutzt.

Die gesamte page.php sieht dann so aus.

<?php get_header(); ?>

<!-- PAGE.PHP -->

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

<div id="content" <?php if ( has_post_thumbnail()) { 
$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large');
echo 'style="background: url(' . $large_image_url[0] . ') no-repeat right top;" ';
} ?>>

<div id="main">

<div class="post-page" id="post-page-<?php the_ID(); ?>">

<?php the_content(); ?>

</div><!-- #post-page -->

<?php endwhile; endif; ?>

</div><!-- #main -->

<?php get_sidebar(); ?>

<div class="clear"></div>
</div><!-- #content -->

<?php get_footer(); ?>

weitere Infos zum Thema: codex.wordpress.org

Posted in Neu

Kontakt

Kontakt aufnehmen oder neues Webprojekt starten.

Webagentur

Wir sind Ihre Webagentur aus Berlin-Lichtenberg Ortsteil Karlshorst. Wir beschäftigen uns mit Webdesign und Webentwicklung. Wir setzen Webseiten mit den Content Management Systemen Wordpress um und sind Ihre Webdesign Wordpress Berlin Experten.

Ansprechpartner

Medienreformer Hendrik JustHendrik Just
Ihr Spezialist und Berater für die Bereiche Webdesign, Webentwicklung und Programmierung für Drupal und Wordpress. Ich berate Sie kompetent und unverbindlich. Nehmen Sie Kontakt zu mir auf.

Kontakt

Medienreformer
Hentigstraße 28
10318 Berlin-Lichtenberg
Telefon: 030 50 96 95 50
info@medienreformer.de
www.medienreformer.de