Fernando Souza
Fernando Souza

Reputation: 1779

How to add a custom field to my page header

Is there a way to add a custom field to change the image displayed in my web site's header? I want the same imageto be displayed in every page, so I dont know how to make a general custom field instead of a field specific for each page.

<?php
  $img = the_field('background_url'); 
?>

Upvotes: 0

Views: 5842

Answers (6)

Maulik patel
Maulik patel

Reputation: 2442

if( function_exists('acf_add_options_page') ) {

    acf_add_options_page(array(
        'page_title'    => 'Theme General Settings',
        'menu_title'    => 'Theme Settings',
        'menu_slug'     => 'theme-general-settings',
        'capability'    => 'edit_posts',
        'redirect'      => false
    ));

    acf_add_options_sub_page(array(
        'page_title'    => 'Theme Header Settings',
        'menu_title'    => 'Header',
        'parent_slug'   => 'theme-general-settings',
    ));

    acf_add_options_sub_page(array(
        'page_title'    => 'Theme Footer Settings',
        'menu_title'    => 'Footer',
        'parent_slug'   => 'theme-general-settings',
    ));

}

This code insert in theme function.php and add field in setting page

Upvotes: 0

Krupal Panchal
Krupal Panchal

Reputation: 1545

If you are using ACF Pro then you can create an option page and create Header, Footer fields into that. check the below link.

https://www.advancedcustomfields.com/resources/options-page/

Upvotes: 2

Vimal Usadadiya
Vimal Usadadiya

Reputation: 520

Add Options page for ACF with the help of below code:

if( function_exists('acf_add_options_page') ) {
    acf_add_options_page();
}

and then assign options to acf field. now you can access this common field with <?php the_field('logo', 'option'); ?>

Upvotes: 2

Fernando Souza
Fernando Souza

Reputation: 1779

I found a way after reading ACF documentation, in order to make the custom field's scope global, I have to add the post/page ID on it:

$video_file = get_field('background_video',156);

Upvotes: 1

Govind Soni
Govind Soni

Reputation: 313

Please install ACF plugin and you would easily get the image. While creating an image field there would be an option which name is Return Format, please select any of them and you would get results accordingly.

  • Image Array
  • Image URL
  • Image ID

For further please follow ACF official documentation. AdvancedCustomField

Upvotes: 0

Kradyy
Kradyy

Reputation: 345

I'm assuming that the header image is loaded from the header.php file in your theme?

If you want the same background image on all pages you could set the default header image via the set_theme_mod function. The set_theme_mod is responsible for all modification values for the current theme. In this case you would want to set the header_image property.

Start with setting the default header_image for your theme in your themes functions.php file:

 function theme_setup() {
     set_theme_mod(‘header_image’, ‘http://yoursite.com/wp-content/uploads/yourimage.png’);
 }
 add_action('after_setup_theme', 'theme_setup');

Display the newly set header image in your theme file responsible for displaying your header (assumingly header.php):

 <?php if ( get_header_image() ) : ?>
    <div id="site-header">
        <img alt="" src="<?php header_image(); ?>
    </div>
<?php endif; ?>

If you want to be able to upload custom images from within the Customizer (Appearance > Header) in the wp admin section you could use the custom_header property, you'll find more information about it here:

Theme Handbook: Custom Headers

Upvotes: 1

Related Questions