[Support request] Using a shortcode for image reference in an element

[Ketil]

Hello. I would like to make a simple interface for logged user to change the bg-image in a header element. The image-reference would be in form of a shortcode, so my question is if there is a way to have the header element read the shortcode instead of changing this is the element. The object would be to not allow the user to change anything in the element itself, but provide a simple interface to change the bg-image.

Ketil

[David]

Hi there,

why not use the Featured Image for the post/page for the Header Elements Background Image?

[Ketil]

I’m making a “one page”-setup for “dummies”, where I use forms and shortcodes for content. Trying to avoid having to explaing how to change elements or edit the page (if I allow them to edit the page, then there is the possibility of them messing up the setup of the one-page design). Preferably I would have used “Landing” from library, but there the top image is part of the content. I don’t want to explain blocks, featured image etc, just lead them trough a form setup, with no frills, pick the image, fill out the text, and then use shortcodes in the block to make up the “one page”-website, using anchors to navigate like “landing” does. Pretty straightforward to set up, except for the image.

[David]

Whats the Form setup ? Are you using ACF or something similar to generate the content / shortcodess ?

[Ketil]

I’m using formidable forms Pro, creating av view for the result that has the form of a shortcode.

[David]

Aah ok – well unfortunately what you’re trying to do is not possible. Shortcodes return their content within the post content, you can’t simply extract one of their attributes/properties that could be used to filter the Header Element background image.

[Ketil]

What if I got the image path from a form-submission, would there be a way to use it for a header-element?
It’s supposed to be a very “low threshold” way for new businesses to manage a “one page”-setup, without editing pages or elements.

[David]

It depends where the URL gets posted. Here for example is a Filter for changing the Hero background image using a custom field:

add_filter( 'generate_page_hero_background_image_url', function( $url ) {
    $background_image = get_field( 'category_featured_image' );

    if ( $background_image ) {
        $url = $background_image;
    }

    return $url;
} );

If you can get whatever variable the form submits you can parse it through that filter.

Or looking at Formidable Forms website its says under: User Submitted Posts & Pages – you can add a Featured Image….

[Author]

Posts