Skeleton Child Theme Hinzufügen von Icon Bar zu Header Flex Grid

Skeleton Child Theme Version 1.6

WordPress Version 3.4.2

Child Theme installiert auf Multisite: public_html, wp-content, themes.

Mein CSS, PHP Coding Fähigkeiten = NOVICE

Was ich getan habe: Verwenden der Menüoptionen “Thema”, “Extra-Kopftext” Ich habe vier Textlinks und eine 10-Symbol-Symbolleiste (24 x 24 Pixel) in der oberen rechten Ecke des 960-Pixel-Headers hinzugefügt. Ich benutzte p auf der Linie mit den vier Textlinks. Diese Links befinden sich oberhalb der Symbolleiste. Ich habe img src mit float left (5px) margin right padding verwendet, um die Icons in einer Zeile zu platzieren. Ich habe style.scc oder header.php oder functions.php nicht hinzugefügt oder geändert.

<a href="http://.......

Ich habe nur die img src Zeilen für alle 10 Symbole ausgeschnitten und eingefügt. Die Symbole sind noch mit nichts verknüpft. Ich weiß, dass es eine elegante CSS-Art geben muss, die Inline-Liste von Icons zu gestalten, aber ich weiß nicht, wie ich das machen soll. Ich habe keine Ahnung, wie ich functionen aufrufen, Hooks oder Filter öffnen oder schließen soll – also wenn die Lösung diese oder ähnliche Programmierfähigkeiten beinhaltet, sei vorsichtig mit mir und erkläre in welcher Datei und in welchem ​​Teil der Datei der neue Code gehen könnte . Die Skeleton-Child-Theme-Datei functions.php enthält viele Kommentare, die erklären, wie und wann functionen aufgerufen werden, aber ich bin nicht sicher, was aktiviert ist und was nicht, oder wie man herausfinden kann, welche Templates verwendet werden, wenn sie verwendet werden wenn sie benutzt werden, wo sie sich befinden oder wie man sie verändert. Ja, ich weiß, ein Kurs auf Hochschulniveau in PHP wäre hilfreich! 😛

Problem: Beim Ändern der Größe oder Anzeige auf einem iPhone überschneiden sich die vier Textlinks direkt über dem Logo (das sieht gut aus) – aber die Symbolleiste wird nach links verschoben, um das Logobild zu überdecken. Die Icon-Bilder sind über dem Logo-Bild – das ist nicht in Ordnung.

Was ich gerne machen würde: Bei einer normalen Größe von 960px möchte ich, dass die vier Textlinks und die Symbolleiste rechts oben oder zentriert mit dem Logo-Bild ausgerichtet sind. Wenn ich die Größe des Rasters verändere, möchte ich, dass die vier Textlinks über das Logo und die Symbolleiste unter das Logobild rutschen. (Oder sie können beide unter das Logobild gleiten, solange die Textlinks über der Symbolleiste liegen).

Was ich NICHT tun möchte: Fügen Sie die vier Textlinks über der Kopfzeile in 960px hinzu, nein (vielleicht … rechtsbündig). Fügen Sie die Symbolleiste unter der Überschrift in 960px, nein hinzu.

Was ich denke, könnte funktionieren: Irgendwo in der function st_header_open () muss es eine Möglichkeit geben, das Header-Grid in zwei Teile zu zerlegen (anstelle eines großen 960px-Platzes), so dass das Logo-Bild auf der linken Seite und die vier Text-Links und das Icon sind Bar ist auf der rechten Seite; Wenn die Seite die rechte Hälfte der Kopfzeile neu formatiert, wird sie unter die linke Hälfte verschoben. Oder vielleicht drei Teile, einen links mit dem Logo und zwei rechts; der obere enthält die vier Textlinks und der untere die Symbolleiste. Idealerweise würde ich gerne wissen, wie man die Kopfzeile wie gewünscht abschneidet und steuern kann, wie jede Sektion in der iPhone-Ansicht stapelt. Ein Link zu einem allgemeinen Tutorial wäre toll. Ich habe noch keinen gefunden, den ein Neuling auf meiner Ebene verstehen kann.

Frage: Ist das oben genannte über das Bearbeitungsfenster “Designoptionen”, “Extra-Header-Text” möglich oder muss ich die PHP-Datei (en) des untergeordneten Designs ändern? Eine Erklärung und Schritt für Schritt (vor allem, wo der neue Code in welcher Datei und in welchem ​​Teil der Datei gehen würde) für einen NOVICE WP Tüftler würde am meisten geschätzt werden.

Jeder Hinweis darauf, wie die Hintergrundfarbe der obigen Kopfzeilenräume geändert wird, würde ebenfalls am meisten geschätzt werden.

Vielen Dank

Solutions Collecting From Web of "Skeleton Child Theme Hinzufügen von Icon Bar zu Header Flex Grid"