Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • World
  • Users
  • Groups
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse

NodeBB

  1. Home
  2. General Discussion
  3. Layout bei Indieblocks-Plugin anpassen

Layout bei Indieblocks-Plugin anpassen

Scheduled Pinned Locked Moved General Discussion
activitypubcsscodefediversegeminimastodon
1 Posts 1 Posters 0 Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • ? Offline
    ? Offline
    Guest
    wrote last edited by
    #1
    Ein von Gemini (by Google) und Nano Banana erstelltes Artikelbild.

    Wie in einem anderen Artikel schon erwähnt, bin ich gerade am experimentieren, dass ich diesen WordPress-Blog mittels dem ActivityPub-Plugin „Fediverse-tauglich“ mache. Das ist eine recht interessante Reise, bei der es immer wieder Hürden zu nehmen gibt. Aktuell verwende ich das WordPress-Plugin „Indieblocks„, um „Kurzmitteilungen“ (aka „Notes“ für kurze Texte wie bei Twitter) und „Likes“ (für URLs zum Merken) zu veröffentlichen. Diese unterscheiden sich von „normalen WordPress-Posts“ hauptsächlich durch ihre Länge bzw. den Umfang. Das funktioniert für mich schon soweit ganz gut und ich nutze diese „Kurzmitteilungen“ auch oft, um für mich selbst Seiten, Themen oder URLs zu merken. Praktisch ist hierbei auch, das ich direkt über meine Webseite mir auch wieder eine Übersicht der Notes und Links anzeigen lassen kann.

    Jetzt kommen wir zu meinem Erste-Welt-Problem: Wir hat die Ansicht, wie die Einträge angezeigt werden, nicht gefallen. Zum einen brauche ich bei dieser Art von Mitteilungen keine Überschrift und dann war mir die Trennung zwischen den einzelnen Posts nicht offensichtlich genug.
    Daher habe ich etwas mittels eigenem CSS-Code rumprobiert und habe die Ansicht für mein Empfinden etwas optimiert.

    Den zusätzlichen CSS-Code habe ich im WordPress-Backend unter Design → Customizer → zusätzliches CSS eingefügt.
    Ich füge euch im Anschluss den Code hier ein, welchen ich verwendet habe. Evtl. müsst ihr diesen noch für euch anpassen. Ich verwende das Neve-Theme hier auf meinen Blog und ich kann nicht sagen, ob dieser Code auch mit anderen WordPress-Themes 100%ig funktioniert. Da ich mit CSS auch nicht so richtig fit bin, habe ich mir bei der Erstellung von Gemini helfen lassen.

    
    /* Rahmen und Abstände für die einzelnen Notizen auf der Übersichtsseite */
    .post-type-archive-note .nv-index-posts .content-wrap,
    .post-type-archive-indieblocks_note .nv-index-posts .content-wrap,
    .post-type-archive-note article,
    .post-type-archive-indieblocks_note article {
        border: 1px solid #e1e8ed !important;
        border-radius: 12px !important;
        padding: 15px !important;
        margin-bottom: 20px !important;
        background-color: #ffffff !important;
        box-shadow: 0 5px 8px rgba(0,0,0,0.1) !important;
    }
    
    /* Entfernt den Standard-Abstand des Themes, damit der Rahmen bündig sitzt */
    .post-type-archive-note .nv-index-posts article,
    .post-type-archive-indieblocks_note .nv-index-posts article {
        border: none !important;
        background: transparent !important;
    }
    
    
    
    /* --- 1. Auf der Übersichtsseite (Archiv) der Notes --- */
    /* Wir sprechen den Body der Note-Archive an */
    body.post-type-archive-note .blog-entry-title.entry-title,
    body.post-type-archive-indieblocks_note .blog-entry-title.entry-title {
        display: none !important;
    }
    
    /* --- 2. In der Einzelansicht einer Note --- */
    /* Falls du den Titel auch öffnen der einzelnen Notiz ausblenden willst */
    body.single-note .entry-title,
    body.single-indieblocks_note .entry-title {
        display: none !important;
    }
    
    /* 1. TITEL AUSBLENDEN auf Notes und Likes */
    .post-type-archive-note .entry-title,
    .post-type-archive-like .entry-title,
    .post-type-archive-indieblocks_like .entry-title,
    .post-type-archive-indieblocks_note .entry-title {
        display: none !important;
    }
    /* Rahmen für Notes und Likes Archiv-Seiten */
    .post-type-archive-note .nv-index-posts article,
    .post-type-archive-like .nv-index-posts article,
    .post-type-archive-indieblocks_note .nv-index-posts article,
    .post-type-archive-indieblocks_like .nv-index-posts article {
        border: 1px solid #e1e8ed !important;
        border-radius: 12px !important;
        padding: 20px !important;
        margin-bottom: 25px !important;
        background-color: #ffffff !important;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important;
        display: block !important;
        overflow: hidden !important;
    }
    
    /* Verhindert, dass das Theme innere Abstände erzwingt, die den Rahmen sprengen */
    .post-type-archive-note .content-wrap,
    .post-type-archive-like .content-wrap {
        padding: 0 !important;
        margin: 0 !important;
    }
    1 Reply Last reply
    1
    0
    • tag-activitypub@relay.fedi.buzzT tag-activitypub@relay.fedi.buzz shared this topic
    Reply
    • Reply as topic
    Log in to reply
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes


    • Login

    • Don't have an account? Register

    • Login or register to search.
    Powered by NodeBB Contributors
    • First post
      Last post
    0
    • Categories
    • Recent
    • Tags
    • Popular
    • World
    • Users
    • Groups