Return String Value in post query loop without or

  • Resolved georgeinmexico

    (@georgeinmexico)


    1 year, 9 months ago

    I am really pleased with this plugin. I’m getting a lot of value from it, and I will likely begin using it on multiple sites and pages.

    When I embed the Meta Field Block inside a gutenberg query loop, it correctly outputs my meta field. (thanks!) My field is a URL value (https://example.com/wp-content/bookcover.jpg).
    I tried using the MFB prefix and suffix to wrap it in html like this:
    prefix: <img src=”
    suffix: “>

    unfortunately, on the front-end everything is wrapped in span tags like this:

    <span class="is-acf-field is-display-inline-block wp-block-mfb-meta-field-block"><span class="prefix">&lt;img class="alignright" src="</span><span class="value">https://example.com/wp-content/uploads/book-cover.png</span><span class="suffix">” width=”180″ height=”290″/&gt;</span></span>

    In the “advanced” section of the block settings, I can choose between Div, Span, paragraph, etc. Is it possible to make one of those options “none”, so that I can add my own markup?
    I have read all of your other support responses for this plugin, and I believe that you could show me how to add code to my theme to do this, but I am not very good with PHP, and am trying to keep all of my work inside the gutenberg editor. It seems like all of the functionality is already built into the plugin, it’s just a question of markup at this point.
    If there is an easier way to do what I’m trying to do, I am very open to that. I’m adding this block to a gutenberg loop on a page that is not using a custom template.

    Thanks!

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author Phi Phan

    (@mr2p)

    Hi @georgeinmexico,

    This block has supported for ACF image field type. You can simply use an image field type for your meta field.

    Phi.

    Thread Starter georgeinmexico

    (@georgeinmexico)

    Wow. Thank you for the quick response. Five stars!

    You know more about this than I do, so forgive me if there is some confusion in my response.

    I am using the ACF image field type. In the ACF admin page, there are three return options for outputting an image.

    Return Format:
Image Array
Image URL
Image ID

    I have been using “Image URL” as the return format for this field. It returns the URL as a string. In other parts of my theme I prefix it with <img src=” and the ACF field populates the uri. “>

    I have looked in the MFB block settings, and I don’t see any settings for images. I see these options:

    Default 'meta'  
ACF - Advanced Custom Fields
Custom field

    I also see Display layout: Auto, inline block, block.
    and in the advanced HTML element, I see the <span> markup.

    Can you advise me the best way to display the ACF image inside my query loop?

    Plugin Author Phi Phan

    (@mr2p)

    @georgeinmexico, You only have to choose the output format as Image ID or Image Array, that’s it. I will update the description for more details later ??

    Thanks, Phi.

    Plugin Author Phi Phan

    (@mr2p)

    Hi @georgeinmexico,

    I’ve just updated the description of the plugin for more details about how to integrate it with ACF. I also add an explanation about the prefix and suffix settings in the FAQ section.

    Thank you for your feedback on this. Please keep reporting issues or giving suggestions to help the plugin grow.

    Thanks, Phi.

    Thread Starter georgeinmexico

    (@georgeinmexico)

    You were right!
    I went into the ACF backend (“Custom Fields”) and changed my image return format to Image ID. Now I see images displayed inside the Gutenberg query loop on my front end. Great plugin!

    You were kind enough to clarify that “The image size is from the Preview Size setting.” I can’t find the preview size setting anywhere. I have been looking under Setting>Media, but it’s not there. My thumbnail size is set to 272×182, but the MFB is outputting 150×150 images. Any advice would be appreciated.

    Plugin Author Phi Phan

    (@mr2p)

    Hi @georgeinmexico,

    There is a setting in the ACF image field that allows you to change the preview size of the image. It’s in the presentation tab.

    Phi.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Return String Value in post query loop without or’ is closed to new replies.