Unsere Datenschutzrichtlinie wird in Kürze aktualisiert. Bitte sehen Sie sich die Vorschau an.

WordPress für Designer: Themes und Layout-Werkzeuge

Counter und Skill Bar

Testen Sie unsere 2019 Kurse

10 Tage kostenlos!

Jetzt testen Alle Abonnements anzeigen
Sehr beliebt sind auch animierte Counter und Balken. Wie einfach sich diese in Cornerstone einbinden lassen, lernen Sie hier.

Transkript

Vielleicht möchte man ja in seine Webseite einen Counter integrieren. Auch dafür bietet uns die Elementepalette entsprechende Widgets. Und das, was wir jetzt suchen, ist der Counter. So, hier ist der Counter. Einfach per Drag-and-drop an die Stelle, wo der Counter erscheinen soll. Da ist er. Wir sehen auch schon die Animation. Wir haben hier jetzt die ganzen Eigenschaften dafür: mit welcher Zahl der Counter starten soll, mit welcher Zahl der Counter enden soll. Ich mache das einfach einmal so. Wir sehen direkt die Animation. Hier die Counter-Speed, also wie lange soll der Counter brauchen, um hier hochzuzählen? Hier kann man noch ein Präfix oder Suffix festlegen, also zum Beispiel "1-", so. Oder wir könnten hier noch als Suffix dahinterschreiben "Euro", als Beispiel. Hier können wir die Farbe festlegen, hier das, was darüber steht, und hier den Text, der darunter steht, und auch dafür natürlich die Farbe. Also, wie man sieht, hat man hier sehr schnell und einfach einen solchen Counter integriert. Schauen wir uns noch ein weiteres Beispiel an. Dazu lösche ich den Counter wieder, einfach hier oben auf "Delete". Und zwar möchte ich als nächstes hier an der Stelle eine Skill-Bar integrieren. Skill-Bars sind diese Leisten, die anzeigen, wie gut man in irgendetwas ist. Hier haben wir jetzt eine Skill-Bar, die steht auf 90 %. Wir haben hier den Titel, zum Beispiel "Klettern". So, dann haben wir hier die Prozente. Dann sage ich jetzt einfach mal: Im Klettern bin ich gut, 76 %. Hier haben wir noch einmal "Bar Text". Wenn man dies leer lässt, dann stehen die 76 % darin. Wir können aber auch hier jetzt etwas hineinschreiben. Dann sieht das Ganze so aus. Ja, hier die Bar-Farbe natürlich noch. Hier nehme ich jetzt einmal so einen Grauton. Okay, und ja, wenn man noch mehr von solchen Bars braucht, dann muss man die natürlich duplizieren. Das heißt, wir klicken hier auf "Duplicate", wählen diese dann aus, und sagen statt "Klettern" "Tauchen" zum Beispiel. "Tauchen", machen wir einfach einmal 92. Und auch hier können wir die Farbe anpassen und so weiter und so fort. Dann machen wir noch eine dritte Bar, "Radfahren". Und jetzt war ich in der falschen, deswegen haben wir diese hier editiert, aber egal. Und hier sagen wir jetzt einfach 54. So, und so kann man ganz einfach eine solche Bar integrieren. Also, wie man sieht, selbst Elemente, die mit Zahlen und Werten agieren, wie der Counter, wie diese Skill-Bar, lassen sich problemlos über Cornerstone in die Seite integrieren.

WordPress für Designer: Themes und Layout-Werkzeuge

Erstellen Sie Ihre Wordpress-Website mit X-Themes und Cornerstone – ganz ohne Quellcode

5 Std. 8 min (56 Videos)
Derzeit sind keine Feedbacks vorhanden...
 

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!