Add custom background in WordPress theme

custom-background

Add custom background in WordPress theme

Custom background is a WordPress feature that allows you to customize background color/image from backend. Custom background gives your blog to a nice look. You can add default color and image. For enable custom background you have to use this function in your function.php file within themeslug_setup() function.

add_theme_support( 'custom-background' );

After using this you can see the background menu option under appearance menu. Make sure you theme header file have body_class() inside body tag and wp_head(); within the head tag like this:

<body <?php body_class(); ?>>

So whenever you can add background color or image this function can generate a style within head tag and it will override your theme stylesheet. Now let me show you some functions which allows you set up default color and image.



Here is the full code:

$custom_bg = array(
	'default-color'          => '',
	'default-image'          => '',
	'default-repeat'         => '',
	'default-position-x'     => '',
	'default-attachment'     => '',
	'wp-head-callback'       => '_custom_background_cb',
	'admin-head-callback'    => '',
	'admin-preview-callback' => ''
);
add_theme_support( 'custom-background', $custom_bg);

Hope you like this article. We welcomes your question and comments.
Thanks for reading.

30 thoughts on “Add custom background in WordPress theme

  1. hello ..

    Any chance you could explain how to add a background for a page rather than a post?
    Am hoping to add individual images for various pages with opacity set so text is readable …

    thanks

  2. 3
    4
    5
    6
    7
    8
    9
    10
    11
    $custom_bg = array(
    ‘default-color’ => ”,
    ‘default-image’ => ”,
    ‘default-repeat’ => ”,
    ‘default-position-x’ => ”,
    ‘default-attachment’ => ”,
    ‘wp-head-callback’ => ‘_custom_background_cb’,
    ‘admin-head-callback’ => ”,
    ‘admin-preview-callback’ => ”
    );
    add_theme_support( ‘custom-background’, $custom_bg);

  3. I recently came across your blog and have been reading along. I thought I would leave my first comment. I don’t know what to say except that I have enjoyed reading. Nice blog. I will keep visiting this blog very often.

  4. Only you can make this world seem right. Only you can make the darkness bright.
    Only you and you alone. Can thrill me like you do And fill my heart with love for only you. Only you, only you can make this change in me. For it’s true you are my destiny When you hold my hand I understand. The magic that you do You’re my dream come true My one and only you.

  5. Just a smile and the rain is gone Can hardly believe it, yeah. There’s an angel standing next to me. Reaching for my heart Just a smile and there’s no way back .Can hardly believe it, yeah But there’s an angel calling me. Reaching for my heart I know that I’ll be okay now. This time, it’s real I lay my love on you It’s all I wanna do Every time I breathe I feel brand new You open up my heart Show me all your love and walk right through As I lay my love on you.

  6. I recently came across your blog and have been reading along. I thought I would leave my first comment, Thanks for the code. I solved my problem thanks to this pots.

  7. Custom foundation is a WordPress include that enables you to alter foundation shading/picture from backend. Custom foundation gives your blog to a decent look. You can include default shading and picture. For empower custom foundation you need to utilize this capacity in your function.php document inside themeslug_setup() work.

  8. Subsequent to utilizing this you can see the foundation menu alternative under appearance menu. Ensure you subject header document have body_class() inside body tag and wp_head(); inside the head label this way: So at whatever point you can include foundation shading or picture this capacity can create a style inside head tag and it will abrogate your topic template. Presently let me demonstrate to you a few capacities which permits you set up default shading and picture.

Leave a Reply

Your email address will not be published. Required fields are marked *