Twenty-Fourteen

Von Zeit zu Zeit gibt es ein Update eines Themes. Da ich mich sehr an das Theme TwentyFourteen gewöhnt habe, und mit den Plugins Fourteen Colors auch die Farben eingestellt habe, ist es schade, wenn ein Theme update gewissen geänderte Funktionen im Blog überschreibt. Der Versuch, deswegen ein Child Theme anzulegen, und die Änderungen dort zu verwalten, schlug fehl, da die Einstellungen von Fourteen Colors nicht ins Child Theme übernommen wurden. Vgl: Child-Theme anlegen Als Lösung bleibt mir momentan, das Theme nicht zu häufig zu aktualisieren und nach jeder Aktualisierung die folgenden Änderungen händisch ins Theme einzuspielen: Breite des Editors ändern  

Der Versuch einer Anleitung: Ordner erstellen im Theme Ordner:   /httpdocs/wordpress/wp-content/themes Beispiel:  /httpdocs/wordpress/wp-content/themes/twentyfourteen  existiert: Dazu Child Theme Ordner anlegen: /httpdocs/wordpress/wp-content/themes/Twentyfourteen-Child-MiHei Im Child-Theme-Ordner wird nun eine neue Style.CSS Datei hochgeladen. Diese enthält /* Theme Name:     Twenty-Fourteen Mihei Theme URI:      http: //deinedomain.de/ Description:    Michaels Child Theme for the twenty fourteen Author URI:     http: //wie-geht-was.ch/ Template:       twentyfourteen Version:        1.0 */ @import url(‚../twentyfourteen/style.css‘); Wichtig ist der Name des Haupt-Themes unter Template einzutragen. Ergebnis: Das importieren brachte nicht die korrekten Ergebnisse. Das Child Theme wurde zwar korrekt dargestellt, aber die Farben waren nicht so wie vorher. Weil vermutlich die Plugins von Fourteen colors etc. nicht beachtet werden. Dort findet man im Readme.txt: You can use Fourteen Colors with both Twenty Fourteen and child themes. Be aware that the Fourteen Colors settings are stored with the active theme, so if you switch to a child theme or switch child themes, you’ll need to re-set your colors. Child theme compatibility depends on the extent of changes made by the child theme. But child theme developers can hook into Fourteen Colors to extend it to adapt to their changes, allowing the plugin to work seamlessly even if the child theme is significantly different than the parent theme. Fazit: Vermutlich… Weiterlesen »WordPress: Child Theme anlegen

Der Tip von ElmaStudio 7. editor-style.css ins Theme integrieren Bei der Erstellung eines WordPress-Themes kannst du (seit WordPress 3.0) über eine editor-style.css Datei den sichtbaren Text im visuellen Editor an die Styles des Themes anpassen. Dazu musst du zuerst folgende Funktion in die functions.php Datei einfügen: // This theme styles the visual editor with editor-style.css to match the theme style. add_editor_style(); brachte mich auf die Lösung: Möchte ich das Erscheinen des Editors in WordPress Theme Twentyfourteen ändern, so kann ich die editor-style.css editieren. /* Theme Name: Twenty Fourteen Description: Used to style the TinyMCE editor. */ /** * 1.0 Body * —————————————————————————- */ html .mceContentBody { font-size: 100%; max-width: 888 px; } z.B. habe ich hier die 888 px eingefügt. Damit der Editor im Visuellen Modus mehr Platz verwenden kann. Tipp: Bei mir klappte dies nicht über den WordPress Editor, aber über das FTP Programm konnte ich auf das File zugreifen und editieren. Anschliessend wollte allerdings in Firefox noch der Cache gelöscht werden. !! Die Datei editor-style.css liegt im Verzeichnis /wp-content/themes/twentyfourteen/css  

Will man den Autor des Artikels in den Metadaten eines Blog Artikels anzeigen lassen, so muss man folgenden Eintrag in der Style.CSS modifizieren } /* nimmt man diesen Kommentar raus, so erscheint der Autor in den Metadaten über dem Artikel. .byline { display: none; } */

um die Breite der Sidebar im Twenty-Fourteen zu ändern, muss die Style.CSS angepasst werden mit der Zeile: #secondary { width: 250px; } Die Breite war vorher 168px

Farbliche Anpassungen am Blogtitel erhält man im Twenty-Fourteen, in dem man in der Style.CSS  den Bereich 6.2 Entry Header wie folgt anpasst:

Verbreitert man in Twenty-Fourteen die Seitenbreite über die Theme-Optionen und Plugins, so passiert es insbesondere bei grossen Bildschrimen, dass die eingefügten Bilder über die Seitenbreite heraus ragen. Dies kann man in der Style.CSS beheben in dem man .full-width .site-content blockquote.alignleft, .full-width .site-content img.size-full.alignleft, .full-width .site-content img.size-large.alignleft, .full-width .site-content img.size-medium.alignleft, .full-width .site-content .wp-caption.alignleft { margin-left: -168px; in -2 px } .full-width .site-content .alignleft { clear: left; } .full-width .site-content blockquote.alignright, .full-width .site-content img.size-full.alignright, .full-width .site-content img.size-large.alignright, .full-width .site-content img.size-medium.alignright, .full-width .site-content .wp-caption.alignright { margin-right: -168px;  in – 2 px } die Margin-right von -168px auf -2 px setzt.

Notwendige Anpassungen im Theme Twenty-Fourteen für einen neuen Blog von Michael

Um im Theme TwentyFourteen das Header Image über die gesamte Blogbreite zu skalieren, muss in der Style CSS der Code von #site-header { position: relative; z-index: 3; } .site-header { background-color: #000; max-width: 1900px; position: relative; width: 100%; z-index: 4; } ergänzt werden mit #site-header a img { display: block; width: 100%!important; height: auto!important; } Dieser Code findet sich unter * 4.0 Header * Nicht vergessen auch die max-width auf 1900 px anzupassen! Tip von : h t t p://forum.wpde.org/plugins-und-widgets/132226-header-bild-twenty-fourteen-design-zentrieren.html