Rufen Sie Fotogalerie-Bildwerte am Frontend einer WordPress Meta Box ab

Zusammenfassung:

Ich muss meine eigene HTML-Fotogalerie verwenden, um dies zu tun:

• Mir wurde geraten, MetaBox zu verwenden, also habe ich es gefunden und installiert MetaBox.io-Plugin.
• Als nächstes generierte ich eine Erweitertes Bild Code über ihre Website und fügte ihn unter functions.php hinzu, damit der Uploader im Backend angezeigt wird.
• Aber am Front-End habe ich Probleme, die Werte der Bilder abzurufen.

Funktionen.php (MetaBox.io generierter Code):

add_filter( 'rwmb_meta_boxes', 'your_prefix_register_meta_boxes' );

function your_prefix_register_meta_boxes( $meta_boxes ) {
    $prefix = '';

    $meta_boxes[] = [
        'title'   => esc_html__( 'Untitled Field Group', 'online-generator' ),
        'id'      => 'untitled',
        'context' => 'normal',
        'fields'  => [
            [
                'type'             => 'image_advanced',
                'name'             => esc_html__( 'Image Advanced', 'online-generator' ),
                'id'               => $prefix . 'image_advanced_8hswqfsoqai',
                'max_file_uploads' => 40,
            ],
        ],
    ];

    return $meta_boxes;
}

CMS:

Hier ist das Ergebnis bei CMS. Ein neues Bildfeld wird erstellt. CMS-Teil ist fertig:

Frontend:

Dann habe ich diesen Code von MetaBox.io geholt und in index.php abgelegt aber es druckt nichts:

<?php
$images = rwmb_meta( $field_id, array( 'size' => 'thumbnail' ) );
foreach ( $images as $image ) {
    echo '<a href="'.$image['full_url'].'"><img src="'.$image['url'].'"></a>';
}
?>

Meine Fragen sind:

1. Wie zeige ich die Werte der MetaBox.io-Plugin-Bilder am Frontend (in meinem eigenen HTML) an? Ich brauche sie wie folgt:

<div class="col-lg-6 img-grids mt-lg-0 mt-5 pl-lg-4">
    <img src="<?php%20echo%20get_template_directory_uri().'/assets/images/p1.jpg';%20?>" alt="" class="img-fluid radius-image" />
    <img src="<?php%20echo%20get_template_directory_uri().'/assets/images/p2.jpg';%20?>" alt="" class="img-fluid radius-image" />
</div>

2. Wie kann ich benutzerdefinierte Felder zu Bildern der WordPress-Mediengalerie hinzufügen (z. B. Überschrift, Unterüberschrift, Untertitel, Fotograf) und wie kann ich diese Werte für jede Bildfolie am Frontend abrufen?
   

danke, dass Sie meinem Rat gefolgt sind. Also hier sind wir

$images = rwmb_meta ($field_id, array ('size' => 'thumbnail'));

Wir haben den Betrag, den unsere Galerie erhält.

Verwenden Sie gemäß den obigen Codes diesen Code innerhalb der Seitenvorlagendatei oder innerhalb der Schleife.

<div class="col-lg-6 img-grids mt-lg-0 mt-5 pl-lg-4">

<?php

$untitled_meta = rwmb_meta('image_advanced_8hswqfsoqai' , '' , get_the_ID());

foreach ($untitled_meta as $image) {
    ?>

    <img src="<?=%20$image['full_url']%20//%20Or%20Use%20url%20for%20crop%20size%20%20?>" alt="<?= $image['alt'] ?>"
         class="img-fluid radius-image"/>

    <?php
}
?>

Das rwmb_meta Die Funktion hat drei Argumente.

1. Der erste Wert unserer Feld-ID, der gemäß Ihrer Codestruktur gefielded wird: image_advanced_8hswqfsoqai
2. Und lassen Sie den nächsten Wert leer, um alle zu erhalten.
3. Und der letzte Parameter ist die Seiten-ID oder der Beitrag, den ich mit bekommen habe
   get_the_ID() ID der Seite, auf der wir uns gerade befinden.

Um die Seite gemäß Ihrer vorherigen Frage auf dieser Seite zu optimieren und zu verwenden, schreibe ich den folgenden Code und füge ihn bitte ein (natürlich, wenn Sie mit der Seitenvorlage arbeiten möchten)

Schritt 1: Fügen Sie eine Funktion hinzu, um die Meta-Box auf der Seite zu erstellen und zu posten

Geben Sie diesen Code in die functions.php Datei, wie Sie sie kennen

add_filter( 'rwmb_meta_boxes', 'compliance_students_gallery_meta_boxes' );

function compliance_students_gallery_meta_boxes( $meta_boxes ) {

    $meta_boxes[] = [
        'title'   => esc_html__( 'Untitled Field Group', 'online-generator' ),
        'id'      => 'untitled',
        'context' => 'normal',
        'post_types' => ['post', 'page'],
        'fields'  => [
            [
                'type'             => 'image_advanced',
                'name'             => esc_html__( 'Image Advanced', 'online-generator' ),
                'id'               => 'images_untitled',
                'max_file_uploads' => 40,
            ],
        ],
    ];

    return $meta_boxes;
}

Jetzt können Sie sowohl der Seite als auch dem Beitrag eine Bildergalerie hinzufügen

Schritt 2: Zeigen Sie in der Seitenvorlage dieselbe Datei an, die diese enthält Template Name: students Dies gilt natürlich nur für Sie, die die entsprechende Frage an anderer Stelle gestellt haben (diese Seite).

<div class="col-lg-6 img-grids mt-lg-0 mt-5 pl-lg-4">

    <?php

    $untitled_meta = rwmb_meta('image_advanced_8hswqfsoqai' , '' , get_the_ID());

    foreach ($untitled_meta as $image) {
        ?>

        <img src="<?=%20$image['full_url']%20//%20Or%20Use%20url%20for%20crop%20size%20%20?>" alt="<?= $image['alt'] ?>"
             class="img-fluid radius-image"/>

        <?php
    }
    ?>
</div>

Wichtiger Hinweis

Dies sollte der Fall sein, wenn Sie innerhalb des Kreises oder der Hauptseite oder innerhalb der Beiträge anzeigen möchten.

Um die Bildmenge oder eine andere Flüssigkeit anzuzeigen, müssen Sie sie in der WordPress-Abfrage verwenden.

Beispiel für die Verwendung in einer WordPress-Abfrageschleife

<?php

$query = new WP_Query($args);
if ($query->have_posts()) {
    // some code here if you want.
    while ($query->have_posts()) {
        $query->the_post();
        ?>
        <div class="col-lg-6 img-grids mt-lg-0 mt-5 pl-lg-4">

            <?php

            $untitled_meta = rwmb_meta('image_advanced_8hswqfsoqai', '', get_the_ID());

            foreach ($untitled_meta as $image) {
                ?>
                <img src="<?=%20$image['full_url']%20//%20Or%20Use%20url%20for%20crop%20size%20%20%20?>" alt="<?= $image['alt'] ?>"
                     class="img-fluid radius-image"/>
                <?php
            }
            ?>
        </div>
        <?php
    }
}
?>