it-swarm.com.de

Mehrere Inhaltsbereiche pro Seite

Ich habe ein komplexes Inhaltsproblem. Jede Seite kann mehrere Abschnitte haben (unbekannte Nummer), jeder Abschnitt kann mehrere Container haben, jeder Container kann mehrere Inhaltsblöcke haben (entweder 1, 2 oder 3).

Ich habe derzeit eine theoretische Lösung mit Kurzwahlen, aber ich möchte diese mit der Benutzeroberfläche lösen, wenn möglich, indem ich wysiwyg-Editoren für jeden Inhaltsblock zur Verfügung stelle.

Abschnitte: Es kann eine beliebige Anzahl von Abschnitten geben (ein realistisches/akzeptables Maximum wären 10). Container: Ein Abschnitt kann beliebig viele Zeilen enthalten (ein realistisches/akzeptables Maximum wären 5). Container: Eine Zeile muss wissen, wie viele Spalten sie enthalten muss. Inhaltsblöcke: Eine Zeile kann 1, 2 oder 3 Spalten enthalten.

Die Shortcode-Lösung sieht ungefähr so ​​aus:

[section id="summary"] //id is required but can be anything (no spaces)
   [container blocks="1"] //row can have 1, 2 or 3 columns
      [block]
      .content-block
      [/block]
   [/container]
[/section]
[section id="find us"] //id is required but can be anything (no spaces)
   [container blocks="3"] //row can have 1, 2 or 3 columns
      [block]
      .content-block
      [/block]
      [block]
      .content-block
      [/block]
      [block]
      .content-block
      [/block]
   [/container]
[/section]
[section id="team"] //id is required but can be anything (no spaces)
   [container blocks="2"] //row can have 1, 2 or 3 columns
      [block]
      .content-block
      [/block]
      [block]
      .content-block
      [/block]
   [/container]
[/section]

Hat jemand irgendwelche Vorschläge, wie ich das machen kann?

Danke, Josh

3
Josh

Das klingt für mich nach einer perfekten Nutzung von Advanced Custom Fields "flexiblen Inhalten" Features. Mit flexiblen Inhaltsfeldern können Sie mehrere Layouts definieren und diese dann in beliebiger Reihenfolge oder Kombination einer Seite hinzufügen oder einzeln veröffentlichen. Jedes Layout kann eine Kombination aus Textfeldern, Bildern, Wysiwyg-Editoren und anderen Feldtypen sein.

Es ist eine brillante Benutzeroberfläche auf der Clientseite und es ist einfach, ein benutzerdefiniertes Front-End in Ihre Vorlage einzubauen, sobald Sie den Dreh raus haben.

Es ist ein Premium-Plugin, aber ich habe diese Art von Schnittstellen seit vielen Jahren erstellt und es funktioniert wirklich gut. Ich habe nichts Vergleichbares gefunden.

3
Dalton

Es ist einfacher, den visuellen Editor zu codieren, damit Ihre Inhaltseditoren Teile des Post-Inhalts hervorheben können, anstatt zu versuchen, dem Bearbeitungsbildschirm eine große Anzahl zusätzlicher Inhaltsblöcke hinzuzufügen.

Hier ist, was ich benutze, die Grundlagen, von denen ich glaube, dass ich sie vor langer Zeit vom Codex erhalten habe.

// Callback function to insert 'styleselect' into the $buttons array
function wpse241267_mce_buttons_2( $buttons ) {
    array_unshift( $buttons, 'styleselect' );
    return $buttons;
}

add_filter('mce_buttons_2', 'wpse241267_mce_buttons_2');

Dadurch wird nur das Dropdown-Menü "Stil" am linken Ende der zweiten Zeile der Visual Editor-Schaltflächen aktiviert.

Nun zum Fleisch:

function wpse241267_mce_insert_formats( $init_array ) {  

    $style_formats = array(  
        // Each array child is a format with its own settings

        array(  
            'title' => 'Find Us Block',  
            'block' => 'div',  
            'classes' => 'find-us',
            'wrapper' => true,
            'exact' => true,

        ),
    );  

    // Insert the array, JSON ENCODED, into 'style_formats'

    $init_array['style_formats'] = json_encode( $style_formats );  

    return $init_array;  

} 

add_filter( 'tiny_mce_before_init', 'wpse241267_mce_insert_formats' );

Sie können IDs anstelle von Klassen verwenden, wenn Sie möchten, aber ich glaube, es gibt nichts, das einen Benutzer daran hindert, mehr als eine auf einer Seite hinzuzufügen.

Dann können Sie im visuellen Editor einige Inhalte markieren, diesen Stil aus der Dropdown-Liste anwenden und der markierte Inhalt wird von einem divmit der Klasse find-us umgeben.

Das Argument exactverhindert, dass der Editor mehrere benachbarte Blöcke zusammenfügt. Abhängig von Ihrem Fall möchten Sie dies möglicherweise entfernen.

1