{"id":1588,"date":"2012-09-13T21:21:53","date_gmt":"2012-09-13T20:21:53","guid":{"rendered":"http:\/\/www.jungsi.de\/?p=1588"},"modified":"2026-08-28T16:05:38","modified_gmt":"2026-08-28T14:05:38","slug":"umgestaltung","status":"publish","type":"post","link":"https:\/\/www.jungsi.de\/en\/umgestaltung\/","title":{"rendered":"Umgestaltung"},"content":{"rendered":"<p class=\"wp-block-paragraph\">Lange hat mein altes Design nicht hergehalten. \ud83d\ude09 Nachdem ich in der letzten Zeit viel auf anderen Blogs unterwegs war, habe ich mich nochmal zu einem neuen Design entschlossen. Dabei habe ich auch im Hintergrund wieder einiges ge\u00e4ndert \u2013 u.\u00a0a. f\u00fchrt ein Teil der Links oben in den Men\u00fcs nicht mehr auf extra Seiten, sondern sind nun mit Kategorien verkn\u00fcpft. Dadurch muss ich nicht so viele einzelne Seiten &#8222;bauen&#8220; sondern mach lieber mehr einzelne Artikel und ordne diese den richtigen Kategorien zu. Dazu musste ich nat\u00fcrlich auch die Kategorien erweitern \u2013 diese sind jetzt am Ende der rechten Leiste zusammen mit der jeweils enthaltenen Anzahl an Artikeln zu sehen.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/www.jungsi.de\/blog\/wp-content\/uploads\/2012\/09\/Kategorien2.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"266\" height=\"155\" src=\"https:\/\/www.jungsi.de\/blog\/wp-content\/uploads\/2012\/09\/Kategorien2.jpg\" alt=\"\" class=\"wp-image-1591\"\/><\/a><figcaption class=\"wp-element-caption\">Kategorien mit Artikelanzahl<\/figcaption><\/figure>\n<\/div>\n\n\n<!--more-->\n\n\n\n<p class=\"wp-block-paragraph\">Dabei gab es noch Klippen zum Umschiffen \ud83d\ude09 F\u00fcr die Verlinkung der Men\u00fcs mit den Kategorien habe ich das Plugin &#8222;<a title=\"Plugin Page Link To\" href=\"http:\/\/wordpress.org\/extend\/plugins\/page-links-to\/\" target=\"_blank\" rel=\"noopener\">Page Links To<\/a>&#8220; verwendet. Das Plug-in klinkt sich in die Seitenerstellung ein.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/www.jungsi.de\/blog\/wp-content\/uploads\/2012\/09\/Page-Link-To.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"506\" height=\"190\" src=\"https:\/\/www.jungsi.de\/blog\/wp-content\/uploads\/2012\/09\/Page-Link-To.jpg\" alt=\"\" class=\"wp-image-1592\" srcset=\"https:\/\/www.jungsi.de\/blog\/wp-content\/uploads\/2012\/09\/Page-Link-To.jpg 506w, https:\/\/www.jungsi.de\/blog\/wp-content\/uploads\/2012\/09\/Page-Link-To-300x113.jpg 300w\" sizes=\"auto, (max-width: 506px) 100vw, 506px\" \/><\/a><figcaption class=\"wp-element-caption\">Plugin &#8222;Page Link To&#8220;<\/figcaption><\/figure>\n<\/div>\n\n\n<p class=\"wp-block-paragraph\">Der Rest war dann alles im Theme &#8222;<strong>Atahualpa<\/strong>&#8220; zu l\u00f6sen \u2013 immer wieder erstaunlich, was man da alles einstellen kann \ud83d\ude09<br>Unter <em>-> Overall Style &amp; Config -> Body, Text &amp; Links<\/em> habe ich unter Body Style die Hintergrund-Farbe eingestellt, die Font-Gr\u00f6\u00dfe (<em><span style=\"color: #3366ff;\">font-size: 0.8em<\/span><\/em>) und wonach ich l\u00e4nger suchte: Ich wollte den Abstand zwischen den Zeilen vergr\u00f6\u00dfern, um eine bessere Lesbarkeit zu erreichen:\u00a0<span style=\"color: #3366ff;\"><em>line-height: 20px;<\/em><\/span><br>Sp\u00e4ter stie\u00df ich dann auf das Problem, dass sich meine Seite pl\u00f6tzlich der Breite des offenen Browser-Fensters anpasste und bei kleinen Fenstern pl\u00f6tzlich so schmal war, dass man nichts mehr lesen konnte. Die Einstellung, um das anzupassen, ist unter -> Overall Style &amp; Config -> Style &amp; configure LAYOT:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/www.jungsi.de\/blog\/wp-content\/uploads\/2012\/09\/Ata-Layout.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"332\" height=\"84\" src=\"https:\/\/www.jungsi.de\/blog\/wp-content\/uploads\/2012\/09\/Ata-Layout.jpg\" alt=\"\" class=\"wp-image-1594\" srcset=\"https:\/\/www.jungsi.de\/blog\/wp-content\/uploads\/2012\/09\/Ata-Layout.jpg 332w, https:\/\/www.jungsi.de\/blog\/wp-content\/uploads\/2012\/09\/Ata-Layout-300x76.jpg 300w\" sizes=\"auto, (max-width: 332px) 100vw, 332px\" \/><\/a><figcaption class=\"wp-element-caption\">Atahualpa Layout WIDTH unt type<\/figcaption><\/figure>\n<\/div>\n\n\n<p class=\"wp-block-paragraph\">Was ich bisher nicht geschafft habe, ist das Men\u00fc und das Bild oben &#8222;\u00fcberlappen&#8220; zu lassen \u2013 ich habe zwar einige Hinweise gefunden, nur bisher hat keiner davon die richtige Wirkung erzielt.<br>Daf\u00fcr ist nun der Blog-Titel mehr oder weniger transparent in das Bild &#8222;gerutscht&#8220; \ud83d\ude09 <strong>-> Header Area -> Header Image -> Overlayd Blog Titel\/Tagline Style<\/strong><br>Ich habe einfach den dort im Beispiel vorgeschlagenen Code verwendet und nur die Farbe des Rands ge\u00e4ndert.<br>Um die rechte Sidebar durch einen senkrechten Strich vom Artikelbereich etwas abzutrennen, habe ich unter<br><strong>-> Sidebar &amp; Widgets -> Style &amp; configure SIDEBARS -> RIGHT INNER sidebar style<\/strong>:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">border-left: dashed 1px #FFFFFF;<\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><span style=\"text-indent: 30px;\">Waagrechter Strich unter den Widgets:<\/span><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>-&gt; Sidebars &amp; Widgets -&gt; Style WIDGETS -&gt; Widget Content Box:<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">border-bottom: solid 1px #C0C0C0;<\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Zeile mit Datum, Autor usw. unter dem Titel eines Artikels:<br><strong>-&gt; Post &amp; Pages -&gt; Edit POST\/PAGE INFO ITEMS -&gt; BYLINE: Homepage:<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">&lt;image(date-gray.gif)&gt; %date('j. F Y')% &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;image(user-gray.gif)&gt; %author-linked% &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;image(comment-gray.gif)&gt; %comments('0 Kommentare', 'Ein Kommentar', '% Kommentare', 'Kommentare sind geschlossen')% &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &lt;image(eye-gray.gif)&gt; %edit('bearbeiten')%<\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">F\u00fcr die obere Zeile mit Code musste ich mich nun z.B. auch mal wieder mit HTML besch\u00e4ftigen \u2013 damit der Browser das nicht als Code liest, sondern als Text, muss man drei der Zeichen, die h\u00e4ufig darin vorkommen, &#8222;austauschen&#8220; \ud83d\ude09<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p class=\"wp-block-paragraph\">Ersetzen Sie das Zeichen &amp; durch die Zeichenfolge &amp;amp; (&#8222;Ampersand&#8220;)<br>Ersetzen Sie das Zeichen &lt; durch die Zeichenfolge &amp;lt ; (&#8222;lower than&#8220;)<br>Ersetzen Sie das Zeichen &gt; durch die Zeichenfolge &amp;gr; (&#8222;greater than&#8220;)<\/p>\n<\/blockquote>","protected":false},"excerpt":{"rendered":"<p>Lange hat mein altes Design nicht hergehalten. \ud83d\ude09 Nachdem ich in der letzten Zeit viel auf anderen Blogs unterwegs war, habe ich mich nochmal zu \u2026<\/p>","protected":false},"author":2,"featured_media":1594,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_post_was_ever_published":false,"_links_to":"","_links_to_target":""},"categories":[7],"tags":[671],"class_list":["post-1588","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-technik","tag-wordpress"],"wp-worthy-pixel":{"ignored":false,"public":"ae77f688bc4a4a98ba79fe511d3fb225","server":"","url":"https:\/\/vg08.met.vgwort.de\/na\/ae77f688bc4a4a98ba79fe511d3fb225"},"wp-worthy-type":"normal","jetpack_sharing_enabled":true,"jetpack_featured_media_url":"https:\/\/www.jungsi.de\/blog\/wp-content\/uploads\/2012\/09\/Ata-Layout.jpg","_links":{"self":[{"href":"https:\/\/www.jungsi.de\/en\/wp-json\/wp\/v2\/posts\/1588","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.jungsi.de\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.jungsi.de\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.jungsi.de\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.jungsi.de\/en\/wp-json\/wp\/v2\/comments?post=1588"}],"version-history":[{"count":1,"href":"https:\/\/www.jungsi.de\/en\/wp-json\/wp\/v2\/posts\/1588\/revisions"}],"predecessor-version":[{"id":44872,"href":"https:\/\/www.jungsi.de\/en\/wp-json\/wp\/v2\/posts\/1588\/revisions\/44872"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.jungsi.de\/en\/wp-json\/wp\/v2\/media\/1594"}],"wp:attachment":[{"href":"https:\/\/www.jungsi.de\/en\/wp-json\/wp\/v2\/media?parent=1588"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.jungsi.de\/en\/wp-json\/wp\/v2\/categories?post=1588"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.jungsi.de\/en\/wp-json\/wp\/v2\/tags?post=1588"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}