natenom-website-dump-2024-0.../natenom.de/2022/10/niemals-nie-copy-and-paste-von-shell-kommandos-aus-einem-browser-in-eine-shellshortcode-fuer-hugo-mit-warnhinweis-und-beispiel/index.html
2024-02-01 17:43:06 +01:00

160 lines
No EOL
49 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html><html class=position-relative itemscope itemtype=https://schema.org/WebPage lang=de data-bs-theme=auto data-palette=blue><head><script src=/assets/init/bundle.min.a63b05c8004831f165aca508cfe52bdc3b3c568ce762c0e22f82b1fe1ed14173.js integrity="sha256-pjsFyABIMfFlrKUIz+Ur3Ds8VoznYsDiL4Kx/h7RQXM=" crossorigin=anonymous></script><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><title>Niemals nie Copy & Paste von Shell Kommandos aus einem Browser in eine Shell hinein Shortcode für Hugo mit Warnhinweis und Beispiel - Natenoms Blog</title>
<link rel=icon href=/favicon_hudc94279ded70d7b83fccc56e43bdd2fa_24074_16x16_resize_catmullrom_3.png sizes=16x16 type=image/png><link rel=icon href=/favicon_hudc94279ded70d7b83fccc56e43bdd2fa_24074_32x32_resize_catmullrom_3.png sizes=32x32 type=image/png><link rel=icon href=/favicon_hudc94279ded70d7b83fccc56e43bdd2fa_24074_150x150_resize_catmullrom_3.png sizes=150x150 type=image/png><link rel=apple-touch-icon href=/favicon_hudc94279ded70d7b83fccc56e43bdd2fa_24074_180x180_resize_catmullrom_3.png sizes=180x180 type=image/png><link rel=icon href=/favicon_hudc94279ded70d7b83fccc56e43bdd2fa_24074_192x192_resize_catmullrom_3.png sizes=192x192 type=image/png><link rel=mask-icon href=/safari-pinned-tab.svg color=#6f42c1><meta name=keywords content="Verkehrswende,Fahrrad,CriticalMass,OpenBikeSensor,SimRa,Mumble,Open Source,Minimalismus,OpenStreetMap,Müllsammeln,Fotografie,Malen,Zeichnen"><meta name=description content="Im Internet gibt es viele schöne Anleitungen für verschiedenste Themen. Und viele davon liefern auch gleich die Shell Kommandos mit, die man nur noch markieren, kopieren, direkt in die Shell einfügen und mit Enter bestätigen muss, um sie auszuführen. NEIN, tut das niemals NIE!
Ich habe auch viele solcher Anleitungen geschrieben, die vielfach genutzt wurden. Und teilweise habe ich dann auch auf das Problem hingewiesen."><meta name=twitter:card content="summary_large_image"><meta name=twitter:image content="https://natenom.de/images/logo-natenom-800x800.png"><meta name=twitter:title content="Niemals nie Copy & Paste von Shell Kommandos aus einem Browser in eine Shell hinein Shortcode für Hugo mit Warnhinweis und Beispiel"><meta name=twitter:description content="Im Internet gibt es viele schöne Anleitungen für verschiedenste Themen. Und viele davon liefern auch gleich die Shell Kommandos mit, die man nur noch markieren, kopieren, direkt in die Shell einfügen und mit Enter bestätigen muss, um sie auszuführen. NEIN, tut das niemals NIE!
Ich habe auch viele solcher Anleitungen geschrieben, die vielfach genutzt wurden. Und teilweise habe ich dann auch auf das Problem hingewiesen."><meta property="og:title" content="Niemals nie Copy & Paste von Shell Kommandos aus einem Browser in eine Shell hinein Shortcode für Hugo mit Warnhinweis und Beispiel"><meta property="og:description" content="Im Internet gibt es viele schöne Anleitungen für verschiedenste Themen. Und viele davon liefern auch gleich die Shell Kommandos mit, die man nur noch markieren, kopieren, direkt in die Shell einfügen und mit Enter bestätigen muss, um sie auszuführen. NEIN, tut das niemals NIE!
Ich habe auch viele solcher Anleitungen geschrieben, die vielfach genutzt wurden. Und teilweise habe ich dann auch auf das Problem hingewiesen."><meta property="og:type" content="article"><meta property="og:url" content="https://natenom.de/2022/10/niemals-nie-copy-and-paste-von-shell-kommandos-aus-einem-browser-in-eine-shellshortcode-fuer-hugo-mit-warnhinweis-und-beispiel/"><meta property="og:image" content="https://natenom.de/images/logo-natenom-800x800.png"><meta property="article:section" content="posts"><meta property="article:published_time" content="2022-10-02T11:34:51+02:00"><meta property="article:modified_time" content="2022-10-02T11:34:51+02:00"><meta itemprop=name content="Niemals nie Copy & Paste von Shell Kommandos aus einem Browser in eine Shell hinein Shortcode für Hugo mit Warnhinweis und Beispiel"><meta itemprop=description content="Im Internet gibt es viele schöne Anleitungen für verschiedenste Themen. Und viele davon liefern auch gleich die Shell Kommandos mit, die man nur noch markieren, kopieren, direkt in die Shell einfügen und mit Enter bestätigen muss, um sie auszuführen. NEIN, tut das niemals NIE!
Ich habe auch viele solcher Anleitungen geschrieben, die vielfach genutzt wurden. Und teilweise habe ich dann auch auf das Problem hingewiesen."><meta itemprop=datePublished content="2022-10-02T11:34:51+02:00"><meta itemprop=dateModified content="2022-10-02T11:34:51+02:00"><meta itemprop=wordCount content="839"><meta itemprop=image content="https://natenom.de/images/logo-natenom-800x800.png"><meta itemprop=keywords content="CSS,Howtos,Linux,SCSS,HTML,Hugo,Shell,Sicherheit,"><meta property="og:image:alt" content="Niemals nie Copy & Paste von Shell Kommandos aus einem Browser in eine Shell hinein Shortcode für Hugo mit Warnhinweis und Beispiel"><meta name=twitter:image:alt content="Niemals nie Copy & Paste von Shell Kommandos aus einem Browser in eine Shell hinein Shortcode für Hugo mit Warnhinweis und Beispiel"><link data-precache rel=stylesheet href="/assets/main/bundle.min.b189232e48c49a02f23e6616502e93a36137102626fd47589f55ab6447b15b4d.css" integrity="sha256-sYkjLkjEmgLyPmYWUC6To2E3ECYm/UdYn1WrZEexW00=" crossorigin=anonymous></head><body><header class="mb-4 sticky-top"><nav class="top-app-bar shadow navbar navbar-expand-xxl"><div class=container><a class="navbar-brand d-flex align-items-center flex-grow-1 flex-xxl-grow-0 justify-content-xxl-start ms-2 ms-xxl-0 mx-auto me-xxl-2" href=https://natenom.de/><picture><img class=logo alt=Logo src=https://natenom.de/images/logo.svg loading=lazy>
</picture>Natenoms Blog</a><div class="offcanvas-xxl offcanvas-end flex-grow-1" data-bs-scroll=true tabindex=-1 id=navbarMenus aria-labelledby=navbarMenusLabel><div class="offcanvas-header px-4 pb-0"><div class="offcanvas-title h5" id=navbarMenusLabel>Natenoms Blog</div><button type=button class="btn-close btn-close-white" data-bs-dismiss=offcanvas data-bs-target=#navbarMenus aria-label=Close></button></div><div class="offcanvas-body p-4 pt-0 p-xxl-0"><hr class=d-xxl-none><ul class="navbar-nav flex-row flex-wrap align-items-center me-auto"><li class="nav-item col-6 col-xxl-auto"><a class="nav-link py-2 px-0 px-xxl-2" href=https://natenom.de/><i class="fas fa-home me-1"></i></a></li><li class="nav-item col-6 col-xxl-auto"><a class="nav-link py-2 px-0 px-xxl-2" href=https://natenom.de/ueber/>Über</a></li><li class="nav-item col-6 col-xxl-auto"><a class="nav-link py-2 px-0 px-xxl-2" href=https://wiki.natenom.de/ target=_blank rel="noopener noreferrer">Wiki</a></li><li class="nav-item col-6 col-xxl-auto"><a class="nav-link py-2 px-0 px-xxl-2" href=https://natenom.de/blogroll/>Blogroll</a></li><li class="nav-item col-6 col-xxl-auto"><a class="nav-link py-2 px-0 px-xxl-2" href=https://kagube.de/ target=_blank rel="noopener noreferrer">Blog vom kleinen 🐘</a></li></ul><hr class=d-xxl-none><form class="search-bar ms-auto my-auto" action=/search/ novalidate><div class="input-group align-items-center"><span class="btn btn-search disabled position-absolute left-0 border-0 px-1"><i class="fas fa-fw fa-search fa-lg"></i>
</span><input class="my-1 form-control border-white rounded-5 search-input bg-body" name=q type=search placeholder=Suchen aria-label=Search required>
<span class="search-shortcut position-absolute end-0 top-0 me-2"><kbd class="text-dark bg-white opacity-75 rounded-3 shadow border border-primary py-1 fw-bold">/</kbd></span></div></form><hr class=d-xxl-none><ul class="navbar-nav flex-row flex-wrap align-items-center ms-md-auto"><li class="nav-item py-2 py-xxl-1 col-12 col-xxl-auto"><nav class="social-links nav justify-content-center flex-row"><a class="nav-link social-link col-6 col-xxl-auto p-1" target=_blank href=https://digitalcourage.social/@natenom title=Mastodon rel=me><i class="fa-fw fab fa-mastodon"></i>
<span class="ms-1 d-xxl-none">Mastodon</span>
</a><a class="nav-link social-link col-6 col-xxl-auto p-1" target=_blank href=/index.xml title=RSS rel=me><i class="fas fa-fw fa-rss"></i>
<span class="ms-1 d-xxl-none">RSS</span></a></nav></li><li class="nav-item py-2 py-xxl-1 col-12 col-xxl-auto"><div class="vr d-none d-xxl-flex h-100 mx-xxl-2 text-white"></div><hr class="d-xxl-none my-2"></li><li class="nav-item dropdown col-6 col-xxl-auto"><a class="nav-link px-0 py-2 px-xxl-1" href=# id=fontSizeDropdown role=button data-bs-toggle=dropdown aria-expanded=false><i class="fas fa-fw fa-font"></i>
<span class=d-xxl-none>Schriftgröße</span></a><ul class="font-size-dropdown-menu dropdown-menu dropdown-menu-end" aria-labelledby=fontSizeDropdown><li><button class="font-size-item dropdown-item" data-size=xs>
Extra klein</button></li><li><button class="font-size-item dropdown-item" data-size=sm>
Klein</button></li><li><button class="font-size-item dropdown-item active" data-size=md>
Mittel</button></li><li><button class="font-size-item dropdown-item" data-size=lg>
Groß</button></li><li><button class="font-size-item dropdown-item" data-size=xl>
Extra groß</button></li></ul></li><li class="nav-item dropdown col-6 col-xxl-auto"><a class="nav-link px-0 py-2 px-xxl-1" href=# id=paletteDropdown role=button data-bs-toggle=dropdown aria-expanded=false><i class="fas fa-fw fa-palette"></i>
<span class=d-xxl-none>Palette</span></a><ul class="palette-dropdown-menu dropdown-menu dropdown-menu-end px-2 row g-2" aria-labelledby=paletteDropdown><li class="col-4 my-1"><a role=button id=palette-blue aria-label=Blau class="btn btn-sm w-100 palette text-bg-blue" data-palette=blue></a></li><li class="col-4 my-1"><a role=button id=palette-blue-gray aria-label=Blaugrau class="btn btn-sm w-100 palette text-bg-blue-gray" data-palette=blue-gray></a></li><li class="col-4 my-1"><a role=button id=palette-brown aria-label=Braun class="btn btn-sm w-100 palette text-bg-brown" data-palette=brown></a></li><li class="col-4 my-1"><a role=button id=palette-cyan aria-label=Cyan class="btn btn-sm w-100 palette text-bg-cyan" data-palette=cyan></a></li><li class="col-4 my-1"><a role=button id=palette-green aria-label=Grün class="btn btn-sm w-100 palette text-bg-green" data-palette=green></a></li><li class="col-4 my-1"><a role=button id=palette-indigo aria-label=Indigo class="btn btn-sm w-100 palette text-bg-indigo" data-palette=indigo></a></li><li class="col-4 my-1"><a role=button id=palette-orange aria-label=Orange class="btn btn-sm w-100 palette text-bg-orange" data-palette=orange></a></li><li class="col-4 my-1"><a role=button id=palette-pink aria-label=Rosa class="btn btn-sm w-100 palette text-bg-pink" data-palette=pink></a></li><li class="col-4 my-1"><a role=button id=palette-purple aria-label=Purpur class="btn btn-sm w-100 palette text-bg-purple" data-palette=purple></a></li><li class="col-4 my-1"><a role=button id=palette-red aria-label=Rot class="btn btn-sm w-100 palette text-bg-red" data-palette=red></a></li><li class="col-4 my-1"><a role=button id=palette-teal aria-label=Teal class="btn btn-sm w-100 palette text-bg-teal" data-palette=teal></a></li><li class="col-4 my-1"><a role=button id=palette-yellow aria-label=Gelb class="btn btn-sm w-100 palette text-bg-yellow" data-palette=yellow></a></li></ul></li><li class="nav-item dropdown col-6 col-xxl-auto"><a class="nav-link px-0 py-2 px-xxl-1" href=# id=modeDropdown role=button data-bs-toggle=dropdown aria-expanded=false><i class="mode-icon fas fa-fw fa-adjust" id=modeIcon></i>
<span class=d-xxl-none>Modus</span></a><ul class="mode-dropdown-menu dropdown-menu dropdown-menu-end" aria-labelledby=modeDropdown><li class=mode-item data-color-mode=light data-icon=sun><button class=dropdown-item>
<i class="mode-icon fas fa-fw fa-sun"></i> Hell</button></li><li class=mode-item data-color-mode=dark data-icon=moon><button class=dropdown-item>
<i class="mode-icon fas fa-fw fa-moon"></i> Dunkel</button></li><li class="mode-item active" data-color-mode=auto data-icon=adjust><button class=dropdown-item>
<i class="mode-icon fas fa-fw fa-adjust"></i> Auto</button></li></ul></li></ul></div></div><div class=d-flex><button class="navbar-toggler order-5 border-0" type=button data-bs-toggle=offcanvas data-bs-target=#navbarMenus aria-controls=navbarMenus aria-expanded=false aria-label="Toggle navigation">
<i class="fas fa-ellipsis-h"></i></button></div></div></nav></header><main class=container><div class="row content"><noscript><div class="alert alert-danger" role=alert>Dein Browser unterstützt kein JavaScript.</div></noscript><div class=col-xxl-8><div class=container><nav class="row card component" aria-label=breadcrumb><div class="card-body pb-0"><ol class="hbs-breadcrumb breadcrumb flex-nowrap"><li class="breadcrumb-item text-surface"><a href=/>Blog</a></li><li class="breadcrumb-item text-surface"><a href=/posts/>Posts</a></li><li class="breadcrumb-item active">Niemals nie Copy & Paste von Shell Kommandos aus einem Browser in eine Shell hinein Shortcode für Hugo mit Warnhinweis und Beispiel</li></ol></div></nav><div class="post-panel-wrapper position-relative d-flex justify-content-center"><div class="d-flex flex-row justify-content-center rounded-5 border post-panel position-fixed px-3 py-1 surface shadow-1"><a class="action action-toc d-none d-xxl-block" href=#postTOC role=button title=Inhaltsverzeichnis><i class="fas fa-fw fa-list-alt"></i>
</a><a class="action action-toc d-block d-xxl-none" href=#post-toc-container role=button title=Inhaltsverzeichnis><i class="fas fa-fw fa-list-alt"></i>
</a><a class="action action-post-comments" href=#post-comments role=button aria-label=Comments title=Kommentare><i class="fas fa-fw fa-comments"></i>
</a><a id=sidebarToggler class="action action-sidebar-toggler d-none d-xxl-block" role=button title><i class="fas fa-fw fa-expand-alt" data-fa-transform=rotate-45></i></a></div></div><article class="row card component mb-4 post"><div class=card-header><h1 class="card-title post-title my-2">Niemals nie Copy & Paste von Shell Kommandos aus einem Browser in eine Shell hinein Shortcode für Hugo mit Warnhinweis und Beispiel</h1></div><div class=card-body><div class="post-meta mb-3"><span class="post-date me-1 mb-1" title="Erstellt am 2022-10-02 11:34:51 +0200 CEST.">Sonntag, 2. Oktober 2022</span><span class="post-reading-time me-1 mb-1">4 Min. Lesezeit</span><a href=/categories/linux/ class="btn btn-sm btn-secondary mb-1 me-2 py-0 pe-1 post-taxonomy post-taxonomy-sm post-category">
<i class="fas fa-fw fa-folder me-1"></i>Linux</a><a href=/tags/css/ class="btn btn-sm btn-secondary mb-1 me-2 py-0 pe-1 post-taxonomy post-taxonomy-sm post-tag">CSS</a><a href=/tags/howtos/ class="btn btn-sm btn-secondary mb-1 me-2 py-0 pe-1 post-taxonomy post-taxonomy-sm post-tag">Howtos</a><a href=/tags/html/ class="btn btn-sm btn-secondary mb-1 me-2 py-0 pe-1 post-taxonomy post-taxonomy-sm post-tag">HTML</a><a href=/tags/hugo/ class="btn btn-sm btn-secondary mb-1 me-2 py-0 pe-1 post-taxonomy post-taxonomy-sm post-tag">Hugo</a><a href=/tags/linux/ class="btn btn-sm btn-secondary mb-1 me-2 py-0 pe-1 post-taxonomy post-taxonomy-sm post-tag">Linux</a><a href=/tags/scss/ class="btn btn-sm btn-secondary mb-1 me-2 py-0 pe-1 post-taxonomy post-taxonomy-sm post-tag">SCSS</a><a href=/tags/shell/ class="btn btn-sm btn-secondary mb-1 me-2 py-0 pe-1 post-taxonomy post-taxonomy-sm post-tag">Shell</a><a href=/tags/sicherheit/ class="btn btn-sm btn-secondary mb-1 me-2 py-0 pe-1 post-taxonomy post-taxonomy-sm post-tag">Sicherheit</a></div><div id=postTOC class=toc-details><details open><summary>Inhaltsverzeichnis</summary><nav id=TableOfContents><ul><li><a href=#wieso-eigentlich-nicht>Wieso eigentlich nicht?</a></li><li><a href=#und-wie-macht-man-das-richtig>Und wie macht man das richtig?</a></li><li><a href=#beispiel>Beispiel</a></li><li><a href=#immer-prüfen>Immer prüfen</a></li><li><a href=#quelltext-für-den-shortcode>Quelltext für den Shortcode</a><ul><li><a href=#html>HTML</a></li><li><a href=#scss>SCSS</a></li></ul></li><li><a href=#einbindung-in-hugo>Einbindung in Hugo</a></li></ul></nav></details></div><div class="post-content mb-3" data-bs-spy=scroll data-bs-target=#TableOfContents tabindex=0><div id=post-summary><p>Im Internet gibt es viele schöne Anleitungen für verschiedenste Themen. Und viele davon liefern auch gleich die Shell Kommandos mit, die man nur noch markieren, kopieren, direkt in die Shell einfügen und mit <code>Enter</code> bestätigen muss, um sie auszuführen. NEIN, tut das niemals NIE!</p><p>Ich habe auch viele solcher Anleitungen geschrieben, die vielfach genutzt wurden. Und teilweise habe ich dann auch auf das Problem hingewiesen.</p></div><div id=post-content-body><p>Um diesen Warnhinweis zu vereinheitlichen, habe ich einen Shortcode für Hugo erstellt, den ich in diesem Blog und auch in meinem neuen Wiki nutzen kann. Diesen werde ich in Zukunft immer in Blogbeiträge und Wikiseiten einfügen, sobald es Shell Kommandos gibt.</p><div class="shortcode-notice update"><div class="shortcode-notice-title update">Update</div><div class=notice-content>Anmerkungen von SuperTux88 eingearbeitet. Danke :)</div></div><h2 id=wieso-eigentlich-nicht data-numberify>Wieso eigentlich nicht?<a class="anchor ms-1" href=#wieso-eigentlich-nicht></a></h2><p>Wie sollte man Shell Kommandos nicht direkt in eine Shell einfügen und ausführen? Man kann doch sehen, was man markiert hat und was in der Shell ausgeführt werden wird?</p><p>Nein.</p><p>Ich habe das bisher noch nicht in freier Wildbahn gesehen aber es ist möglich, dass man innerhalb eines Code-Blocks z. B. via CSS, Teile versteckt. Diese werden jedoch beim Markieren mit ausgewählt und kopiert. Fügt man das direkt in die Shell ein und drückt Enter, werden die &ldquo;unsichtbaren&rdquo; Shell Kommandos auch ausgeführt. Es gibt vielleicht aber auch noch ältere Terminal-Emulatoren, die direkt die Kommandos ausführen.</p><p>Es gibt aber auch Möglichkeiten, das notwendige Drücken von Enter durch den Benutzer mit Steuerzeichen zu überwinden. Der Terminal-Emulator Konsole (von KDE) erkennt beim Einfügen solche Zeichen und fragt nach, ob sie herausgefiltert werden sollen. Xterm zeigt alle Kommandos an und erwartet eine Eingabe vom Benutzer. Wie sich andere Terminal-Emulatoren verhalten, habe ich nicht getestet. Ich habe aber die Rückmeldung bekommen, dass es welche gibt, die dann direkt ausführen.</p><p>Wenn auf einer Plattform normale Benutzer gar keinen CSS-Code in Beiträge einarbeiten können, sollte das auch relativ sicher sein, es sei denn, es gibt eine Sicherheitslücke.</p><p>Im Zweifel sollte man sich also nicht darauf verlassen, dass der Terminal-Emulator sicher reagiert und die folgende Methode verwenden.</p><p>Obwohl das ein ziemlich altes Problem ist, scheint es nicht bei jedem bekannt zu sein, der solchen Anleitungen folgt und die kopierten Kommandos direkt ausführt.</p><h2 id=und-wie-macht-man-das-richtig data-numberify>Und wie macht man das richtig?<a class="anchor ms-1" href=#und-wie-macht-man-das-richtig></a></h2><p>Die einfachste Möglichkeit, die ich auch bevorzuge, ist ein Texteditor: Bevor man von irgendwelchen Websites Shell Kommandos nutzt, fügt man diese zuerst in einen lokalen Texteditor ein, prüft, ob alles stimmt, markiert kopiert dann die Zeile im Texteditor und nutze diese zum Einfügen in die Shell.</p><h2 id=beispiel data-numberify>Beispiel<a class="anchor ms-1" href=#beispiel></a></h2><p>So sieht der Shortcode in Aktion aus, der auch ein Beispiel zum Kopieren enthält (anklicken zum Öffnen):</p><div class=shortcode-codewarning><details><summary class="shortcode-codewarning summary">Vorsicht beim Ausführen von Shellkommandos via Copy & Paste</summary><div class="shortcode-codewarning content"><p>Man sollte Shellkommandos aus Anleitungen, die in einem Browser angezeigt werden, grundsätzlich nicht einfach ungeprüft in die Shell einfügen und ausführen.</p><p>Denn es ist möglich, Teile des Codes z. B. via CSS zu verstecken. Diese Teile werden aber trotzdem kopiert und landen auch in der Shell, wo sie ausgeführt werden.</p><p>Besser ist es, die Kommandos erst in einen lokalen Texteditor einzufügen und dort zu prüfen, bevor man die ausführt.<p><p>Kopiere doch mal dieses Beispiel und füge es in die Shell (!NEIN) in einen Editor ein:</p><p><code>echo "Befehl 1"; <span class="shortcode-codewarning hidden">echo "Befehl 2. Im Browser unsichtbar, da font-size per CSS auf 0 gestellt wurde. Hier könnte z. B. die Festplatte gelöscht oder andere Dummheiten gemacht werden."; </span>echo "Befehl 3"</code></p></div></details></div><h2 id=immer-prüfen data-numberify>Immer prüfen<a class="anchor ms-1" href=#immer-prüfen></a></h2><p>Auch bei vertrauenswürdigen Websites oder Beiträgen sollte man Shell Kommandos immer prüfen, denn es könnte sein, dass Inhalt von Dritten verändert wurden. Auch hier im Blog oder im Wiki.</p><h2 id=quelltext-für-den-shortcode data-numberify>Quelltext für den Shortcode<a class="anchor ms-1" href=#quelltext-für-den-shortcode></a></h2><h3 id=html data-numberify>HTML<a class="anchor ms-1" href=#html></a></h3><p>Und das ist der Quelltext für den Shortcode</p><div class=highlight><pre tabindex=0 style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-html data-lang=html><span style=display:flex><span>&lt;<span style=color:#f92672>div</span> <span style=color:#a6e22e>class</span><span style=color:#f92672>=</span><span style=color:#e6db74>&#34;shortcode-codewarning&#34;</span>&gt;
</span></span><span style=display:flex><span> &lt;<span style=color:#f92672>details</span>&gt;
</span></span><span style=display:flex><span> &lt;<span style=color:#f92672>summary</span> <span style=color:#a6e22e>class</span><span style=color:#f92672>=</span><span style=color:#e6db74>&#34;shortcode-codewarning summary&#34;</span>&gt;Vorsicht beim Ausführen von Shellkommandos via Copy <span style=color:#960050;background-color:#1e0010>&amp;</span> Paste&lt;/<span style=color:#f92672>summary</span>&gt;
</span></span><span style=display:flex><span> &lt;<span style=color:#f92672>div</span> <span style=color:#a6e22e>class</span><span style=color:#f92672>=</span><span style=color:#e6db74>&#34;shortcode-codewarning content&#34;</span>&gt;&lt;<span style=color:#f92672>p</span>&gt;
</span></span><span style=display:flex><span> Man sollte Shellkommandos aus Anleitungen, die in einem Browser angezeigt werden, grundsätzlich nicht einfach ungeprüft in die Shell einfügen und ausführen.&lt;/<span style=color:#f92672>p</span>&gt;
</span></span><span style=display:flex><span> &lt;<span style=color:#f92672>p</span>&gt;Denn es ist möglich, Teile des Codes z. B. via CSS zu verstecken. Diese Teile werden aber trotzdem kopiert und landen auch in der Shell, wo sie ausgeführt werden.&lt;/<span style=color:#f92672>p</span>&gt;
</span></span><span style=display:flex><span> &lt;<span style=color:#f92672>p</span>&gt;Besser ist es, die Kommandos erst in einen lokalen Texteditor einzufügen und dort zu prüfen, bevor man die ausführt.&lt;<span style=color:#f92672>p</span>&gt;
</span></span><span style=display:flex><span> &lt;<span style=color:#f92672>p</span>&gt;Kopiere doch mal dieses Beispiel und füge es in die Shell (!NEIN) in einen Editor ein:&lt;/<span style=color:#f92672>p</span>&gt;
</span></span><span style=display:flex><span> &lt;<span style=color:#f92672>p</span>&gt;&lt;<span style=color:#f92672>code</span>&gt;echo &#34;Befehl 1&#34;; &lt;<span style=color:#f92672>span</span> <span style=color:#a6e22e>class</span><span style=color:#f92672>=</span><span style=color:#e6db74>&#34;shortcode-codewarning hidden&#34;</span>&gt;echo &#34;Befehl 2. Im Browser unsichtbar, da font-size per CSS auf 0 gestellt wurde. Hier könnte z. B. die Festplatte gelöscht oder andere Dummheiten gemacht werden.&#34;; &lt;/<span style=color:#f92672>span</span>&gt;echo &#34;Befehl 3&#34;&lt;/<span style=color:#f92672>code</span>&gt;&lt;/<span style=color:#f92672>p</span>&gt;&lt;/<span style=color:#f92672>div</span>&gt;
</span></span><span style=display:flex><span> &lt;/<span style=color:#f92672>details</span>&gt;
</span></span><span style=display:flex><span>&lt;/<span style=color:#f92672>div</span>&gt;
</span></span></code></pre></div><h3 id=scss data-numberify>SCSS<a class="anchor ms-1" href=#scss></a></h3><p>Und hier das dazugehörige SCSS:</p><div class=highlight><pre tabindex=0 style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-scss data-lang=scss><span style=display:flex><span><span style=color:#75715e>/* Shortcode Codewarning */</span>
</span></span><span style=display:flex><span><span style=color:#a6e22e>.shortcode-codewarning</span> {
</span></span><span style=display:flex><span> <span style=color:#a6e22e>margin-bottom</span><span style=color:#f92672>:</span> <span style=color:#ae81ff>1</span><span style=color:#66d9ef>em</span>;
</span></span><span style=display:flex><span> <span style=color:#a6e22e>.hidden</span> {
</span></span><span style=display:flex><span> <span style=color:#a6e22e>font-size</span><span style=color:#f92672>:</span><span style=color:#ae81ff>0</span>;
</span></span><span style=display:flex><span> }
</span></span><span style=display:flex><span> <span style=color:#a6e22e>.summary</span> {
</span></span><span style=display:flex><span> <span style=color:#a6e22e>border-radius</span><span style=color:#f92672>:</span> <span style=color:#ae81ff>4</span><span style=color:#66d9ef>px</span> <span style=color:#ae81ff>4</span><span style=color:#66d9ef>px</span> <span style=color:#ae81ff>4</span><span style=color:#66d9ef>px</span> <span style=color:#ae81ff>4</span><span style=color:#66d9ef>px</span>;
</span></span><span style=display:flex><span> <span style=color:#a6e22e>color</span><span style=color:#f92672>:</span> <span style=color:#ae81ff>#fff</span>;
</span></span><span style=display:flex><span> <span style=color:#a6e22e>font-weight</span><span style=color:#f92672>:</span> <span style=color:#ae81ff>700</span>;
</span></span><span style=display:flex><span> <span style=color:#a6e22e>padding-left</span><span style=color:#f92672>:</span> <span style=color:#ae81ff>1</span><span style=color:#66d9ef>em</span>;
</span></span><span style=display:flex><span> <span style=color:#a6e22e>margin-bottom</span><span style=color:#f92672>:</span> <span style=color:#ae81ff>0</span><span style=color:#66d9ef>px</span>;
</span></span><span style=display:flex><span> <span style=color:#a6e22e>background</span><span style=color:#f92672>:</span> <span style=color:#a6e22e>rgba</span>(<span style=color:#ae81ff>198</span><span style=color:#f92672>,</span> <span style=color:#ae81ff>65</span><span style=color:#f92672>,</span> <span style=color:#ae81ff>61</span><span style=color:#f92672>,</span> <span style=color:#ae81ff>0</span><span style=color:#ae81ff>.8</span>);
</span></span><span style=display:flex><span> }
</span></span><span style=display:flex><span> <span style=color:#a6e22e>.content</span> {
</span></span><span style=display:flex><span> <span style=color:#a6e22e>border-radius</span><span style=color:#f92672>:</span> <span style=color:#ae81ff>4</span><span style=color:#66d9ef>px</span> <span style=color:#ae81ff>4</span><span style=color:#66d9ef>px</span> <span style=color:#ae81ff>4</span><span style=color:#66d9ef>px</span> <span style=color:#ae81ff>4</span><span style=color:#66d9ef>px</span>;
</span></span><span style=display:flex><span> <span style=color:#a6e22e>color</span><span style=color:#f92672>:</span> <span style=color:#ae81ff>#666</span>;
</span></span><span style=display:flex><span> <span style=color:#a6e22e>display</span><span style=color:#f92672>:</span> block;
</span></span><span style=display:flex><span> <span style=color:#a6e22e>font-size</span><span style=color:#f92672>:</span> <span style=color:#ae81ff>1</span><span style=color:#66d9ef>em</span>;
</span></span><span style=display:flex><span> <span style=color:#a6e22e>margin-bottom</span><span style=color:#f92672>:</span> <span style=color:#ae81ff>0</span>;
</span></span><span style=display:flex><span> <span style=color:#a6e22e>margin-top</span><span style=color:#f92672>:</span> <span style=color:#ae81ff>0</span>;
</span></span><span style=display:flex><span> <span style=color:#a6e22e>padding</span><span style=color:#f92672>:</span> <span style=color:#ae81ff>.6</span><span style=color:#66d9ef>em</span> <span style=color:#ae81ff>1</span><span style=color:#66d9ef>em</span>;
</span></span><span style=display:flex><span> <span style=color:#a6e22e>background</span><span style=color:#f92672>:</span> <span style=color:#ae81ff>#d9d2d2</span>;
</span></span><span style=display:flex><span> }
</span></span><span style=display:flex><span>}
</span></span></code></pre></div><h2 id=einbindung-in-hugo data-numberify>Einbindung in Hugo<a class="anchor ms-1" href=#einbindung-in-hugo></a></h2><p>Um den Shortcode in Hugo einzubinden, speichert man den HTML Teil als <code>codewarning.html</code> nach <code>layouts/shortcodes</code> ab, den CSS-Teil entsprechend im Theme, was sehr unterschiedlich ist.</p><p>Um den Shortcode dann innerhalb von Blogbeiträgen einzufügen, schreibt man an entsprechender Stelle:</p><pre><code>{{&lt; codewarning &gt;}}
</code></pre></div></div></div><div class=card-footer><div class="post-navs d-flex justify-content-evenly"><div class="post-nav post-prev"><i class="fas fa-fw fa-chevron-down post-prev-icon me-1" data-fa-transform=rotate-90></i>
<a href=/2022/09/bilder-fuer-hugo-automatisch-korrekt-ausrichten/>Bilder für Hugo automatisch korrekt ausrichten</a></div><div class="post-nav post-next"><a href=/2022/10/fotos-vom-01-10-2022-und-ein-schoenes-zeitraffer/>Fotos vom 01.10.2022 und ein schönes Zeitraffer</a>
<i class="fas fa-fw fa-chevron-down post-next-icon ms-1" data-fa-transform=rotate-270></i></div></div></div></article><section class="related-posts row card component"><div class=card-header><h2 class="card-title fs-4 my-2 text-surface">Ähnliche Beiträge</h2></div><div class=card-body><ul class="post-list list-styled"><li><a href=https://natenom.de/2022/09/bilder-fuer-hugo-automatisch-korrekt-ausrichten/>Bilder für Hugo automatisch korrekt ausrichten</a></li><li><a href=https://natenom.de/2022/02/script-konvertierung-markdown-nach-page-bundle/>Shell Script konvertiert Markdown-Dateien zu Page Bundles</a></li><li><a href=https://natenom.de/2022/02/weiterleitungen-wordpress-url-nach-hugo-url-mit-umlauten/>Weiterleitungen von alten WordPress-URLs auf Umlaut-URLs, wie Hugo sie erzeugt</a></li><li><a href=https://natenom.de/2022/02/ein-neues-helferlein-fuer-die-arbeit-mit-hugo/>Ein neues Helferlein für die Arbeit mit Hugo</a></li><li><a href=https://natenom.de/2022/02/kleiner-helfer-zum-finden-von-links/>Kleiner Helfer zum Finden von Links in Hugo (nach dem Vorbild WordPress)</a></li><li><a href=https://natenom.de/2022/02/umzug-des-blogs-von-wordpress-zu-hugo-teil-1/>Umzug von WordPress zu Hugo Teil 1 Von den Gründen bis zum ersten funktionierenden Blog</a></li><li><a href=https://natenom.de/2018/01/shellscript-fuer-linux-zum-testen-auf-meltdown-und-spectre/>Shellscript für Linux zum Testen auf Meltdown und Spectre</a></li><li><a href=https://natenom.de/2017/11/acme-sh-shellscript-fuer-letsencrypt-tls-zertifikate/>acme.sh Shellscript für LetsEncrypt TLS-Zertifikate</a></li><li><a href=https://natenom.de/2016/01/new-release-for-fgallery-1-8-creator-for-static-image-galleries-with-html-css-and-javascript/>New release for fgallery (1.8) Creator for static image galleries with HTML, CSS and Javascript</a></li><li><a href=https://natenom.de/2015/12/gpeasy-php-durch-hugo-statisches-html-ersetzt/>gpEasy (PHP) durch Hugo (statisches HTML) ersetzt</a></li></ul></div></section><div class="card component row post-comments" id=post-comments><div class=card-header><h2 class="card-title my-2 fs-4 text-surface">Kommentare</h2></div><div class=card-body><p>Bisher gibt es hier keine Kommentare.</p><p><details class="mastodon-comments email"><summary class="mastodon-comments email-summary">Kommentar oder Anmerkung für diesen Blogbeitrag</summary><div class="mastodon-comments emailcontent"><p>Öffentlicher Kommentar per E-Mail: <a href='mailto:natenom@posteo.de?subject=Kommentar zum Blogbeitrag: Niemals%20nie%20Copy%20%26%20Paste%20von%20Shell%20Kommandos%20aus%20einem%20Browser%20in%20eine%20Shell%20hinein%20%e2%80%93%20Shortcode%20f%c3%bcr%20Hugo%20mit%20Warnhinweis%20und%20Beispiel&body=Hallo Natenom, %0D%0A%0D%0Azu diesem Blogbeitrag habe ich einen Kommentar:%0D%0A%0D%0AMein Name (optional):%0D%0AMeine Website (optional):%0D%0AIch beziehe mich speziell auf den Kommentar mit der ID:%0D%0A%0D%0AURL zum Blogbeitrag: https%3a%2f%2fnatenom.de%2f2022%2f10%2fniemals-nie-copy-and-paste-von-shell-kommandos-aus-einem-browser-in-eine-shellshortcode-fuer-hugo-mit-warnhinweis-und-beispiel%2f'>Hier klicken</a></p><p>Nicht öffentliche Anmerkung per E-Mail: <a href='mailto:natenom@posteo.de?subject=Persönliche Anmerkung zum Blogbeitrag: Niemals%20nie%20Copy%20%26%20Paste%20von%20Shell%20Kommandos%20aus%20einem%20Browser%20in%20eine%20Shell%20hinein%20%e2%80%93%20Shortcode%20f%c3%bcr%20Hugo%20mit%20Warnhinweis%20und%20Beispiel&body=Hallo Natenom,%0D%0A%0D%0Azu diesem Blogbeitrag habe ich eine persönliche, nicht zu veröffentlichende Anmerkung:%0D%0A%0D%0AURL zum Blogbeitrag: https%3a%2f%2fnatenom.de%2f2022%2f10%2fniemals-nie-copy-and-paste-von-shell-kommandos-aus-einem-browser-in-eine-shellshortcode-fuer-hugo-mit-warnhinweis-und-beispiel%2f'>Hier klicken</a></p></p><p>Sonstige Kontaktaufnahme: <a href=/natenom/>Kontakt</a></p></div></details></p></div></div></div></div><aside class="col-xxl-4 sidebar d-flex"><div class="container d-flex flex-column"><div class="accordion profile"><div class="accordion-item card row text-center component"><div class="accordion-header card-header border-0" id=profile-header><a class="accordion-button d-lg-none mb-2 shadow-none p-0 bg-transparent text-surface collapsed" role=button data-bs-toggle=collapse href=#profile aria-expanded=false aria-controls=profile>Profil</a></div><div class="card-body collapse accordion-collapse accordion-body d-lg-block" id=profile aria-labelledby=profile-header><div class="col-12 d-flex align-items-center justify-content-center"><picture><img class="profile-avatar rounded-circle" alt=Natenom src=https://natenom.de/images/logo-natenom-circle-150x150.png loading=lazy data-viewer-invisible width=150 height=150></picture></div><div class="col-12 profile-meta"><div class="profile-name fw-fold fs-lg">Natenom</div><div class=profile-bio>Verkehrswende, Fahrrad, CriticalMass, OpenBikeSensor, SimRa, OpenSource, Minimalist, OpenStreetMap, Müllsammeln, Malen, Zeichnen</div><a class=profile-about target=_blank rel="noopener noreferrer" href=/natenom/><i class="fas fa-fw fa-user"></i>Über mich</a></div></div></div></div><div class="accordion recent-posts"><section class="row card component"><div class=card-header><h2 class="card-title my-2 fs-4 text-surface d-none d-lg-block">Neueste Beiträge</h2><a class="accordion-button d-lg-none mb-1 shadow-none p-0 bg-transparent collapsed" role=button data-bs-toggle=collapse href=#recent-posts aria-expanded=false aria-controls=recent-posts>Neueste Beiträge</a></div><div class="card-body collapse accordion-collapse accordion-body d-lg-block" id=recent-posts><ul class="post-list list-unstyled ms-1"><li class=mb-2><a href=/2024/01/mal-wieder-einen-personalausweis-gefunden/>Mal wieder einen Personalausweis gefunden</a></li><li class=mb-2><a href=/2024/01/ueberfordert-im-eigenen-auto/>Überfordert im eigenen Auto</a></li><li class=mb-2><a href=/2024/01/was-damals-bei-kugelmaeusen-geholfen-hat-hilft-auch-bei-solchen-mit-laser/>Was damals bei Kugelmäusen geholfen hat, hilft auch bei solchen mit Laser</a></li><li class=mb-2><a href=/2024/01/haltbarkeit-meiner-ersten-barfussschuhe/>Haltbarkeit meiner ersten Barfußschuhe</a></li><li class=mb-2><a href=/2024/01/link-strassenlaerm/>Link(s): Straßenlärm</a></li><li class=mb-2><a href=/2024/01/simpletools-apps-fuer-android-daten-sammeln-oder-bezahlen-wechsel-zum-fork-fossify/>SimpleTools Apps: Daten sammeln oder bezahlen Wechselt zum Fork Fossify</a></li><li class=mb-2><a href=/2024/01/dateinamen-mit-emojies-in-telescope-in-neovim/>Dateinamen mit Emojies in Telescope in NeoVim</a></li><li class=mb-2><a href=/2024/01/capslock-als-esc-verwenden--ein-traum-fuer-neovim/>Capslock als Esc verwenden Ein Traum für NeoVim</a></li></ul></div></section></div><div class="accordion categories-taxonomies"><section class="row card component"><div class=card-header><h2 class="card-title my-2 fs-4 text-surface d-none d-lg-block"><a href=https://natenom.de/categories>Kategorien</a></h2><a class="accordion-button d-lg-none mb-1 shadow-none p-0 bg-transparent text-surface collapsed" role=button data-bs-toggle=collapse href=#taxonomy-categories aria-expanded=false aria-controls=taxonomy-categories>Kategorien</a></div><div class="card-body collapse accordion-collapse accordion-body d-lg-block" id=taxonomy-categories><div class=py-2><a href=/categories/mobilit%C3%A4t/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-category me-2 mb-2" title=Mobilität>Mobilität
<span class="badge badge-sm text-secondary bg-white ms-1">450</span>
</a><a href=/categories/fotografie/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-category me-2 mb-2" title=Fotografie>Fotografie
<span class="badge badge-sm text-secondary bg-white ms-1">328</span>
</a><a href=/categories/diverses/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-category me-2 mb-2" title=Diverses>Diverses
<span class="badge badge-sm text-secondary bg-white ms-1">242</span>
</a><a href=/categories/web/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-category me-2 mb-2" title=Web>Web
<span class="badge badge-sm text-secondary bg-white ms-1">200</span>
</a><a href=/categories/linux/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-category me-2 mb-2" title=Linux>Linux
<span class="badge badge-sm text-secondary bg-white ms-1">135</span>
</a><a href=/categories/android/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-category me-2 mb-2" title=Android>Android
<span class="badge badge-sm text-secondary bg-white ms-1">68</span>
</a><a href=/categories/linkdump/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-category me-2 mb-2" title=Linkdump>Linkdump
<span class="badge badge-sm text-secondary bg-white ms-1">42</span>
</a><a href=/categories/mumble/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-category me-2 mb-2" title=Mumble>Mumble
<span class="badge badge-sm text-secondary bg-white ms-1">16</span>
</a><a href=/categories/navesima/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-category me-2 mb-2" title=NavesiMa>NavesiMa
<span class="badge badge-sm text-secondary bg-white ms-1">9</span>
</a><a href=/categories/links/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-category me-2 mb-2" title=Links>Links
<span class="badge badge-sm text-secondary bg-white ms-1">2</span></a></div></div></section></div><div class="accordion tags-taxonomies"><section class="row card component"><div class=card-header><h2 class="card-title my-2 fs-4 text-surface d-none d-lg-block"><a href=https://natenom.de/tags>Tags</a></h2><a class="accordion-button d-lg-none mb-1 shadow-none p-0 bg-transparent text-surface collapsed" role=button data-bs-toggle=collapse href=#taxonomy-tags aria-expanded=false aria-controls=taxonomy-tags>Tags</a></div><div class="card-body collapse accordion-collapse accordion-body d-lg-block" id=taxonomy-tags><div class=py-2><a href=/tags/fahrrad/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Fahrrad>Fahrrad
<span class="badge badge-sm text-secondary bg-white ms-1">557</span>
</a><a href=/tags/fotos/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Fotos>Fotos
<span class="badge badge-sm text-secondary bg-white ms-1">410</span>
</a><a href=/tags/mobilit%C3%A4t/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Mobilität>Mobilität
<span class="badge badge-sm text-secondary bg-white ms-1">380</span>
</a><a href=/tags/pforzheim/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Pforzheim>Pforzheim
<span class="badge badge-sm text-secondary bg-white ms-1">263</span>
</a><a href=/tags/open-source/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title="Open Source">Open Source
<span class="badge badge-sm text-secondary bg-white ms-1">237</span>
</a><a href=/tags/natur/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Natur>Natur
<span class="badge badge-sm text-secondary bg-white ms-1">208</span>
</a><a href=/tags/linux/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Linux>Linux
<span class="badge badge-sm text-secondary bg-white ms-1">161</span>
</a><a href=/tags/autos/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Autos>Autos
<span class="badge badge-sm text-secondary bg-white ms-1">131</span>
</a><a href=/tags/enzkreis/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Enzkreis>Enzkreis
<span class="badge badge-sm text-secondary bg-white ms-1">115</span>
</a><a href=/tags/statistiken/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Statistiken>Statistiken
<span class="badge badge-sm text-secondary bg-white ms-1">110</span>
</a><a href=/tags/hardware/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Hardware>Hardware
<span class="badge badge-sm text-secondary bg-white ms-1">107</span>
</a><a href=/tags/web/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Web>Web
<span class="badge badge-sm text-secondary bg-white ms-1">107</span>
</a><a href=/tags/android/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Android>Android
<span class="badge badge-sm text-secondary bg-white ms-1">98</span>
</a><a href=/tags/hugo/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Hugo>Hugo
<span class="badge badge-sm text-secondary bg-white ms-1">89</span>
</a><a href=/tags/m%C3%BCll/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Müll>Müll
<span class="badge badge-sm text-secondary bg-white ms-1">89</span>
</a><a href=/tags/sicherheit/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Sicherheit>Sicherheit
<span class="badge badge-sm text-secondary bg-white ms-1">88</span>
</a><a href=/tags/blog/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Blog>Blog
<span class="badge badge-sm text-secondary bg-white ms-1">87</span>
</a><a href=/tags/m%C3%BCllsammeln/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Müllsammeln>Müllsammeln
<span class="badge badge-sm text-secondary bg-white ms-1">86</span>
</a><a href=/tags/politik/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Politik>Politik
<span class="badge badge-sm text-secondary bg-white ms-1">86</span>
</a><a href=/tags/polizei/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Polizei>Polizei
<span class="badge badge-sm text-secondary bg-white ms-1">76</span>
</a><a href=/tags/strecke/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Strecke>Strecke
<span class="badge badge-sm text-secondary bg-white ms-1">75</span>
</a><a href=/tags/abstand/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Abstand>Abstand
<span class="badge badge-sm text-secondary bg-white ms-1">74</span>
</a><a href=/tags/landschaften/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Landschaften>Landschaften
<span class="badge badge-sm text-secondary bg-white ms-1">74</span>
</a><a href=/tags/w%C3%A4lder/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Wälder>Wälder
<span class="badge badge-sm text-secondary bg-white ms-1">68</span>
</a><a href=/tags/wordpress/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=WordPress>WordPress
<span class="badge badge-sm text-secondary bg-white ms-1">64</span>
</a><a href=/tags/neuhausen/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Neuhausen>Neuhausen
<span class="badge badge-sm text-secondary bg-white ms-1">60</span>
</a><a href=/tags/apps/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Apps>Apps
<span class="badge badge-sm text-secondary bg-white ms-1">59</span>
</a><a href=/tags/videos/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Videos>Videos
<span class="badge badge-sm text-secondary bg-white ms-1">59</span>
</a><a href=/tags/landstra%C3%9Fen/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Landstraßen>Landstraßen
<span class="badge badge-sm text-secondary bg-white ms-1">54</span>
</a><a href=/tags/makrofotos/ class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=Makrofotos>Makrofotos
<span class="badge badge-sm text-secondary bg-white ms-1">54</span>
</a><a href=https://natenom.de/tags class="btn btn-sm btn-secondary post-taxonomy ps-3 post-tag me-2 mb-2" title=ALLE>ALLE
<span class="badge badge-sm text-secondary bg-white ms-1">816</span></a></div></div></section></div><div class="accordion archives"><section class="row card component"><div class=card-header><h2 class="card-title my-2 fs-4 text-surface d-none d-lg-block"><a href=/archiv/>Archiv</a></h2><a class="accordion-button d-lg-none mb-1 shadow-none p-0 bg-transparent collapsed" role=button data-bs-toggle=collapse href=#archives aria-expanded=false aria-controls=archives>Archiv</a></div><div class="card-body collapse accordion-collapse accordion-body d-lg-block" id=archives><a href=/archiv/2024/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2024>2024 <span class="badge badge-sm text-secondary bg-white ms-1">23</span>
</a><a href=/archiv/2023/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2023>2023 <span class="badge badge-sm text-secondary bg-white ms-1">147</span>
</a><a href=/archiv/2022/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2022>2022 <span class="badge badge-sm text-secondary bg-white ms-1">188</span>
</a><a href=/archiv/2021/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2021>2021 <span class="badge badge-sm text-secondary bg-white ms-1">111</span>
</a><a href=/archiv/2020/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2020>2020 <span class="badge badge-sm text-secondary bg-white ms-1">193</span>
</a><a href=/archiv/2019/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2019>2019 <span class="badge badge-sm text-secondary bg-white ms-1">118</span>
</a><a href=/archiv/2018/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2018>2018 <span class="badge badge-sm text-secondary bg-white ms-1">143</span>
</a><a href=/archiv/2017/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2017>2017 <span class="badge badge-sm text-secondary bg-white ms-1">163</span>
</a><a href=/archiv/2016/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2016>2016 <span class="badge badge-sm text-secondary bg-white ms-1">108</span>
</a><a href=/archiv/2015/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2015>2015 <span class="badge badge-sm text-secondary bg-white ms-1">85</span>
</a><a href=/archiv/2014/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2014>2014 <span class="badge badge-sm text-secondary bg-white ms-1">85</span>
</a><a href=/archiv/2013/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2013>2013 <span class="badge badge-sm text-secondary bg-white ms-1">56</span>
</a><a href=/archiv/2012/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2012>2012 <span class="badge badge-sm text-secondary bg-white ms-1">43</span>
</a><a href=/archiv/2011/ class="btn btn-sm btn-secondary post-taxonomy ps-3 me-2 mb-2" title=2011>2011 <span class="badge badge-sm text-secondary bg-white ms-1">36</span></a></div></section></div></div></aside></div></main><footer class="footer mt-auto py-3 text-center container"><div class="row text-center"><div class="col-12 mt-2"><p class=mb-2>Natenoms Blog</p><p class="text-secondary mb-2"><small>Mein Blog über verschiedene Themen, die mich über die Zeit beschäftigen. Derzeit sind dies: Verkehrswende, Mobilität, Fahrrad, Minimalismus, Fotografie, Malen, Zeichnen …</small></p><div class="copyright mb-2 text-secondary"><small></small></div><div class="powered-by mb-2 text-secondary"><small>Build with ❤️ from the <a class=text-primary href=https://gohugo.io target=_blank rel="noopener noreferrer">Hugo</a> and the <a class=text-primary href=https://github.com/razonyang/hugo-theme-bootstrap target=_blank rel="noopener noreferrer">HBS</a> theme.</small></div><nav class="social-links nav justify-content-center mb-2 mt-3"><a class="nav-link social-link p-0 me-1 mb-2" target=_blank href=/index.xml title=RSS rel=me><i class="fas fa-fw fa-2x fa-rss" style=color:#ea6221></i></a></nav></div><div class="col-12 col-lg-8 offset-0 offset-lg-1"></div></div><div class=natenom-footer><a href=/ueber/impressum/>Impressum</a> <a href=/ueber/datenschutz/>Datenschutz</a></div></footer><script data-precache src=/assets/main/bundle.min.b0a436c85b86c431bb1c0fdb2ade0445de95435dc453dc7f4f30acad2153b535.js integrity="sha256-sKQ2yFuGxDG7HA/bKt4ERd6VQ13EU9x/TzCsrSFTtTU=" crossorigin=anonymous async></script><script data-precache src=/assets/icons/bundle.min.691458a56c2eef480bec8d31c967801a416b6445459ae901fe213e7870a0dd83.js integrity="sha256-aRRYpWwu70gL7I0xyWeAGkFrZEVFmukB/iE+eHCg3YM=" crossorigin=anonymous defer></script></body></html>