WP Background Tile Plugin

Date: 3rd February 2009 at 12:47 am | Filed under: plugins, wordpress | Author: Sam Burdge | Tags: , , , ,

The WP Background Tile Plugin for WordPress applies a tiled background image to your blog.  It is as simple as this:

  • Create a background image
  • Upload it
  • Apply it as the background via the WP Background Tile options page

Applying a repeat pattern to the background of a webpage is easily done using css:

body {background-image: url(example.jpg);}

However, if you're not into writing code, or don't know where to insert the css into your wordpress theme, then you will find this plugin much easier. It can also be an easy way of testing out lots of background images before deciding on one you are happy with.

INSTALLATION:

  1. Download the plugin from the link at the bottom of this page
  2. Upload the wp-background-tile folder to your wp-content/plugins folder.
  3. Activate the plugin from the Plugins page in WordPress.

USAGE:

  1. Upload your background image via 'Media => Add New' in Wordpress (or via FTP)
  2. Go to 'Settings => WP Background Tile' in WordPress
  3. Paste or type in the URL of your background image (explained in more detail below)
  4. Press 'Submit'

CREATING A BACKGROUND TILE:

A background tile is an image which is repeated in both directions over the background of a webpage. Look closely at the background of my site and you will notice the green background is not a matte colour, but a subtle texture. Right click on the background of my site and choose 'View Background Image' (Firefox) or 'Save Background As' (IE) and have a look at the image. You will notice that it is small (16 x 16 pixels), as you don't need much of the pattern to make it tile. Stripes and other geometric patterns can work well for a subtle effect.

Tip: Check out the free online Stripe Generator tool, it's a really easy way to create striped background tiles.

Background tiles can also be used for larger images such as a logo repeat. An example of this is www.mrdupes.com. To achieve this type of result using photoshop the 'offset' filter can be very useful.

GETTING THE URL OF A FILE YOU HAVE UPLOADED WITH WORDPRESS:

  1. Go to 'Posts => Add New'
  2. Click on the 'Add Media' button (a little star type icon next to 'Upload/Insert')
  3. Click on the 'Media Library' tab
  4. Click on the word 'Show' next to the file you want the url for
  5. Under 'Link URL' click on the button 'File URL'
  6. The file url should now be in the 'Link URL' text box so you can copy it.

DOWNLOAD PLUGIN:


17 Responses to “WP Background Tile Plugin”

  • Comment by pressitfor.me
    Date: February 3rd, 2009 at 4:25 am

    WP Background Tile Plugin | Sam Burdge…

    The WP Background Tile Plugin for WordPress applies a tiled background image to your blog. It is as simple as this:

    * Create a background image
    * Upload it
    * Apply it as the background via the WP Background Tile options page

    Get the plug…

  • Comment by baron
    Date: February 3rd, 2009 at 4:57 pm

    hi. Thanks for plugin

    perfect.

    Regards

  • Comment by WordPress Plugin Releases for 02/04 | Weblog Tools Collection
    Date: February 4th, 2009 at 3:18 pm

    [...] WP Background Tile [...]

  • Comment by Satranç
    Date: February 4th, 2009 at 6:32 pm

    Hi,
    This is a nice idea. Thanks for plugin.
    But I want to ask a question.
    Why did you create a table? Can we save tha background image as an option?
    Thanks.

  • Comment by WordPress Plugin Releases for 02/04 | MBConsulting.se
    Date: February 11th, 2009 at 7:17 pm

    [...] WP Background Tile [...]

  • Comment by beauty blog
    Date: February 19th, 2009 at 2:14 pm

    can you make a plugin like this to show post in a magazine like layout.

    http://perishablepress.com/press/2008/08/04/two-column-horizontal-sequence-wordpress-post-order/

  • Comment by Sam Burdge
    Date: February 19th, 2009 at 2:31 pm

    Hi beauty blog,

    I have a plugin which does exactly that! Here’s the link:

    http://www.samburdge.co.uk/wordpress/wp-post-columns-plugin-2

  • Comment by dogday
    Date: March 4th, 2009 at 6:19 pm

    I have this nice plugin running in my blog, but it isnt XHTML compliant, I think because of the ‘&’ signs used to pass varibles.

    Could you replace ‘&’ signs with ‘&’ to correct this?.

    I have tried, but my knoledge about php isnt enought to find where is called the function.

    Thanks in advance.

  • Comment by Sam Burdge
    Date: March 5th, 2009 at 2:03 pm

    Hi dogday
    The plugin doesn’t use any & symbol, this error must be coming from your theme! Also, if your theme already uses a background image then the plugin may not work.
    Sam

  • Comment by technofunk
    Date: March 12th, 2009 at 12:33 am

    great plugin.

    one question; what if i dont want this tiled? just a single image. non repeating.

  • Comment by Charles
    Date: September 21st, 2009 at 12:15 am

    Hi,

    I tried it on my site (see comment header) and it tiled only the upper half of the page. I have WP 2.7.1. on that particular site.

    Is this a bug or am I doing something wrong?

    Thanks,
    Charles

  • Comment by KiraSherrine
    Date: October 23rd, 2009 at 6:24 pm

    Hi,

    what part would you input the tile file?

    Also my nav tags (about, contact, …)
    and Sidebar Tags (category, archives)
    are all jpegs … I am looking for ways to input it into the php but cannot find any help on that…any help?

    Kira

  • Comment by bpositive
    Date: November 9th, 2009 at 1:32 pm

    Hi. Great Plugin :-)

    How do i get it to center a larger picture?

    Thanks

  • Comment by Jack
    Date: March 18th, 2010 at 5:11 pm

    Great plugin! I’m using it on two sites and it works like a champ! But on ONE of the sites, the background won’t display in IE8, while it works just fine on the other. Any ideas?
    (www.pdrjunction.com and http://www.hailreporter.com)

  • Comment by monk
    Date: May 4th, 2010 at 7:51 am

    hello

    nice plug in. i use over there ( http://www.monk.gr) and its work great.

    thanks

  • Comment by Carrie Burns
    Date: June 7th, 2010 at 4:19 pm

    Great plugin, but appears that Firefix/Netscape doesn’t like the background as a body style tag, while it works fine in Safari, hoping we can get it to work though.

  • Comment by echav
    Date: August 19th, 2010 at 3:53 pm

    Do you have an option for content background and not body background?
    Thanks

Leave a Comment

Simplistix and 76 Digital Orange Themes Now Available @ WordPress.org

Date: 31st January 2009 at 3:38 pm | Filed under: themes, wordpress | Author: Sam Burdge | Tags: , , ,

My WordPress themes 76 digital orange and Simplistix are now available at wordpress.org. Here are the links:

For some reason WordPress uses my forum username 'sammyb' as the author name for the themes. With plugins it reads the author name from the plugin file, this obviously doesn't work the same way with themes!

2 Responses to “Simplistix and 76 Digital Orange Themes Now Available @ WordPress.org”

Leave a Comment

WP Holding Page Theme

Date: 30th January 2009 at 1:59 am | Filed under: themes, wordpress | Author: Sam Burdge | Tags: , , , ,

The WP Holding Page theme for WordPress is intended for use at times when your site is undergoing maintenance, or is under construction. There are a few themes and plugins out there that also serve this same purpose, the main advantages of this theme are:

  1. Simple basic classy design.
  2. Easy to install & works 'straight out of the box'
  3. Configurable text,colours, fonts and styles via an  Options Page

You can enter you own text for your holding page via the WP Holding Page Options tab in WordPress.

INSTALLATION:

  1. Download the theme from the link at the bottom of this post.
  2. Upload the theme to your wp-conent/themes folder.
  3. Select the theme from the 'Appearance' page in your WordPress and activate it.
  4. Optionally you can configure the theme via the 'WP Holding Page Options' tab under 'Appearance' in WordPress

CONFIGURATION:

You can configure your holding page via the 'WP Holding Page Options' tab under 'Appearance' in WordPress. Here is a list of available options:

  1. Title text
  2. Body text
  3. Text colour
  4. Background colour
  5. Font style
  6. Title size
  7. Text size
  8. Page alignment

Options page screenshot:
options

THEME SCREENSHOTS:

hp1hp2hp6hp3hp4

DOWNLOAD:


6 Responses to “WP Holding Page Theme”

  • Comment by pressitfor.me
    Date: January 31st, 2009 at 3:00 pm

    WP Holding Page Theme | Sam Burdge…

    The WP Holding Page theme for WordPress is intended for use at times when your site is undergoing maintenance, or is under construction. There are a few themes and plugins out there that also serve this same purpose, the main advantages of this theme a…

  • Comment by WP Holding Page | Simple Themes
    Date: February 25th, 2009 at 1:51 pm

    [...] Release Page [...]

  • Comment by Under Construction Themes for WordPress
    Date: September 3rd, 2009 at 7:00 am

    [...] WP Holding Page Release Page [...]

  • Comment by Don’t show your working | Blog Mum | WordPress made easy
    Date: November 27th, 2009 at 1:54 am

    [...] will need: the WP Holding Page theme; the Theme Test Drive plugin, and of course a WP [...]

  • Comment by WP Holding Page Template
    Date: May 2nd, 2010 at 4:23 am

    [...] Preview — Download [...]

  • Comment by mikhel
    Date: October 24th, 2010 at 4:37 am

    This theme would be so cooler if there was a way to include an image to the page and more ways to interact with the viewer.

Leave a Comment

WordPress Tips - Removing The Title Attribute From wp_list_categories & wp_list_pages

Date: 29th January 2009 at 11:47 pm | Filed under: development, scripts, wordpress | Author: Sam Burdge | Tags: , , ,

I noticed in the WordPress forums that a lot of people were asking how to remove the title="example" attribute from the links generated by the WordPress template tags wp_list_categories and wp_list_pages. The title attribute is what generates the little text box with something like "View all posts filed under <category>" when you hover over a link.

I had previously devised a 'hack' for removing the dreaded title attribute for a theme I worked on. The key is to set the 'echo' parameter of the function to '0' and then to use preg_replace code to remove the title attribute. Here is the code:

wp_list_categories:

<?php
$cool_cats = wp_list_categories('echo=0');
$cool_cats = preg_replace('/title=\"(.*?)\"/','',$cool_cats);
echo $cool_cats;
?>

wp_list_pages:

<?php
$clean_page_list = wp_list_pages('echo=0');
$clean_page_list = preg_replace('/title=\"(.*?)\"/','',$clean_page_list);
echo $clean_page_list;
?>

Personally I don't mind having the titles on my site navigation, and I use the NAVT plugin to generate my nav, so the template tags don't apply for me.

27 Responses to “WordPress Tips - Removing The Title Attribute From wp_list_categories & wp_list_pages”

  • Comment by pressitfor.me
    Date: January 29th, 2009 at 11:54 pm

    WordPress Tips - Removing The Title Attribute From wp_list_categories & wp_list_pages | Sam Burdge…

    I noticed in the WordPress forums that a lot of people were asking how to remove the title=”example” attribute from the links generated by the WordPress template tags wp_list_categories and wp_list_pages. The title attribute is what generates the lit…

  • Comment by tom
    Date: February 10th, 2009 at 3:49 pm

    Where would I place the code snippet for wp_list_pages?

  • Comment by Sam Burdge
    Date: February 10th, 2009 at 4:56 pm

    Hi Tom

    The code snippet above is meant to replace the existing wp_list_pages function used in your theme.

    wp_list_pages is usually called in either header.php, footer.php or sidebar.php of your theme.

    More info about wp_list_pages here:
    http://codex.wordpress.org/Template_Tags/wp_list_pages

    Sam

  • Comment by Sumit Khanna
    Date: April 1st, 2009 at 3:39 pm

    Thanks for the code snippit! I had started using nicetitles for http://chattanoogaswing.org and then noticed that wp_list_pages added tiles to all the links!

    The calendar I was using doesn’t add a class for the dates I wanted the tooltips on. If it did, I could just modify the nicetitles javascript to only select that class of element.

    Using your little regex to remove the titles form wp_list_pages is much easier!

    Also, cool theme you’ve got going on here. I like the green-on-black console look.

  • Comment by Designs Genius
    Date: May 19th, 2009 at 10:15 pm

    thanx a lot for this tip !.
    I have another question for everybody : How can I remove a hyperlink from wp_list_pages, but only from the first ul in the heirachy ?
    thx for all who will consider my question ! :)

    Sébastien from France

  • Comment by Frank Karlstrøm
    Date: June 17th, 2009 at 8:30 pm

    Yet another thank you from me. Have been looking for a plugin to do this, but this is even better. Do you think it’s better for me to write a private plugin implementing this small little code? to avoid the snippet to be removed when I upgrade WP.

  • Comment by Robert Carro
    Date: July 6th, 2009 at 5:41 pm

    W9xinK great tips. I enjoyed reading this,

  • Comment by coda
    Date: July 29th, 2009 at 11:49 pm

    Exactly what I was looking for, thanks a lot!

  • Comment by norton
    Date: September 10th, 2009 at 2:59 pm

    Thanks a lot . I needed to remove the “title-attribute” because of a firefox(macOs)-bug that would always reload the dropdown after stoping to move the mouse on it.
    This would not happen if there was no “title-attribute” anymore. To figure out this already took forever. This code finally make my dropdowns work like they should.

  • Comment by JR
    Date: September 11th, 2009 at 2:49 pm

    What happens if it isn’t hard coded into the theme and WP seems to be generating them of its own accord? What file do I need to edit?

  • Comment by Matt Furtado
    Date: September 16th, 2009 at 8:16 pm

    For the wp_list_categories hack, how would I get the category name to display instead of “View all posts filed under “? Is there a simple hack that I’m not aware of?

  • Comment by Matt Brewster
    Date: September 18th, 2009 at 1:53 pm

    Great tip - many thanks :)

  • Comment by Will Stern
    Date: October 8th, 2009 at 4:19 pm

    You rock. Great post.
    To answer JR, and anybody else wondering, open your header.php and look for replace it with his code.
    If there are specifics in your brackets, make sure to include them in his code in addition to echo=0
    Mine looks like this: $clean_page_list = wp_list_pages(’title_li=&depth=2&echo=0′);

  • Comment by Will Stern
    Date: October 8th, 2009 at 4:20 pm

    meant to say look for the php calling wp_list_pages() …the php code got cut out. :(

  • Comment by fatihturan
    Date: November 29th, 2009 at 1:08 pm

    Good tip. Thanks.

  • Comment by Tim Holt
    Date: January 4th, 2010 at 4:03 pm

    Those who aren’t comfortable editing their theme files can use the Remove Title Attributes plugin to solve this problem.

  • Comment by Tom
    Date: January 31st, 2010 at 8:07 pm

    Tasty… RegExp is not my bag!

  • Comment by kevin
    Date: February 23rd, 2010 at 9:21 pm

    Cool exactly what i needed. Thanks!

  • Comment by Khaled Hakim
    Date: June 25th, 2010 at 5:50 pm

    Thank you for this awesome snippet of code. One of my picky clients did not want the titles to appear on hover. I was using the wp_listpages function, of course and I am glad I came across this site.

    What this code does, for those who are not sure, is remove the title that appears when the mouse is over (hover) an item in the list that is generated through the use of the wp_listpages function.

    Cheers.

  • Comment by Vidhu
    Date: July 12th, 2010 at 4:43 am

    Wow… This is what i was looking for… Now its working finely in my website… Thanks for the useful tip…

  • Comment by Nathan
    Date: July 28th, 2010 at 12:42 pm

    I used this code and it removed the titles, but it added the text “Pages” before all of the actual pages and it is messing up my menu, how can I get rid of that text?

  • Comment by Sam
    Date: November 13th, 2010 at 11:42 pm

    Guys can anyone put little bit more information here please!!!

    where in the world we should put that piece of code?

  • Comment by althahabi
    Date: December 15th, 2010 at 9:59 pm

    sorry , but where to find the two functions wp_list_categories
    wp_list_pages

    in the theme twentyten !

    thanx

  • Comment by alex chousmith
    Date: January 27th, 2011 at 3:52 pm

    thanks for the tip, it totally works

  • Comment by Ian
    Date: March 14th, 2011 at 6:25 pm

    Found this via Google leading me to the WP forums, works great, better than editing core, thanks!

  • Comment by Ian
    Date: March 14th, 2011 at 6:27 pm

    @ Nathan, try this:

    wp_list_pages(’echo=0&title_li=’);

    note the title_li=

    that makes the list title equal to nothing! Cheers

  • Comment by marion
    Date: March 22nd, 2011 at 3:21 pm

    Thank you, this is perfect! Your solution worked for my categories and custom taxonomies. I wish you can also write a code to remove the parent category links =D

Leave a Comment

Flash Sound Spectrum Visual – ‘Train Window’

Date: 28th January 2009 at 3:35 am | Filed under: flash, gallery | Author: Sam Burdge | Tags: , , ,

This Flash Sound Visualisation is based on the idea of the audio waveform becoming a rolling cityscape as viewed from a train window. It combines the computeSpectrum method with the blur and glow filters.

Leave a Comment