WordPress Plugin: MetaBackground

Mein zweites Plugin. Nicht wirklich aufregend, es gibt auch sicher andere Plugins die genau das selbe machen, aber irgendwer brauchte es. 

Wenn Du einem Beitrag einen eigenen Hintergrund verpassen willst, kannst Du dies nun einfach tun, indem Du ein Benutzerdefiniertes Feld namens BGIMAGE erstellst und den absoluten Link zu der gewünschten Datei als Wert einträgst. Um das Hintergrundbild mit CSS-Befehlen zu positionieren, erstelle einfach ein weiteres Benutzerdefiniertes Feld namens BGIMAGECSS und schreibe dort die CSS Befehle hinein. Beispiel „no-repeat top left“ oder „no-repeat fixed center“


Download MetaBackGround 


Hochladen, aktivieren.

Benutzerdefiniertes Feld namens BGIMAGE erstellen und den Link zum Bild eintragen.


März 07, 2009 – Version 1.1

  • CSS-Optionen hinzugefügt.

Jänner 17, 2009 – Version 1.0

  • Veröffentlichung von MetaBackGround

August 20, 2008 – Version 0.01

  • Plugin erfunden, für jemanden aus dem WordPress Support Forum

Gefällt es?

Dann würde ich mich über eine Email, einen Kommentar (hier) oder über eine Spende freuen



My second plugin. Not really a lot of work, probably there are others out there, but this is quick and dirty and gets the job done.

If you want do specify per-post or per-page background images, you’ll want this. Just add a custom field called BGIMAGE to your post or page with the absolute link to your image, and you’re set. Use BGIMAGECSS to modify the styling, like  Beispiel „no-repeat top left“ or „no-repeat fixed center“


Download MetaBackGround (right-click, then save target as php)


Upload to your plugins directory, then activate.Write/Edit posts or Pages and add a custom field called „BGIMAGE“, and in the value field enter the absolute path to your background image.


March 07, 2009 – Version 1.1

  • Added CSS options

January 17, 2009 – Version 1.0

  • publish MetaBackGround, released it to the world


August 20, 2008 – Version 0.01

  • Write the plugin for someone from WordPress’s support forum

Like it?

Then write me an email or post a comment and tell me so, or [donate]


23 Gedanken zu „WordPress Plugin: MetaBackground

  1. Here are some test results for v 0.0.1 using a variety of themes.

    Default – no image displays in home or about
    Classic – image displays in home and about
    HemingwayEX – images displays in what appears to be the footer only
    NinjaMonkeys 0.20 – images displays in what appears to be the footer only

    I’ve left HemingwayEX active so the result can be seen. Thank you so much for putting your time into this mores.

  2. On your site there are a bunch of layers that have white backgrounds specified … so they cover up the body background.
    Get rid of the background definitions for those layers to make the body background visible.

  3. Congrats on the release of 1.0!

    I don’t know what changes were made but it appears that 1.0 broke the earlier install of the plug-in on all the pages I used it on.

    Do you have any suggestions on how to go about correcting it? Thanks again and happy birthday to your wife.

  4. hmmm, that must be because the background image repeats by default. I think I should add some options to account for that.

    And I also did’t actually change anything. I just added a readme and released it.
    Did you do some customizing?

  5. Hallo Mores!

    First of all, thanks for your plugin, it was exactly what I was looking for.
    But as always, we need to customize, I´m absolute new to php, css and so on, but I was able to modifie everything I wanted ´till now.
    My question is: can I set the position of the background (top center) and no-repeat?

    the site is here: http://www.grandtour.at

    the page in question is the splash page.

    Ich danke schon im voraus!

  6. Yes, not a problem.
    Open the file metabackground.php and edit the 3rd-to-last line, the one that contains

    {background: url(‚“.$BGIMAGE.“‚);}

    Change it to

    {background: url(‚“.$BGIMAGE.“‚) no-repeat top center;}

    I left out the other codes because they would get removed from this entry.
    Nice site, by the way.

    Never mind. Download the updated version and add a new custom field called BGIMAGECSS and give it the value „no-repeat top center“.

  7. Hi there,
    I really appreciate all of the work you have put into this plugin. Though, so far I have not been able to get it to work for my group’s website. I was wondering if you could take a look for me, or if you have any ideas why. Any help you could offer would be appreciated. Thanks Daniel!

  8. The way the background is defined for your #primary DIV is faulty.
    #primary{background: url(’”.http://www.ryyo.org/wordpress/wp-content/uploads/2009/04/images/yogathon.jpg.”‘) no-repeat top center;}
    Notice the single quote, then double quote, then the dot, then the actual image file, then the excess dot and single quote at the end.
    I’m sure you modified the plugin to suit your needs (which is fine, by the way), and I think you might have botched it up somehow 🙂
    Line #22 should be, in your case,
    echo "\n\n#primary{background: url('".$BGIMAGE."') ".$BGIMAGECSS.";}\n\n";
    Oh, and make sure when you copy/paste that you convert any quotes, single or double, from curly (“) to normal („). I think that might be the main problem.

  9. Did you check and make sure all the single and double quotes are straight and not curly?

    Let me send you an edited version by email.

  10. uhm, no, that is not possible, since the style definition is not being handled by the stylesheet (which is in your theme’s directory, where you could use relative links) but rather in the header of the page you’re looking at, and that depends on your permalinks etc.
    What you could do is edit the plugin to go into a certain directory by default and look for a file with the filename you specify. Edit

    echo "\n\nbody{background: url('".$BGIMAGE."') ".$BGIMAGECSS.";}\n\n";

    and change it to

    echo "\n\nbody{background: url('http://www.yourdomain.com/wp-content/themes/your-theme/images/".$BGIMAGE."') ".$BGIMAGECSS.";}\n\n";

  11. Hi there, this looks like an ideal solution to what I want to do.

    I need to apply the background image to the wrapper div in my theme (rather than the page background. Any ideas how I can edit this plugin to do that?

  12. open up the metabackground.php file and edit the 22nd line. Instead of \nbody{background ... use \nwrapper-div-name{background...
    Note: the \n inserts a line break upon execution time. Make sure you either leave it in there as „\n“, or remove it altogether.

  13. I was in the process of guessing that when you responded. Thanks for the speedy reply.
    I changed line 22 to:

    echo "\n#wrapper {width: 1000px; margin: 12px auto 20px auto; padding: 0px; background-image:url('".$BGIMAGE."'); background-attachment:inherit; background-repeat:no-repeat;}\n";

    Doesn’t use your CSS custom field anymore, but it does what I need it to do. Thank you.

  14. Congrats on the update to include CSS. I upgraded this morning and realized I still needed to apply a fix to the code because of my theme (HemingwayEx 1.1 by Nalin Makar).

    I had to change the following, on line 22, for the background images to appear properly. If I left the code as is the images were pushed to the back. Hopefully this helps as you continue to improve a great plugin.



  15. Gary, this is just rudimentary CSS I’m using. If a theme relies on layers with background images/colors that hover above the body, then of course the image will be invisible. I can’t know what theme people are using. But thanks for the code, I’m sure others will find it helpful.

    As to the spacing/borders … use normal CSS.
    For example, you could put in the BGIMAGECSS field no-repeat 20px 100px to make it not repeat and be positioned 20px from the left border and 100px from the top. Remember, if you want to position it with pixel values make sure to use no-repeat.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.