Logo in Template "Oh"

    Hallo Forum,

    ich würde gerne ein einfaches Logo in das Theme http://wordpress.org/extend/themes/oh einfügen. Da aber kein Header existiert und ich mich mit php und css noch nicht besonders gut auskenne ist meine Frage welche Datei ich editieren muss um ein Logo einzubinden? Ich habe bereits versucht in der style.css den betreffenden Code einzufügen, das hat aber zu nichts geführt.

    Das Logo soll in etwa wie auf diesem screenshot positioniert sein.

    Es wäre super wenn ihr mir da einen Anhaltspunkt geben könntet.

    Vielen Dank,
    Viele Grüße
    che.tux

    • Gerade eben
    • Anzeige

    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

    Zitat von che.tux

    Es wäre super wenn ihr mir da einen Anhaltspunkt geben könntet.


    einfachster TIP ein Thema suchen, welche header hat, die meisten können das, und wo man im normalfall logo sogar einfach uploaden und einbinden kann, ohne das man im Code werken muss. zb die Standardthemen können das sehr einfach

    Wordpress weil es spass macht, besonders beim WordPress Meetup in Linz

    Danke, ja in der Tat das ist ein Anhaltspunkt. Es würde aber schon um dieses Template gehen, da es extrem schlicht ist.
    Die Frage ist also wie kann ich ein Logo in diesem Theme einbauen?

    ich vermute es ist die header.php, wie bei vielen Themes. Dort dann das IMG neben den Content setzen.

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

    Zitat von maxe

    ich vermute es ist die header.php, wie bei vielen Themes. Dort dann das IMG neben den Content setzen.

    Da hat der maxe recht und zwar in der header.php unter das <body>


    Nur kann ich dir den Pfad nur für den oberen Bereich nennen und nicht seitlich.
    Hatte dies nämlich vor zwei Tagen ebenfalls als Problem ;)

    Leider gibt es in diesem Theme keine header.php.

    ich habe bereits mit folgendem Code versucht:


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
    <html><head><title>left</title>
    </head><body>

    <div style="position:absolute; top:180px">
    <img src="..../logo1.png" width="80" height="181">
    </div>

    </body>
    </html>

    Leider hat er weder in der style.css, der base.php, der page.php oder index.php irgendeine Funktion.
    unter diesem Link ist das Theme als Code zu finden: https://github.com/draebb/oh

    so wie ich das sehe, ist die base.php zuständig.
    Da dann vor den <div class="inner"> dein IMG setzen und über css stylen. Oder direkt als background-image für den div.inner stylen.

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

    Also ich habe jetzt die base.php wie folgt geändert.

    /* Always have wp_head() just before the closing </head>
    * tag of your theme, or you will break many plugins, which
    * generally use this hook to add elements to <head> such
    * as styles, scripts, and meta tags.
    */
    wp_head();
    ?>
    </head>

    <body <?php body_class(); ?>>

    <div style="position:absolute; top:180px">
    <img src="logo1.png" width="80" height="181">
    </div>


    <div class="inner">
    <a class="visually-hidden focusable" href="#main"><?php _e( 'Skip to main content', 'oh' ); ?></a>
    </div>

    <header id="header" role="banner">
    <div class="inner">

    <?php $site_title_tag = is_home() || is_front_page() ? 'h1': 'div'; ?>
    <<?php echo $site_title_tag; ?> id="site-title">
    <a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a>
    </<?php echo $site_title_tag; ?>>
    <?php if ( get_bloginfo( 'description' ) ): ?>
    <div id="site-description"><?php bloginfo( 'description' ); ?></div>
    <?php endif; ?>

    <nav role="navigation">
    <h2 class="visually-hidden"><?php _e( 'Main menu', 'oh' ); ?></h2>
    <div id="main-menu"><?php wp_nav_menu( array( 'theme_location' => 'main' ) ); ?></div>
    </nav>

    </div>

    Den fetten Teil habe ich eingefügt. Das Bild ist jetzt im gleichen Ordner wie die base.php.
    Das ändert aber auch wieder nichts. Also kein Logo.

    Link zum Blog?

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

    Also ich habe jetzt das Logo in die Seite bekommen. Leider noch nicht so optimal. Zum Einen wird das Bild nur in der Originalgröße eingebunden. Position und Größe wie sie in der style.css angegeben sind werden aber nicht berücksichtigt. Zum Zweiten ist das Bild positioniert und erst unter dem Logo beginnt der Seitentext. Es sollte aber so sein, dass der Text neben dem Logo beginnt, am besten auf einer Ebene mit dem Text "Home".

    Der Link zum Blog ist http://ideenladen.org

    In der base.php habe ich:

    <div class="logo">
    <img src="(...)/logo_ohne.png">
    </div>

    eingefügt.

    In der style.css:

    div#logo {
    position: absolute;
    left: 80;
    top: 50;
    float: left;
    margin-left: 80px;
    margin-top: 70px;
    }

    Ich dachte zunächst, dass es wie bei LaTeX ist, dass der Link nur gesetzt werden muss, wenn die Datei in einem anderen Ordner liegt. Dem ist aber nicht so.

    1. muss unbedingt das HTML wieder aus deiner style.css

    HTML
    <div style="position:absolute; top:140px">
<img src="http://ideenladen.org/wp-content/uploads/2013/02/logo1.png" width="80" height="181">
</div>

    das gehört da überhaupt nicht rein.

    Und dann musst du aus div#logo ein div.logo machen.
    Mit # steuert man eine ID an, mit dem . eine Class.

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

    zu 1: Also der angegebene Code steht in der base.php und nicht in der style.css wenn ich das rausnehme, wo soll denn dann das Bild herkommen? In der style.css steht doch gar kein Pfad? Irgendwie verstehe ich das Zusammenspiel von css und php nicht so ganz. In meinen Verständnis gebe ich die Quelle des Logos in der base.php mit diesem Code an und sage gleichzeitig, dass es den style aus der div.logo Klasse der style.css holen soll oder verstehe ich das völlig falsch.

    zu2: auch wenn ich in der style.css das div.logo eingebe funktioniert nichts.

    Meine Codes sehen im Moment so aus:

    in der base.php

    PHP
    <div class="logo">
<img src="http://ideenladen.org/wp-content/uploads/2013/02/logo_ohne.png">
</div>



    und die style.css

    Code
    div.logo {
   position: absolute;
   left: 80;
   top: 50;
   float: left;
   width: 300px;
   height: 200px


}

    Einmal editiert, zuletzt von che.tux (1. März 2013 um 10:56)

    1. Also wenn ich in deine style.css (http://ideenladen.org/wp-content/themes/oh/style.css) schaue, sehe ich dort auch den falschen Code. Der gehört da nicht rein.

    2. Mittlerweile scheinst du das float hinbekommen. Um es zu postionieren kannst du z.B. mit margin arbeiten

    Code
    div.logo {
position: static;
float: left;
width: 160px;
height: 240px;
margin-left: 10%;
}

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

    Zu 1: Den Teil hatte ich glatt übersehen, jetzt ist er aber gelöscht.
    Zu 2: Ich habe aber den Eindruck, dass die div.logo gar nicht berücksichtigt wird. Zumindest wird das Logo in keinster Weise von ihr angepasst. Ich kann da eingeben was ich möchte, es ändert nichts.
    Um das Logo plan mit dem Content beginnen zu lassen, habe ich in der style.css noch einmal beim Content float:left; und im footer clear: both; eingefügt.
    Wieder ohne Funktion. Das einzige was sich seit dem Löschen von 1. geändert hat ist, dass der Content weiter rechts beginnt und das Logo im Hintergrund in der Mitte der Seite liegt. Auch float: left; wird nicht berücksichtigt.

    du hast ja auch den gesamten #content nach rechts gefloatet.

    Und dann scheinst du auch hinter jeder eigenen Zeile das ; zu vergessen:

    Code
    height: 200px[B][COLOR="#FF0000"];[/COLOR][/B]
   margin-left: 10%[B][COLOR="#FF0000"];[/COLOR][/B]

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden