--- title: Blog card element url: "https://www.toujou.de/service/elementbibliothek/blog-elements/blog-card/" date: 2019-01-11 modified: 2022-09-27 --- # Blog card element 1. [Home](https://www.toujou.de/) 2. [Service](https://www.toujou.de/service/) 3. [Elementbibliothek](https://www.toujou.de/service/elementbibliothek/) 4. [Blog Elements](https://www.toujou.de/service/elementbibliothek/blog-elements/) 5. [Blog Card](https://www.toujou.de/service/elementbibliothek/blog-elements/blog-card/) Blog Card ========= Wählen Sie einige Ihrer Blogposts aus und zeigen Sie sie als Karte. Item-ID: 07-001 [Beispielansicht](#c1003646) [Anleitung](#c1003644) [Verhalten](#c1003642) ![](https://www.toujou.de/_assets/processed/7rnKmv9OMYwyjtgb7kGY-DgeT36IlznMr6EjV38juPc/q:85/w:433/h:54/fn:Y3NtXzA3XzAwMV9ibG9nX2NhcmRfZDczYTMzMGNiMw:t/cb:72832b597f29bd31cf5443ea60c2f3bc343ef102/bG9jYWw6L2ZpbGVhZG1pbi90b3Vqb3UvZGVtby9JY29ucy9Gb3JtYXRlL0JpYl8yMDAwXzI1MC8wN19CbG9nX0VsZW1lbnRzXzIwMDBfMjUwLzA3XzAwMV9ibG9nX2NhcmQucG5n) --- Beispielansicht (einzeln) --------------------------- - ![](https://www.toujou.de/_assets/processed/XO5sxb15yuenM6tufHHsSpfTywdeNb1jteo8Xe3Q08M/q:85/c:4624:2854.3209876543:fp:0.5:0.5/rt:force/w:336/h:207/fn:Y3NtX01hdGhpYXNfQm9sdF9MZXNuaWFrX3NjcmVhbV9kOGI3MDJhZTU1:t/cb:be9a6433ee81fb2e41a3403fcdf8537d6600e0a4/bG9jYWw6L2ZpbGVhZG1pbi90b3Vqb3Vfbm8vTWF0aGlhc19Cb2x0X0xlc25pYWtfc2NyZWFtLmpwZw) Presse Website Qualität ### Mehr Offenheit für OpenSource Websites 02.02.2023 Mathias Bolt Lesniak spricht über die Möglichkeiten von Websites, die auf OpenSource basieren. [ Weiterlesen ](https://www.toujou.de/blog/mehr-offenheit-fuer-opensource-websites/) --- Beispielansicht (mehrere) --------------------------- - ![](https://www.toujou.de/_assets/processed/XO5sxb15yuenM6tufHHsSpfTywdeNb1jteo8Xe3Q08M/q:85/c:4624:2854.3209876543:fp:0.5:0.5/rt:force/w:336/h:207/fn:Y3NtX01hdGhpYXNfQm9sdF9MZXNuaWFrX3NjcmVhbV9kOGI3MDJhZTU1:t/cb:be9a6433ee81fb2e41a3403fcdf8537d6600e0a4/bG9jYWw6L2ZpbGVhZG1pbi90b3Vqb3Vfbm8vTWF0aGlhc19Cb2x0X0xlc25pYWtfc2NyZWFtLmpwZw) Presse Website Qualität ### Mehr Offenheit für OpenSource Websites 02.02.2023 Mathias Bolt Lesniak spricht über die Möglichkeiten von Websites, die auf OpenSource basieren. [ Weiterlesen ](https://www.toujou.de/blog/mehr-offenheit-fuer-opensource-websites/) - ![Team toujou is participating in the TYPO3 International Meetup Days 2020 to proclaim TYPO3 as best CMS](https://www.toujou.de/_assets/processed/2SORtkWGgr0jn8VEEW0CLbb8dqLuG0tFFJMvkaR9ub0/q:85/c:829.44:512:fp:0.5:0.5/rt:force/w:336/h:207/fn:Y3NtXzIwMjBfMTJfMDJfdG91am91X2dvZXNfdDNpbWRfMTlkYmNhY2VlMQ:t/cb:402fbe198e356ec7c85d1c1e5b27d47b93fdd78d/bG9jYWw6L2ZpbGVhZG1pbi9CaWxkZXIvQmxvZy1Db250ZW50LzIwMjBfMTJfMDJfdG91am91X2dvZXNfdDNpbWQuanBn) Presse TYPO3-Camps ### toujou goes t3imd 04.12.2020 Die zahlreichen TYPO3-Teilnehmer weltweit können sich auf toujou freuen, denn die DFAU GmbH unterstützt die Veranstaltung mit ihrem Website-Builder toujou. [ Weiterlesen ](https://www.toujou.de/blog/toujou-goes-t3imd/) - ![](https://www.toujou.de/_assets/processed/EDVZ2vx7wC7A1H8D_diMlz1A4XZxv_gNwyNc8TqZSL0/q:85/c:1053.5827338129:650.35971223022:fp:0.489:0.59112709832134/rt:force/w:336/h:207/fn:Y3NtX1ZpZW5uZV8xOTIweDgwMF9wb3N0cG9uZWRfYTljNDBkMzNmOA:t/cb:fb7bba27ccf6b3364efec426e2ce2f6851204cf1/bG9jYWw6L2ZpbGVhZG1pbi9CaWxkZXIvQmxvZy1Db250ZW50L1RZUE8zQ2FtcF9WaWVubmEvVmllbm5lXzE5MjB4ODAwX3Bvc3Rwb25lZC5wbmc) Allgemeines Presse TYPO3-Camps ### toujou goes #t3cvie – Update 22.07.2020 toujou ist 2020 erstmals Hauptsponsor eines offiziellen TYPO3-Camps. Das #t3cvie-Team gibt ein Update über Durchführung und Umsetzung des Barcamps. [ Weiterlesen ](https://www.toujou.de/blog/toujou-goes-t3cvie-update/) - ![](https://www.toujou.de/_assets/processed/rNL6st56DX9OUoi-JUvJUS2cw6CwL3cU8NmUtqS8rUo/q:85/c:614:379.01234567901:fp:0.5:0.5/rt:force/w:336/h:207/fn:Y3NtX3QzY3ZpZV8yYjRiZjIxZWNk:t/cb:20bf852106657a86c2b545029529f8649daec1a5/bG9jYWw6L2ZpbGVhZG1pbi9CaWxkZXIvQmxvZy1Db250ZW50L1RZUE8zQ2FtcF9WaWVubmEvdDNjdmllLmpwZw) Allgemeines Presse TYPO3-Camps ### toujou goes #t3cvie 27.02.2020 Erstmals übernimmt die DFAU GmbH unter der Flagge des Website-Services toujou das Main Sponsoring eines TYPO3-Camps. Vom 3. bis 5.9. in Wien. [ Weiterlesen ](https://www.toujou.de/blog/toujou-goes-t3cvie/) - ![Eine Gruppe von Menschen in einem modernen Büro, die an einem Tisch stehen und miteinander diskutieren.](https://www.toujou.de/_assets/processed/rxOV3NaZmGKip6gGl7z9h9ObzZTnw-Sid7g37NrOyYs/q:85/c:626.94:387:fp:0.5:0.5/rt:force/w:336/h:207/fn:Y3NtXzY4OHgzODdfUG9kY2FzdF9PZmZpY2VfaGVsbF9kNTE5OGE2N2Jl:t/cb:fee7c42a7686ff5d355add038c808c90d22c649a/bG9jYWw6L2ZpbGVhZG1pbi9JbWFnZXMvUGl4ZWxncmFmaWsvaXRlbXMvNjg4eDM4N19pdGVtcy82ODh4Mzg3X1BvZGNhc3RfT2ZmaWNlX2hlbGwucG5n) Allgemeines Presse ### Podcast-Sponsoring: toujou präsentiert ab 2020 Ka Depp und Horch Amol 12.01.2020 Professionelle Websites für den Mittelstand. Oder: Champions-League-Technik zum Regionalliga-Etat. [ Weiterlesen ](https://www.toujou.de/blog/podcast-sponsoring-toujou-praesentiert-ab-2020-ka-depp-und-horch-amol/) --- Anleitung ----------- [ ![](https://www.toujou.de/_assets/processed/lf9HyBAFcQ3AXyLRwLH7ok1wKx6wLFmDpUAsSusTNG4/q:85/c:2560:1440:fp:0.5:0.5/rt:force/w:432/h:243/fn:Y3NtXzA3LTAwMS0xLWVsZW1lbnRfYW5sZWdlbl8yMWVmYWRkMGRk:t/cb:af17ddeda8c3c22c01a00265cb38ebfc3f3ddb2c/bG9jYWw6L2ZpbGVhZG1pbi9NYW51YWwvMDdfQmxvZ19FbGVtZW50cy8wNy0wMDFfQmxvZ19DYXJkLzA3LTAwMS0xLWVsZW1lbnRfYW5sZWdlbi5wbmc) ](https://www.toujou.de/fileadmin/Manual/07_Blog_Elements/07-001_Blog_Card/07-001-1-element_anlegen.png) ### Blog-Karte(n) anlegen - Klicken Sie auf den Button **+Inhalt***,* um das Blog-Card-Element zu erstellen. - Im Reiter *Blog Elements* wählen Sie **Blog-Card**. [ ![](https://www.toujou.de/_assets/processed/iH6VV0_K8Iv0GWJgLCgg8safl5X15o2BwpGRuqUD12c/q:85/c:2560:1440:fp:0.5:0.5/rt:force/w:432/h:243/fn:Y3NtXzA3LTAwMS0yLWJsb2dfZWxlbWVudF93YWVobGVuX2E5OTc5YWFmM2Q:t/cb:6486ccfcaacccb3f0479dc4045460a9ee3e5f2b2/bG9jYWw6L2ZpbGVhZG1pbi9NYW51YWwvMDdfQmxvZ19FbGVtZW50cy8wNy0wMDFfQmxvZ19DYXJkLzA3LTAwMS0yLWJsb2dfZWxlbWVudF93YWVobGVuLnBuZw) ](https://www.toujou.de/fileadmin/Manual/07_Blog_Elements/07-001_Blog_Card/07-001-2-blog_element_waehlen.png) ### Blog-Einträge wählen - Im Reiter *Content* wählen Sie im Abschnitt *Blog Element Selection* zwischen der Option **most recent, manual** oder **by category** (nebenstehende Beschreibung beachten). - Die Option **most recent** ist voreingestellt. Hier werden die neuesten angelegten Blog-Beiträge angezeigt. Geben Sie dazu die maximale Anzahl der Blog-Beiträge an, die angezeigt werden sollen. [ ![](https://www.toujou.de/_assets/processed/85tYI-UDbpNBHnjrg8rESJUfk85tx0Wcp7cvp_GWeQc/q:85/c:2560:1440:fp:0.5:0.5/rt:force/w:432/h:243/fn:Y3NtXzA3LTAwMS0zX21hbnVhbF8wNjZjMzJlMmI2:t/cb:d3ddeb41b4f9e3f3b9d4f4dd871aa55ff8e05f30/bG9jYWw6L2ZpbGVhZG1pbi9NYW51YWwvMDdfQmxvZ19FbGVtZW50cy8wNy0wMDFfQmxvZ19DYXJkLzA3LTAwMS0zX21hbnVhbC5wbmc) ](https://www.toujou.de/fileadmin/Manual/07_Blog_Elements/07-001_Blog_Card/07-001-3_manual.png) ### Blog-Beiträge »manual« - Wählen Sie **manual**, können Sie die angelegen Blog-Artikel im Seitenbaum auswählen, die ausgespielt werden sollen. - Klicken Sie am unteren Ende der Maske *Blog Entries* auf den Button **Seite.** - Im nun geöffneten Fenster *Datensatzauswahl* öffnen Sie auf der linken Seite innerhalb Ihres Strukturbaums den Ordner, der Ihre Blog-Artikel enthält. - Klicken Sie auf die **Schriftzeile** des gewünschten Artikels rechts neben dem Artikel-Icon. Wiederholen Sie den Vorgang je nach Anzahl gewünschter Artikel. [ ![](https://www.toujou.de/_assets/processed/8SIWXm37sl0khhBc2VSrguF6UPZDhD0JYcfqgDLrc0w/q:85/c:2560:1440:fp:0.5:0.5/rt:force/w:432/h:243/fn:Y3NtXzA3LTAwMS00X2J5X2NhdGVnb3J5X2YwYWY2OWU2Mjk:t/cb:4c45daaaab6267fcb532758a53d39d756d93827f/bG9jYWw6L2ZpbGVhZG1pbi9NYW51YWwvMDdfQmxvZ19FbGVtZW50cy8wNy0wMDFfQmxvZ19DYXJkLzA3LTAwMS00X2J5X2NhdGVnb3J5LnBuZw) ](https://www.toujou.de/fileadmin/Manual/07_Blog_Elements/07-001_Blog_Card/07-001-4_by_category.png) ### Blog-Einträge »by category« - Klicken Sie in der Maske *Blog Categories* auf die Auswahlfelder der gewünschten Blog-Kategorien bzw. auf **Alle umschalten**, wenn alle neu erscheinenden Artikel unabhängig Ihrer Zuordnung eingefügt werden sollen - Bestimmen Sie im Feld *maximum number of blog cards (default = 4)*, wie viele Artikel innerhalb dieses Elements dargestellt werden sollen --- ### Besonderheit im medatsu-Theme Das medatsu-Theme bietet Ihnen zusätzliche Optionen zur individuellen Website-Gestaltung, die Sie ganz einfach im toujou-Backend vornehmen können. Passen Sie das Design des einzelnen Elements nach Ihren Wünschen an und ändern Sie die Hintergrundfarbe der Blogcard. [ ![](https://www.toujou.de/_assets/processed/i2sxYIACF3gZaOEnr9fg3P0s4DgjzuD1hTPxSIA1npU/q:85/w:432/h:122/fn:Y3NtX2Jsb2djYXJkX2VsZW1lbnRfZGVzaWduX2FmMjQyZmYzNTY:t/cb:d2c276c887d8d18afa2aa054d664cc7079467233/bG9jYWw6L2ZpbGVhZG1pbi90b3Vqb3UvZWxlbWVudF9saWJyYXJ5LzA3X0Jsb2dfZWxlbWVudHMvYmxvZ2NhcmRfZWxlbWVudF9kZXNpZ24ucG5n) ](https://www.toujou.de/fileadmin/toujou/element_library/07_Blog_elements/blogcard_element_design.png) - Mit Klick auf das **Element Design** erhalten Sie im Dropdown-Menü die Wahl für eine individuelle Hintergrundfarbe des Elements. - Im Default erscheint das Element farblos. Weitere Optionen sind primary, secondary sowie inverted. Die Möglichkeiten orientieren sich an den in den[ Theme settings](https://www.toujou.de/service/toujou-setup/farben-festlegen/) definierten Farben. --- Verhalten ----------- **Die *Blog Card* gibt eine oder mehrere Teaserkarten Ihrer Blogartikel mit einem Bild, Datum sowie dem Button »Weiterlesen« wieder. Der dargestellte Inhalt der Blog-Karten wird vom Redakteur bereits bei [Erstellung des Artikels](https://www.toujou.de/tutorials/blog-administration/) vorbestimmt.** Je nach Theme-Auswahl können die Blog-Karten die volle Inhaltsbreite oder Textlaufweite annehmen. Auch die Anordnung nebeneinander oder untereinander ist themeabhängig. **Responsive:** Eine einzelne Blog-Karte nimmt die Textlaufweite der Seite ein, zwei Karten nebeneinander die maximale Inhaltsbreite. Ist nicht ausreichend Platz zur Darstellung nebeneinander vorhanden, zeigen alle Blog-Karten bei kleiner werden Endgeräten das zuvor nebenstehende Bild über dem Teasertext an. Auf kleinen Darstellungsflächen werden alle Blog-Karten untereinander angezeigt. **Besonderheiten:** Im Falle von *Blog Element selection by category*, stellt das Element stets den jüngsten Artikel an die erste Stelle und entfernt die Darstellung des ältesten Elements aus der Ansicht. --- Verknüpfte Themen ----------------- Erläuterungen aus dem [toujou](https://www.toujou.de/service/toujou-setup/)- & [TYPO3-Setup](https://www.toujou.de/tutorials/), die mit dieser Elementanleitung in Verbindung stehen. [Blog-Administration](https://www.toujou.de/tutorials/blog-administration/)