suchen

Heim  >  Fragen und Antworten  >  Hauptteil

ACF – Anzeige mehrerer Repeater-Bilder

Mein oberstes Ziel ist es, eine Bildergalerie zu erstellen, die mit einem Klick auf eine externe Website verlinkt. Dies muss über erweiterte benutzerdefinierte Felder erfolgen, daher habe ich einen Repeater mit dem Bild und dem Link in derselben Zeile erstellt:

link1 | cover_image1 
link2 | cover_image2

Jetzt füge ich diesen Code in einen Texteditor innerhalb der Webseite ein. Ich habe auch einige Shortcodes von hier importiert, die es mir ermöglichen, %ROW% als Iterator zu verwenden.

„attachments“ ist die übergeordnete Weiterleitung, „link“ und „cover_image“ sind untergeordnete Weiterleitungen.

[acf_repeater field="attachments"]

external url = [acf field ='attachments_%ROW%_link']
image url = [acf field ='attachments_%ROW%_cover_image'] 

<a href =[acf field ='attachments_%ROW%_link'] >
<img src = [acf field ='attachments_%ROW%_cover_image'] width="300" height="214" />
</a>

[/acf_repeater]

Die Webseite wird wie folgt dargestellt:

Das beschädigte Bild enthält den folgenden Code:

<img src="[acf" field="attachments_0_cover_image" &#093;="" width="300" height="214">

Ich denke, dass das [acf field ='attachments_%ROW%_cover_image'] in <img> nicht vollständig auf die URL analysiert wird, da sowohl die externe URL = als auch die Bild-URL = die korrekte URL rendern.

Wordpress konvertiert meinen Code nach dem Speichern auch in diesen Code. Vielleicht handelt es sich also um einen Syntaxfehler?

[acf_repeater field="attachments"]

external url = [acf field = attachments_%ROW%_link]
image url = [acf field = attachments_%ROW%_cover_image]

<a href="[acf">
<img src="[acf" width="300" height="214" />
</a>

[/acf_repeater]

Ich bin mir nicht sicher, wie man [acf field ='attachments_%ROW%_cover_image'] richtig in eine URL konvertiert <img>, ich könnte etwas Hilfe bei der richtigen Syntax gebrauchen. Ich danke Ihnen für Ihre Hilfe!

html für jedes arianische Attribut:

<div class="fl-module fl-module-rich-text fl-node-5d4926759d7aa" 

data-node="5d4926759d7aa">
    <div class="fl-module-content fl-node-content">
        <div class="fl-rich-text">
    <p>Agenda: <a href="https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/cute-cat-photos-1593441022.jpg?crop=0.669xw:1.00xh;0.166xw,0&amp;resize=640:*">https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/cute-cat-photos-1593441022.jpg?crop=0.669xw:1.00xh;0.166xw,0&amp;resize=640:*</a></p>
<p>Video Links: <a href="https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/cute-cat-photos-1593441022.jpg?crop=0.669xw:1.00xh;0.166xw,0&amp;resize=640:*"></a></p>
<p>Thumbnails: <a href=""></a></p>
<p></p>
<p>external url = https://www.youtube.com/watch?v=uHKfrz65KSU<br>
image url = http://wordpress.local/wp-content/uploads/Thumbnail_1.png</p>
<p><a href="[acf" field="attachments_0_link" &#093;=""><br>
<img src="[acf" field="attachments_0_cover_image" &#093;="" width="300" height="214"><br>
</a></p>
<p><br></p>
<p>external url = https://www.youtube.com/watch?v=X2lIovmNsUY<br>
image url = http://wordpress.local/wp-content/uploads/Thumbnail_2-1.png</p>
<p><a href="[acf" field="attachments_1_link" &#093;=""><br>
<img src="[acf" field="attachments_1_cover_image" &#093;="" width="300" height="214"><br>
</a></p>
<p><br></p>
<p>external url = https://www.youtube.com/watch?v=hDJkFLnmFHU<br>
image url = http://wordpress.local/wp-content/uploads/Thumbnail_3-1.png</p>
<p><a href="[acf" field="attachments_2_link" &#093;=""><br>
<img src="[acf" field="attachments_2_cover_image" &#093;="" width="300" height="214"><br>
</a></p>
<p><br></p>
</div>
    </div>
</div>

P粉885562567P粉885562567273 Tage vor490

Antworte allen(1)Ich werde antworten

  • P粉842215006

    P粉8422150062024-03-27 20:00:18

    不是 WordPress 人员,但似乎 WordPress 会阻止使用 html 属性中的参数扩展/执行短代码,如果您可以将 php 代码放在那里,也许这可以作为解决方法:

    
    
    
    
    

    实际上我发现了对此的评论:

    此处

    所以这也可能有效:

    
    
    

    或者没有短代码引号:

    
    
    

    我能想到的最后一个选择是创建无参数的短代码,如下所示:

    function acflink_shortcode() {
        return do_shortcode("[acf field ='attachments_%ROW%_link']");
    }
    add_shortcode('acflink', 'acflink_shortcode');
    
    function acfimage_shortcode() {
        return do_shortcode("[acf field ='attachments_%ROW%_cover_image']");
    }
    add_shortcode('acfimage', 'acfimage_shortcode');

    然后在编辑器中使用,例如:

    
    
    

    Antwort
    0
  • StornierenAntwort