2

I'm adding some custom code to dynamically display Social Network icons in a Wordpress theme, by using the Customize API.

The only problem that prevents it to work as expected is that I need to find a way to access an array variable from another file, not only from the one where it is declared.


First, I've added some code to functions.php, to create some text fields in the Theme Customizer, as follows:

function my_customizer_options($wp_customize) {

    // Section
    $wp_customize -> add_section ( 'my_social', array(
        'title' => __('Social', 'my-theme'),
        'description' => __('Social Network profiles', 'my-theme'),
        'priority' => 20,
        )
    );

    // Social Networks list
    $socialnetworks = array(
        // Social Network => Icon Name
        'facebook' => 'fa-facebook-f',
        'linkedin' => 'fa-linkedin-in',
        'instagram' => 'fa-instagram',
        'twitter' => 'fa-twitter',
    );

    // Settings and controls
    foreach ($socialnetworks as $key => $value) {

        $wp_customize -> add_setting ( $key, array( 'default' => '' ) );
        $wp_customize -> add_control ( $key, array(
            'type' => 'url',
            'label' => __(ucfirst($key), 'my-theme'),
            'section' => 'my_social',
        ));

}

add_action( 'customize_register', 'my_customizer_options' );

This lets me add items to the $socialnetworks array at will, and automatically generates the code required to add settings and controls, without having to do it manually by writing down the same bits of code again and again. I.e., if I need to add more fields for more social networks, I can simply add entries to the $socialnetworks array without duplicating the whole // Settings and controls code.

Until now, it works perfectly, I now have four text fields in the customizer where I can insert URLs of social network profiles. Now I need to access these values from inside the theme template files.


This is the portion of my header.php file where I want to display the icons that link to the respective Social Network profiles:

/*
// Social Networks list
$socialnetworks = array(
    // Social Network => Icon Name
    'facebook' => 'fa-facebook-f',
    'linkedin' => 'fa-linkedin-in',
    'instagram' => 'fa-instagram',
    'twitter' => 'fa-twitter',
);
*/

// Social Icon

foreach ($my_socialnetworks as $key => $value) {

    if ( get_theme_mod($key, '')) { ?>

        <a href="<?php echo get_theme_mod($key, '') ?>" target="_blank"><i class="fab <?php echo $value ?>"></i></a>

    <?php };

}

This is supposed to retrieve the values inserted in the Customizer with the get_theme_mod() WP builtin functions, and dinamically add the icons and relative links for each inserted URL.

The problem is that in order to make it work, I need to uncomment the $socialnetworks array, and basically redefine it also from inside header.php, while I want instead to access it from functions.php.

A possible problem could be that $socialnetworks is defined inside the my_customizer_options() function; I tried to move it outside, before the function itself, but in this way it even breaks the code in functions.php without solving anything.

I need the correct place and the correct way to define $socialnetworks once and being able to access it from any file of my theme, how should I modify my code in order to achieve this?

4
  • What exactly breaks when you move $socialnetworks outside of the function? Commented Aug 19, 2019 at 13:52
  • @Kaddath The text fields in the Customizer are not created, // Settings and controls section doesn't seem to be executed properly. Commented Aug 19, 2019 at 13:55
  • 3
    Make it a function that returns the array. Then call it accordingly. Commented Aug 19, 2019 at 13:58
  • 1
    @dazed-and-confused thank you, I put it in a function and now it works, I can call it from anywhere. It was probably obvious... :) Commented Aug 19, 2019 at 14:18

1 Answer 1

3

As suggested by an user in the comments, I put the array in a function, now I can access the array from anywhere by calling the function. Here is the modified code:

In my functions.php:

// Social Networks list
function my_socialnetworks() {
    $socialnetworks = array(
        // Social Network => Icon Name
        'facebook' => 'fa-facebook-f',
        'linkedin' => 'fa-linkedin-in',
        'instagram' => 'fa-instagram',
        'twitter' => 'fa-twitter',
    );
    return $socialnetworks;
}

function my_customizer_options($wp_customize) {

    // Section
    $wp_customize -> add_section ( 'my_social', array(
        'title' => __('Social', 'my-theme'),
        'description' => __('Social Network profiles', 'my-theme'),
        'priority' => 20,
        )
    );

    $my_socialnetworks = my_socialnetworks();

    // Settings and controls
    foreach ($socialnetworks as $key => $value) {

        $wp_customize -> add_setting ( $key, array( 'default' => '' ) );
        $wp_customize -> add_control ( $key, array(
            'type' => 'url',
            'label' => __(ucfirst($key), 'my-theme'),
            'section' => 'my_social',
        ));

}

add_action( 'customize_register', 'my_customizer_options' );

In my header.php:

$my_socialnetworks = my_socialnetworks();

// Social Icon

foreach ($my_socialnetworks as $key => $value) {

    if ( get_theme_mod($key, '')) { ?>

        <a href="<?php echo get_theme_mod($key, '') ?>" target="_blank"><i class="fab <?php echo $value ?>"></i></a>

    <?php };

}
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.