Add Field to before_widget in functions.php

• toad78

• June 15, 2016 at 3:38 am

I’ve created a Custom Field that users can assign an image to a widget (Widget Blocks).

In the template, I’m using (front-page.php): I have this set up:

<?php
get_header(); ?>

            <?php
                $backgroundimage = get_field('widget_background_image');
			?>

					<?php if ( is_active_sidebar( 'page-widget' ) ) : ?>
					  <?php dynamic_sidebar( 'page-widget' ); ?>
                    <?php endif; ?>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

In the functions, I figured I could just use the following to post the image assigned to the widget like so:

	register_sidebar( array(
		'name'          => __( 'Widgets', 'tempestcorp' ),
		'id'            => 'page-widget',
		'description'   => __( 'Appears on any of the assigned pages.', 'tempestcorp' ),
		'before_widget' => '<section id="%1$s" class="widget %2$s"><div style="background-image: url('<?php echo $backgroundimage['url']; ?>');">',
		'after_widget'  => '</div></section>',
		'before_title'  => '<h2 class="widget-title">',
		'after_title'   => '</h2>',
	) );

But I’m receiving an error: “Parse error: syntax error, unexpected ‘url’ (T_STRING), expecting ‘)’ ….”

The Custom Field is created with the following settings:
“Field Type: Image”
“Return Value: Image URL”

How can I fix the functions.php file to post the background image URL?

• James

• June 15, 2016 at 1:38 pm

Hi @toad78

The issue is because you were trying to echo a variable inside a string. Also, if you want to use a custom field in the functions.php file, you need to get it in that file too. It should be something like this:

$backgroundimage = get_field('widget_background_image', 99);

register_sidebar( array(
    'name'          => __( 'Widgets', 'tempestcorp' ),
    'id'            => 'page-widget',
    'description'   => __( 'Appears on any of the assigned pages.', 'tempestcorp' ),
    'before_widget' => '<section id="%1$s" class="widget %2$s"><div style="background-image: url(' . $backgroundimage['url']; . ');">',
    'after_widget'  => '</div></section>',
    'before_title'  => '<h2 class="widget-title">',
    'after_title'   => '</h2>',
) );

Where ’99’ is the object ID where the custom fields are located.

If you have the time, please check PHP tutorials here: http://www.w3schools.com/php/.

Thanks 🙂

• toad78

• June 21, 2016 at 5:00 am

Thank you, James.

Taking your advice, I’m experiencing this error:

Parse error: syntax error, unexpected ';', expecting ')' in /home/tempestus/public_html/wp-content/themes/xxxxxx/functions.php on line 137

My code (line 137 is the ‘before_widget’ code):

$backgroundimage = get_field('widget_background_image');

	register_sidebar( array(
		'name'          => __( 'Widgets', 'tempestcorp' ),
		'id'            => 'page-widget',
		'description'   => __( 'Appears on any of the assigned pages.', 'tempestcorp' ),
		'before_widget' => '<section id="%1$s" class="widget %2$s"><div style="background-image: url(' . $backgroundimage['url']; . ');">',
		'after_widget'  => '</div></section>',
		'before_title'  => '<h2 class="widget-title">',
		'after_title'   => '</h2>',
	) );

• James

• June 21, 2016 at 12:40 pm

Hi @toad78

I think I made a mistake there. The code in a string shouldn’t have semicolon which will mark it as the end of the line. So it should be $backgroundimage['url'] instead of $backgroundimage['url'];. Could you please try this one:

$backgroundimage = get_field('widget_background_image');

	register_sidebar( array(
		'name'          => __( 'Widgets', 'tempestcorp' ),
		'id'            => 'page-widget',
		'description'   => __( 'Appears on any of the assigned pages.', 'tempestcorp' ),
		'before_widget' => '<section id="%1$s" class="widget %2$s"><div style="background-image: url(' . $backgroundimage['url'] . ');">',
		'after_widget'  => '</div></section>',
		'before_title'  => '<h2 class="widget-title">',
		'after_title'   => '</h2>',
	) );

Thanks 🙂

• toad78

• June 23, 2016 at 12:54 am

Great! The error went away, but now the Custom field I created will not show in the widget editor.

Shall I post in another forum section?

• toad78

• June 23, 2016 at 1:11 am

I see the problem: for some reason the Custom field was set to ‘disabled’.

Thank you for your help, James.

• toad78

• June 25, 2016 at 7:10 am

Well shortly after I posted above, there is not custom field posting. It’s just a broken URL. I’ve attached a series of images I hope someone can understand why this isn’t working.

code to post independent of functions: this code is within a ‘front-page.php’ template. No different than these instructions: https://www.advancedcustomfields.com/resources/image/ and code examples https://www.advancedcustomfields.com/resources/code-examples/

code in functions: the code you provided above

custom-field: the custom field’s settings.

code-to-post....png

code-in-func....png

Widget-1.png.png

custom-field....png

• James

• June 26, 2016 at 12:06 am

This reply has been marked as private.

• toad78

• June 30, 2016 at 8:05 am

Well I guess I’m not sure what to do now since I can’t get this to work.

• toad78

• June 30, 2016 at 8:49 am

Okay, so I’ve decided to try a different tactic and am still not getting the background image to appear in the widget.

$backgroundimage = get_field('widget_background_image', 'widget_' . $widget_id);

	register_sidebar( array(
		'name'          => __( 'Widgets', 'tempestcorp' ),
		'id'            => 'page-widget',
		'description'   => __( 'Appears on any of the assigned pages.', 'tempestcorp' ),
		'before_widget' => '<section id="%1$s" class="widget %2$s" style="background-image: url(' . $backgroundimage['url'] . ');">',
		'after_widget'  => '</section>',
		'before_title'  => '<h2 class="widget-title">',
		'after_title'   => '</h2>',
	) );

Location Rule:
Widget = Widget Block Widget

Inside the widget (Capture.PNG). But still no image. I am left with (Capture2.PNG).

On top of that, the <section id=””> is stripped.

Capture.png.png

Capture2.png.png

• James

• June 30, 2016 at 11:42 am

Hi @toad78

Could you please make sure that the $widget_id has the right value? Could you please test it by specifying the widget ID manually like this:

$backgroundimage = get_field('widget_background_image', 'widget_widget-name-99');

Please change the ‘widget-name-99’ with your widget ID.

Thanks 🙂

• toad78

• July 1, 2016 at 7:53 am

Warning: Illegal string offset ‘url’ in /home/…/public_html/…/…/…/wp-content/themes/…/functions.php on line 143

$backgroundimage = get_field('widget_background_image', 'widget_wysiwyg_widgets_widget-11');

	register_sidebar( array(
		'name'          => __( 'Widgets', 'tempestcorp' ),
		'id'            => 'page-widget',
		'description'   => __( 'Appears on any of the assigned pages.', 'tempestcorp' ),
		'before_widget' => '<section id="%1$s" class="widget %2$s" style="background-image: url(' . $backgroundimage['url'] . ');">',
		'after_widget'  => '</section>',
		'before_title'  => '<h2 class="widget-title">',
		'after_title'   => '</h2>',
	) );

Capture.png.png

widget-id.pn....png

• James

• July 1, 2016 at 1:16 pm

Hi @toad78

It seems that the value is returned as a wrong format. Did you set the “Return Value” to any other than “Image Array”? Could you please var_dump() the value like this:

var_dump( get_field('widget_background_image', 'widget_wysiwyg_widgets_widget-11') );

Thanks 🙂

• toad78

• July 9, 2016 at 4:24 am

I’ll look into it and get back to you.

• toad78

• November 5, 2016 at 3:42 am

James,

I’m still struggling with this type of issue and am attempting it again. The content posts but not the image still.

Here is my info.

functions.php:

$backgroundimage = get_field('widget_background_image', 'text-2');
	
	register_sidebar( array(
		'name'          => __( 'Content Bottom 1', 'dvkap' ),
		'id'            => 'content-bottom',
		'description'   => __( 'Appears at the bottom of the content on posts and pages.', 'dvkap' ),
		'before_widget' => '<section id="%1$s" class="widget %2$s" style="background-image: url(' . $backgroundimage['url'] . ');">',
		'after_widget'  => '</section>',
		'before_title'  => '<h2 class="widget-title">',
		'after_title'   => '</h2>',
	) );

template code:

<?php
 if ( is_active_sidebar( 'content-bottom' ) ): ?> 
		<?php dynamic_sidebar( 'content-bottom' ); ?>
<?php endif;?>

Custom field settings (cfsettings.jpg)

Widget screenshot (widget.jpg)

widget.jpg.jpg

cfsettings.j....jpg

• James

• November 7, 2016 at 1:29 pm

Hi @toad78

Could you please debug the returned value? Also please keep in mind that you need to add the “widget_” prefix to the widget ID if you want to get data from a widget. This page should give you more idea about it: https://www.advancedcustomfields.com/resources/get-values-widget/.

So, it should be something like this:

$backgroundimage = get_field('widget_background_image', 'widget_text-2');

And the debug code should be like this:

var_dump( get_field('widget_background_image','widget_text-2') );

Thanks 🙂

• toad78

• November 15, 2016 at 5:06 am

I’ll try this and get back to you when I return on the project.