Grafik in Header-Menü neben Text einfügen

sven1309

Hallo Wordpressler,
die SuFu hat nichts gebracht, deshalb dieses Posting: ich würe gerne neben dem Header-Menü meines Blogs zwei Grafiken einfügen (1. RSS-Feed-Grafik, 2. "Logo" des Blogs) und zwar in der gleichen Zeile, in der jetzt die Menüeinträge "Home", "Team" usw. stehen. Dabei sollte wenn möglich das Bloglogo rechtsbündig eingebunden werden, die RSS-Grafik direkt hinter dem letzten Eintrag des Menüs.

Welchen Code brauche ich für diese Aktion?

Besten Dank für eure Hilfe

Sven

http://www.volleblende.de

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

Poste doch bitte mal den Codeausschnitt aus der header.php, welcher die blaue Zeile generiert.

sven1309

Bevor da ein Schnipsel fehlt poste ich mal den gesamten Header:

Zitat

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<meta name="distribution" content="global" />
<title><?php if (is_home () ) { bloginfo('name'); echo ' - '; bloginfo('description'); } elseif ( is_category() ) { single_cat_title(); echo ' - ' ; bloginfo('name'); } elseif (is_single() ) { single_post_title();} elseif (is_page() ) { single_post_title();} elseif (is_search()) { _e("Search Result");} else { wp_title('',true); } ?></title>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" charset="utf-8"/>
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_get_archives('type=monthly&format=link'); ?>
<?php wp_head(); ?>
</head>
<body>
<div id="container">
<div id="topbar">

<ul>
<li><a href="<?php bloginfo('url'); ?>" title="<?php _e('Home'); ?>" id="home">Home</a></li>
<?php wp_list_pages('depth=2&sort_column=menu_order&title_li=' ); ?>
</ul>
</div>
<div id="header">
<?php
if (function_exists(nggSlideshowWidget))
{ nggSlideshowWidget(53,960,170); }
?>

</div>

Alles anzeigen

Danke für die Hilfe!

Sven

Ammaletu

Sollte dann in etwa so aussehen (Code im übrigen bitte als Code posten, nicht als Zitat):

PHP

<ul>
  <li><a href="<?php bloginfo('url'); ?>"  title="<?php _e('Home'); ?>"  id="home">Home</a></li>
  <?php  wp_list_pages('depth=2&sort_column=menu_order&titl  e_li=' );  ?>      
  <li><a href="<?php bloginfo('rss2_url'); ?>" class="feedlink" rel="nofollow" title="RSS-Feed"><img src="<?php bloginfo('template_directory'); ?>/img/feed-icon.png" width="16" height="16" alt="Newsfeed" class="feedicon" /></a></li>
          <li class="blogLogo"><img src="<?php bloginfo('template_directory');  ?>/img/blog-logo.png" width="x" height="x" alt="<?php bloginfo('description'); ?>" /></li>
         </ul>
<div style="clear: right;"></div>

Adresse und Größe beider Bilder musst Du natürlich anpassen. Außerdem müsstest Du mit den Styles mal etwas experimentieren. Die jetzigen Menüpunkte sind alle nicht sehr hoch, weil der Abstand scheinbar am ul steckt und nicht in den lis. Kanns ein,d ass das Feed-Icon das dann je nach Größe verschiebt.

Für das Blog-Logo dann das hier ins Stylesheet:

Code

li.blogLogo {
  float: right;
}

Hm, das ist mit dem float und clear bestimmt noch nicht so einfach, aber vielleicht kommst Du damit ja schon mal weiter. Ansonsten sag Bescheid, dann schaue ich mal genauer.

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Grafik in Header-Menü neben Text einfügen

Jetzt mitmachen!