Twenty Ten: Schwarze Balken um eigenes Header-Logo

Zitat von pesunites

Hallo zusammen, ...
Blöderweise habe ich - egal welche Bilddatei ich benutze - jetzt zwei schwarze Balken über und unter dem Logo - siehe Screenshot.

Das wundert mich nicht, denn im Stylesheet ist es ja auch genau so angegeben:

/* This is the custom header image */ 
#branding img { 
    clear: both; 
    border-top: 4px solid #000; 
    display: block; 
    border-bottom: 1px solid #000; 
}

Du kannst ja mal diese Zeilen in der style.css auskommentieren.

Bego

Zitat von pesunites

Nur verschwindet dann blöderweise auch der Rand des großen 940x198-Header-Bildes. Sieht dann unschön aus...

//edit: Hab einfach branding1 und branding2 draus gemacht und somit die Bilder einzeln angesprochen. Klappt. Danke!

Ja, oder dem selbst eingefügten Bild eine eigene Klasse zuweisen und diese im Stylesheet mit [FONT=Courier New]border: none;[/FONT] festlegen … Ist vielleicht vom Code etwas schlanker, aber bekanntlich führen viele Wege nach Wuppertal.

Bego

Hallo zusammen,

ich bin gerade in meinen absoluten Wordpress-Anfängen. So krame ich auch diesen *pust* leicht angestaubten Thread einmal hervor, da ich auch auf die schwarzen Balken gestoßen bin.

Die schwarzen Balken, wie oben im Code gezeigt, habe ich in einem Child-Theme wie folgt entfernt:

#branding img {	border-top: none;
	border-bottom: none;
	display: block;
	float: left;
}

Nun ist aber das ganze Bild, das eigentlich im Parent-Theme eine Größe von 940 x 198 Pixeln haben sollte, viel zu groß. Ich hab einmal bei Chrome auf "untersuchen" geklickt und bekomme da folgenden verantwortlichen Code-Schnipsel

<img src="http://[...].uberspace.de/wordpress/wp-content/uploads/2018/01/cropped-Hasefuchs_header.png" width="1200" height="280" alt="">

Im Parent-Theme wurde das Bild also korrekt zugeschnitten, in meinem Child, nachdem ich die "Borders" geändert habe, ist es komplett zerhauen.

Kann mir das einer für nen "Newbie" erklären?

Danke und Gruß

Du hast nicht nur die Ränder via [FONT=courier new]border-bottom[/FONT] bzw. [FONT=courier new]border-top[/FONT] geändert, sondern noch mehr. Lass die anderen Änderungen weg.

Eigentlich war das noch ein Rest vom Original, also nicht einmal eine Änderung. Mein Edit ist nun so:

#branding img {	border-top: none;
	border-bottom: none;
}

Das Ergebnis bleibt mit dem Bild das gleiche. Dazu fällt mir gerade auf, dass auch der Rahmen, der eigentlich ganz außen um die Seite war, auch weg ist...

Dann hast Du offenbar noch was anderes geändert. Erstelle am besten ein neues Thema und poste einen Link zu Deiner Seite, siehe auch Forumregeln.

Im Ordner des Child-Themes habe ich nur einen Screenshot und eine Style.Css mit folgendem Inhalt:

/*Theme Name: HaseFuchs
Theme URI: https://wordpress.org/themes/twentyten/
Template: twentyten
Author: the WordPress team
Author URI: https://wordpress.org/
Description: None
Tags: blog,two-columns,custom-header,custom-background,threaded-comments,sticky-post,translation-ready,microformats,rtl-language-support,editor-style,custom-menu,flexible-header,featured-images,footer-widgets,featured-image-header
Version: 0.0.1
Updated: 2018-02-01 11:03




*/




@import url(../twentyten/style.css);




/* Add your css styles after this comment */




/* This is the custom header image */
#branding img {
	border-top: none;
	border-bottom: none;
}

Die Seite findest du hier: http://venture1.alphard.uberspace.de/wordpress/

Es soll ein Reiseblog werden, bisher habe ich nur ein bisschen "geübt".

Sehe ich das richtig, dass ich einen Beitrag nicht bearbeiten kann? Wollte nun hiermit nicht unnötig pushen, habe aber noch folgendes gefunden:

In der header.php ist folgender Schnipsel zur Größe zu finden

if ( function_exists( 'get_custom_header' ) ) {							$header_image_width  = get_custom_header()->width;
							$header_image_height = get_custom_header()->height;
						} else {
							$header_image_width  = HEADER_IMAGE_WIDTH;
							$header_image_height = HEADER_IMAGE_HEIGHT;
						}

In der functions.php scheint (nach meinem nicht vorhandenen Verständnis von PHP) ein custom_header definiert zu sein:

// The custom header business starts here.


	$custom_header_support = array(
		/*
		 * The default image to use.
		 * The %s is a placeholder for the theme template directory URI.
		 */
		'default-image' => '%s/images/headers/path.jpg',
		// The height and width of our custom header.
		/**
		 * Filter the Twenty Ten default header image width.
		 *
		 * @since Twenty Ten 1.0
		 *
		 * @param int The default header image width in pixels. Default 940.
		 */
		'width' => apply_filters( 'twentyten_header_image_width', 940 ),
		/**
		 * Filter the Twenty Ten defaul header image height.
		 *
		 * @since Twenty Ten 1.0
		 *
		 * @param int The default header image height in pixels. Default 198.
		 */
		'height' => apply_filters( 'twentyten_header_image_height', 198 ),
		// Support flexible heights.
		'flex-height' => true,
		// Don't support text inside the header image.
		'header-text' => false,
		// Callback for styling the header preview in the admin.
		'admin-head-callback' => 'twentyten_admin_header_style',
	);

Hier sind auch die eigentlich gewünschten 940x148 Pixel definiert, er scheint aber aus der header.php die else-Funktion zu aktivieren und die Originalgröße zu nehmen.

Deaktiviere mal die CSS des Childs (per FTP einfach umbenennen), füge den Code über den Customizer ein und schau, wie es dann aussieht.
Wenn das auch nichts bringt: Lade das Bild mal unter einem anderen Namen hoch und ersetze damit das vorhandene Bild.

Ich hab's mit Deinem Bild und Code im Customizer gerade getestet: funktioniert.

Gruß
Sophie

Edit: Das Theme ist übrigens nicht responsive. Du solltest Dir ein anderes zum Üben aussuchen.

Zitat von Slowmo

Deaktiviere mal die CSS des Childs (per FTP einfach umbenennen), füge den Code über den Customizer ein und schau, wie es dann aussieht.
Wenn das auch nichts bringt: Lade das Bild mal unter einem anderen Namen hoch und ersetze damit das vorhandene Bild.

Ich hab's mit Deinem Bild und Code im Customizer gerade getestet: funktioniert.

Gruß
Sophie

Edit: Das Theme ist übrigens nicht responsive. Du solltest Dir ein anderes zum Üben aussuchen.

Okay, das wäre ein Workaround...

Dass das Theme nicht responsiv ist, wusste ich, dachte aber es über ein Plugin nachrüsten zu können. Ich suche halt ein "einfaches" Theme mit dem ich lernen kann...

Bei Twenty Sixteen habe ich es nicht einmal geschafft eine Schriftart zu ändern :confused:

Edit: Oder bin ich da grundsätzlich sowas von auf dme Holzweg mit bestehenden Themes, dass ich mich eher eines Frameworks (Bootstrap?) bedienen sollte?

Beim derzeitigem Aufbau könntest du 2 weitere Zeilen in die Child style.css einfügen.
Das sieht dann so aus:

#branding img {
    border-top: none;
    border-bottom: none;
    display: block;
    float: left;
    width: 940px;
    height: auto;
}

Das Headerbild hat ja 1200x280px ;-)