WordPress. - ein kleines Tutorial von C. Oberweis, inf-schule.de -

Transkript

1 WordPress - ein kleines Tutorial von C. Oberweis, inf-schule.de - Begriffe: Beiträge (posts, Blog-Inhalte): regelmäßige Artikel, chronologisch geordnet, Kategorien, Autoren usw. zugeordnet Seiten (pages, statisch, z. B. Über mich ), nicht chronologisch geordnet, keine Kategorien Die Arbeitsschritte beim Editieren, beim Einfügen von Bildern usw. sind bei Beiträgen (Artikel) und Seiten die gleichen. Die hier nun einführenden Schritte gelten also für Beiträge und Seiten gleichermaßen. Sinnvoll ist das Arbeiten in zwei Tabs (Backend und Frontend): Im Dashboard: Die linke Seite vergrößert: Unter profil bearbeiten können persönliche Angaben verändert werden, z. B. auch das Passwort (bitte überprüfen). 1

2 1. Den Text des ersten Beitrags ( Hallo Welt ) verändern Im Dashboard auf Beiträge klicken, mit Mauszeiger auf Hallo Welt gehen, bearbeiten auswählen: -> Aktualisieren, dann ins Frontend gehen und dort den Browser aktualisieren. 2

3 Es hat funktioniert: 2. Ein Bild einfügen Cursor an die Stelle setzten, an die das Bild hin soll, dann Bild hochladen (Dateien hinzufügen) 3

4 Datei auswählen Auf Öffnen klicken 4

5 In Mediathek bild anklicken, es öffnet sich der rechte Seitenbereich, hier z. B. Beschriftung anbringen Hier kann das Bild noch bearbeitet werden (Skalierung usw.), dann in den Beitrag einfügen 5

6 So sieht es im Backend aus und hier nach Aktualisieren das Frontend: 6

7 Achtung, ein Beitragsbild ist etwas ganz anderes! Beitragsbild festlegen: Auswählen und übernehmen: 7

8 Ein Beitragsbild steht oben, etwa stellvertretend für eine Überschrift. 3. Kommentar einfügen Administrator abmelden, nur als normaler Websurfer die Seite aufrufen und auf Kommentar klicken. 8

9 Hier können wir jetzt etwas hineinschreiben (und dann Abschicken ). Aber wie wir sehen, wartet der Kommentar auf Freischaltung. 9

10 Wenn Sie den Browser schließen und wieder öffnen, ist der Kommentar verschwunden, da er noch nicht freigeschaltet ist: Freischaltung: Als Administrator wieder anmelden und hier freischalten. 10

11 Jetzt wird der neue Kommentar angezeigt. 11

12 2. Eine Seite bearbeiten/einfügen Nun werden diese Arbeitsschritte auch für Seiten durchgeführt, hier das Ergebnis: Nachträgliche Bildbearbeitung: Bild anklicken, dann hier klicken. 12

13 Dann erschein diese Seite und es können Änderungen/Ergänzungen durchgeführt werden: Die neue Seite erscheint automatisch als Menüpunkt Die bisher dargestellten Schritte sollten Sie an weiteren Beispielen üben. 13

14 Beiträgen und Kategorien, Einführung Aufgaben (Theorie): 1. Was sind Kategorien in WordPress. Was bedeutet es, dass Beiträge klassifiziert werden? 2. Was ist ein Redaktionssystem? 3. Unterscheiden Sie: Normales CSS vers. System für Blogs Fontend: Bitte testen Sie die mit Pfeilen versehenen Menüpunkte und erklären Sie, was jeweils angezeigt wird. Für Experten, an anderer Stelle dazu mehr! 14

15 Jetzt werden im Backend eine neue Kategorie und vier neue Beiträge erstellt 15

16 So sollte es dann aussehen! 16

17 Alles wird angezeigt, spezielle Auswahl: s. links, jetzt können echte Blogbeiträge erfasst werden 17

18 Seiten, Themes, Widgets Menüpunkte und Untermenüs Aufgaben (Theorie): 1. Beschreiben Sie kurz den Unterschied zwischen Templates und Themes. (Internet-Recherche). 2. Was sind Widgets bei WordPress)? Backend: 18

19 Frontend: Menüpunkt im Horizontalmenü wird automatisch angelegt. Neues Theme auswählen 19

20 Frontend, die Beiträge Neues Design 20

21 Und hier die Beispiel-Seite: Kalender als Widget 21

22 Im Frontend: 22

23 Untermenü einer Seite Neue Seite erstellen Im Frontend: Eltern - Seite angeben Bewegt man die Maus auf den Menüpunkt, wird das Untermenü angezeigt. Beachte: Die Horizontal-Menüleiset steht bei diesem Theme (im Gegensatz zu oben) unter dem Header-Bild. Folgende Schritte sind hierzu notwendig: 23

24 Im Verzeichnis gibt es eine Datei mit dem Namen header.php. Dort gibt es folgende Code-Zeilen: <nav id="site-navigation" class="main-navigation" role="navigation"> <h3 class="menu-toggle"><?php _e( 'Menu', 'twentytwelve' );?></h3> <a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentytwelve' );?>"><?php _e( 'Skip to content', 'twentytwelve' );?></a> <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) );?> </nav><!-- #site-navigation --> Diese müssen ausgeschnitten und unter folgende Codezeilen gesetzt werden: <?php $header_image = get_header_image(); if (! empty( $header_image ) ) :?> <a href="<?php echo esc_url( home_url( '/' ) );?>"><img src="<?php echo esc_url( $header_image );?>" class="header-image" width="<?php echo get_custom_header()->width;?>" height="<?php echo get_custom_header()->height;?>" alt="" /></a> <?php endif;?> Dann alles aktualisieren und fertig! Quelle dieses Tipps: Gefunden am

25 Kommentarfunktion und Header-Bild Kommentarfunktion für einzelne Seiten/Beiträge deaktivieren: Hier Häkchen setzen, dann unten 25

26 Häkchen wegmachen. 26

27 Kommentarfunktion global deaktivieren (geht nicht, wenn Seite/Beitrag schon vorher erstellt wurde): Kommentarfunktion Template (Quellcode) deaktivieren (Template TwentyTwelve): Design Editor, Datei single.php Folgende Zeile entfernen: <?php comments_template( '', true );?> Quelle: Gefunden am

28 Header Bild einfügen: 28