Header anpassen

x0x

Hallo, ich möchte von diesesm Theme klick den Header anpassen und zwar soll den Text ein Bild ersetzen (.gif)

Ich denke mal dazu muss ich Änderungen an der header.php vornehmen.
Inhalt der Header.php:

PHP

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">


<head profile="http://gmpg.org/xfn/11">
    <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
    <meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats -->
    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
    <link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />
    <link rel="alternate" type="application/atom+xml" title="<?php bloginfo('name'); ?> Atom 0.3" href="<?php bloginfo('atom_url'); ?>" />
    <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
    <title><?php bloginfo('name'); ?> <?php wp_title(); ?></title>
    <link rel="shortcut icon" href="<?php bloginfo('template_url'); ?>/images/favicon.ico" type="image/x-icon" />
    <link rel="icon" href="<?php bloginfo('template_url'); ?>/images/favicon.ico" type="image/x-icon" />
<?php wp_head(); ?>
</head>


<body>


<div id="outline">


    <div id="header">
        <div class="blogtitle">
            <h1><a href="<?php echo get_settings('home'); ?>" title="<?php bloginfo('name'); ?>"><?php bloginfo('name'); ?></a></h1>
        </div>
    </div> <!-- end of #header -->


    <div id="navbar">
        <ul class="menu">
            <li class="<?php if ( is_home() ) { ?>current_page_item<?php } else { ?>page_item<?php } ?>"><a href="<?php echo get_settings('home'); ?>"><?php _e('Home'); ?></a></li>
            <?php wp_list_pages('sort_column=id&depth=1&title_li='); ?>
            <?php wp_register('<li>','</li>'); ?>
        </ul>


        <div class="searchbar">
            <?php include (TEMPLATEPATH . '/searchform.php'); ?>
        </div>
    </div> <!-- end of #navbar -->




<div id="wrapper">


<div id="content">

Alles anzeigen

Nun habe ich schon selbst mal rummgeguckt und denke mal speziel muss hier etwas geändert werden:

PHP

<div id="header">
        <div class="blogtitle">
            <h1><a href="<?php echo get_settings('home'); ?>" title="<?php bloginfo('name'); ?>"><?php bloginfo('name'); ?></a></h1>
        </div>

Könntet ihr mit freundlicherweise Weiterhelfen? Danke

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

Ammaletu

Yep, Du hast die richtige Stelle schon gefunden. Jetzt einfach den unteren Code-Ausschnitt ersetzen durch das hier:

PHP

<div id="header">
  <div class="blogtitle">
    <a href="<?php echo get_option('home'); ?>/"><img src="<?php bloginfo('template_directory'); ?>/img/header_headline.gif" width="334" height="67" alt="<?php bloginfo('name'); ?>" title="" /></a>
  </div>
</div>

Das Bild legst Du in Deinem Theme-Ordner in den Unterordner "img" (oder wo Du es sonst hin haben möchtest, Pfad entsprechend anpassen). Weite und Höhe musst Du natürlich auch noch anpassen und ggf. noch eine CSS-Klasse ergänzen.

x0x

Hmm zeigt den Header leider noch nicht an.
http://www.abload.de/img/unbenannta0p.png
Eingefügt habe ich das:

PHP

<div id="header">
  <div class="blogtitle">
    <a href="<?php echo get_option('home'); ?>/"><img src="<?php bloginfo('template_directory'); ?>/img/logo3.png" width="334" height="67" alt="<?php bloginfo('name'); ?>" title="" /></a>
  </div>
</div>

Logo liegt hier:http://tinyurl.com/242vxm (klick für Anzeige der wahren Url)
Größe habe ich angepasst.

Zitat

noch eine CSS-Klasse ergänzen.

Das?

Code

/**********************
*   Header            *
***********************/


#header {
    width: 100%;
    height: 118px;
    background: transparent url(images/header_bg.gif) repeat-x left top;
    }


#header .blogtitle {
    width: auto;
    height: 118px;
    background: transparent url(images/header.gif) no-repeat left bottom;
    }
#header h1 {
    padding: 50px 0 0 50px;
    }
#header h1 a {
    color: #fff;
    }

Alles anzeigen

Hmm :oops:

Ammaletu

Och bitte, ein bisschen musst Du jetzt auch selbst noch mitdenken. ;-) Wenn das Bild im Ordner "images" liegt, muss es so natürlich auch im Quelltext stehen. Den Ordner "img" hab ich dort nur reingeschrieben, weil das bei mir immer so heißt. Kannst Du ja nennen, wie Du willst. :-)

Mit CSS meinte ich, musst Du nur ergänzen, wenn Du noch spezielle Stylewünsche hast. Das siehst Du dann ja, wenn das Bild angezeigt wird. Die bisherige H1-Klasse wirkt dafür natürlich nicht mehr.

x0x

Zitat

Wenn das Bild im Ordner "images" liegt, muss es so natürlich auch im Quelltext stehen.

Das hatte ich mir auch erst gedacht und es so hingeschrieben. Aber auch dabei wurde es nicht angezeigt.

So hatte ich es schon versucht:

PHP

<div id="header">
  <div class="blogtitle">
    <a href="<?php echo get_option('home'); ?>/"><img src="<?php bloginfo('template_directory'); ?>/imgages/logo3.png" width="264" height="50" alt="<?php bloginfo('name'); ?>" title="" /></a>
  </div>
</div>

Und auch so:

PHP

<div id="header">
  <div class="blogtitle">
    <a href="<?php echo get_option('home'); ?>/"><img src="<?php bloginfo('template_url'); ?>/imgages/logo3.png" width="264" height="50" alt="<?php bloginfo('name'); ?>" title="" /></a>
  </div>
</div>

Ammaletu

Das Bild liegt im Ordner "images" und Du hast "imgages" in Deinem Theme stehen. So, und mehr sage ich dazu nicht. Sorry, aber ein bisschen Eigenleistung kann man doch auch voraussetzen, oder?! Es ist doch nun wirklich keine Kunst sich im Browser mal einen Bildpfad anzuschauen...

x0x

Vielen Dank für deine Hilfe.
Das ist aber ein peinlicher Fehler :oops:

Den Ramen um das Bild hab ich damit entfernt:

Code

<style type="text/css">
img { border:none }
</style>

Muss ich nur noch gucken wie ich es varriieren kann von weiter oben bis ganz ins Schwarze.

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Header anpassen

Jetzt mitmachen!