WordPress

Contact forms for your blog:

0
1168 days
by in WordPress

You have a blog and want traffic don't you? Well of course, since that is what makes us blog in the first place! The readers might like to read our stuff, and many times they want to talk to us, and contact forms are really good at that ;)
What I mean is that it is no breaking news that contact forms are actually used, either by potential customers, readers that want to share/correct us or simply by someone who dropped by and wants to say "Hey, nice design".
Whatever the reason is, it is always good to have a contact form, and when I wanted to setup mine I looked for WordPress plugins to do it for me (I'm a bit lazy in that sense) and found some interesting stuff.

First of all we have cForms which if I had to explain it to someone that knew nothing about this I would simply say, "if you install cForms for your contact form is like wanting to buy a computer simply to browse the web and buying a gaming computer that is the closest thing to a supercomputer one could find". I mean by this that cForms is too much for the average blogger, it has too many things, the first time I saw it I just though "Can I just have a contact form please?", although I ended up liking it.

So if you just want a contact form, good and simple, there are many good plugins out there that do the job perfectly,

Contact Form ][:

Which, as they say, "[it] is a WordPress plugin, that offers a simple drop-in contact form in any new/existing post/page". It is a nice plugin although you will never get any support from the author, so be careful on this one.

Contact Form Plugin:

This plugin changes a bit how the contact forms work, instead of entering a tag withing the content of a page/post, you publish it, and then you paste the URL into the configuration page, a bit weird yes, but in the end it is just as simple.

There are of course many other options available, although this are the most varied ones. What is your favorite?

Display previous/next posts in single, category… in WordPress

0
1238 days
by in PHP, WordPress

This is a really good option in WordPress, yet very few know how to do it. Well the code is relatively simple, and it gives a good navigation point for users that, if they liked your article, might want to keep reading your stuff.

If you want to plainly display the next post after the one the user is reading, use the following function:

 
< ?php next_post_link(); ?>
 

Now this function has several (very useful) parameters, which are:

 
 < ?php next_post_link('format', 'link', in_same_cat,
                         'excluded_categories'); ?>
 

Format: For example bold ('%link'), italics ('%link')... And so on, you can add here divs, p, span or anything you want to apply css classes or ids.

Link: To display a custom text instead of the post title, for example if you want "Next post" use:

 
< ?php next_post_link('%link', 'Next post in category', TRUE); ?>
 

in_same_cat: A very handy parameter if you want to display only the next post of the same category. Set to TRUE if you want it that way, or FALSE if you simply want the next post.

You can use one more parameter to exclude categories, for example:

 
< ?php next_post_link('%link', 'Next post in category', TRUE, '13'); ?>
 

And now the next post will be from the same category, unless that category is 13 (The id, check in the administration panel)

If you want to exclude multiple categories you'll have to use the "and" separator. It will work like this:
'1 and 5 and 15'
Note: If you are using WordPress 2.2, the concatenation method was a comma (','). So you would use:
'1,5,15'

Of course to display previous posts substitute next by previous, with everything else being the same.

Enjoy,

Easily assign an image to a post in WordPress

1
1241 days
by in PHP, WordPress

Have you ever wondered how to assign an image to a certain post using WordPress? Surely there are some plugins that try to do this, and maybe they accomplish it, but probably slowing down your blog.

Well, here is a way of doing it without slowing the blog or installing any sort of additional plugins. When you are done writing your post, upload an image to a directory that you will use for this, for example: "www.yoursite.com/post_images/". And I recommned that you name the image something that has to do with the post, it will help you if you need to edit it.

Now in the writing are scroll down until you see the tab "Custom fields":

Assigning images to posts

And fill in the following information:

Key: post_image
Value: image_name.jpg

The key must be always the same, in this example it will be post_image. And the value will be the name of the image that we uploaded. In the example it is assigning_images.jpg

And that's it for now. The next step is including this images into our template.

Add the image to the template:

As you can see under the tab Custom Fields there is a link to the WordPress codex, where they explain the functions we'll use for this, so consult that if you have any doubts.

So here is the code to display the image (It must be inserted inside the Loop):

 
if(get_post_meta($post->ID, 'post_image',true)){
	//There is an image assigned:
	echo '<img src="http://yourblog.com/post_images/'.get_post_meta($post-/>ID, 'post_image',true).'" />';
}
 

Note that if you copy and paste the code before you'll have to delete a / in $post->ID because WordPress is adding it automatically.
Of course this is the most basic approach, but hopefully you will understand the method and will be able to work on it.
At the moment I am using it to display thumbnails on the archive excerpts (They are not live yet, I'm still testing) and it is a very easy and fast way of doing it.

If you ever need to edit either the image or the meta-data simply re-upload the picture or edit the post.

Cheers,

sIFR – Use custom fonts in your website safely

8
1374 days
by in Javascript, PHP, Plugin development, Programming, Web-related, WordPress

UPDATE: The sIFR WordPress plugin is now available!

This is probably one of the most amazing scripts I've seen nowadays. It was developed by Mike Davidson and Mark Wubben, and what it does is it allows you to change the fonts used in your website to custom fonts without having to worry about them changing in the user's computer.

How this is accomplished is actually very simple. First of all you need a folder with all your fonts (.ttf files), then a JavaScript file has to be called from your html pages which will first check if Flash is enabled, and then if it is it will read through the code and determine where it should insert the flash movies.

Those flash movies take the font you selected and the text that the script found and create a static "animation" with the same text and size but with the new font. Since they are overlayed exactly over the original text, no change is noticed.
The only thing I'm afraid won't work fine is the background color. If you have a solid background it will work perfectly probably, but what if you use a textured background, like I do in this blog? I haven't tested it yet, but their test page works perfectly on solid backgrounds...

As a piece of advice don't over-use it, it is intended only for headlines, quotes, and other small bits of text.

Visit sIRF's homepage for more information on this subject
Visit their demo page

Future planning

Right after I found this tool I thought to my self, "I have to create a WP plugin that will automatically change selected tags or ids to themed fonts!". So well, I am developing now the plugin.
I started today so I guess it will take me no longer that this Sunday. I have about three days, considering that here in Spain we are on holidays... Yea I know, Spain is always on holidays :)

So that is pretty much it, I'll keep on posting about the plugin status, and if you want me to notify you simply post a comment saying so and when I'm done I'll email you ;)

Enjoy sIFR!

Best Photoshop brushes for web designers

14
1374 days
by in General talk, Graphic Design, Layout/Styling, Photoshop, SEO, Web-related, WordPress

Here is a (huge) compilation of the best free Photoshop brushes out there. They are the ones I use, and the ones it took me a very long time to find over the web.
I've selected the best of them, and along with a preview and a description, I've made a zip file that contains the whole compilation.
For all brushes hosted at brushes.500ml.org you'll have to navigate to the brushes, since they don't allow direct linking...
If you enjoy this set of brushes consider blogging about it ;)

Take into account that this is a huge list of brushes, and it takes a long time to download. Also, the mirrors might only be available for a limited time, so if you find them to be broken please notify me
And here is the list (Alphabetically ordered)

Art nouveau

This beautiful set features 8 brushes with patterns and designs following art nouveau techniques and style.
Visit the brush homepage
Art Nouveau brush set

Botanical flowers

This is a very nice set of brushes, specially for "natural" websites or just as footer decoration.
Visit the brush homepage
Botanical flowers

Bugs and Angels

This is indeed a very strange combination of brushes to put in a set, but both of them are very beautiful and make a good "innovative" design element.
Visit the brush homepage
Bugs and angels

Elegance

One of the best web design brush sets I have ever found. This provides you with some very elegant lines and circles. Worth checking out ;)
(I couln't find the author's website, so if you want the set, download the pack)
Elegance

Feathers

Strange brush set, filled with feathers, but it makes a beautiful texture I guess.
Visit the brush home page (Scroll down a bit, by Sheishido)
Feathers

Floral swirl

A very beautiful brush set, largely used in modern web designs (And in this blog's design too)
Visit the brush homepage
Floral Swirl

Foliage

Another brush set of plant elements. This time it is packed with tree branches, leaves, bushes... Great for some "wild life" designs:
I couldn't find this brush homepage :S
Foliage

Fractals

A nice set of fractal images, these are great to put in backgrounds for scientific websites or pics...
I didn't find the original brush set website, but here at getbrushes.com you can find tons of fractal brushes.
Fractals

Frames

This are good sets (I've put here two sets of frames) to enclose your images in.
Frames 1
Frames 2
I don't remember where I found them, but just search for frame brush sets and you'll find a lot more.

Garden of Decay

One of the most beautiful sets here, nice textures and images. It comes with some handwritten text too.
You can find it here, along with a lot more brushes by Annika
Garden of Decay

Good & Evil

A nice set, featuring some trees, skies, and other textures. Great for image edition, and adding header decoration too.
Brush set website (And also in Annika's website)
Good & Evil

Grunge flowers

Probably the best brush set exposed here. I used it a lot for my backgrounds in this blog's design.
Grunge flowers

Grunge texture

A set of textures to use in "rough" designs probably
Grunge texture

Hair

I really don't know where or why you would use this, but it is a good set of high quality "hairs" :S
Hair

Illusionist

Very strange set of cut & inversed faces. I really don't know how to describe this set. It is very cool though, so check it out.
By Annika Von Holdt
Illusionist

Paint

This is a very useful brush set, it is also the one I used for the header background, those paint strokes. It has both strokes and splatters...
Paint

Patterns

Some patterns for backgrounds or buttons, or whatever you want them for.
Patterns

Splatter

Another set similar to the paint set, but this time focused on Paint splatters. If you want to add splatters to your designs, this is your set!
Paint splatter

Valentine

A very romantic set, with hearts, roses, hand-written text... You'll love it ;)
Valentine

Victorian people

This is probably a very strange brush set you might think you'll never have to use, but once you have it, you'll use it. Guaranteed. It features full-body pictures of Victorian people.
Victorian people

Important notes & download

Please do not hotlink the images nor the zip file with the compilation, instead link to this article please.
I couldn't find most of the brush sets websites because over the years I have renamed most brush set names, so if you are the owner or creator of them and I have not placed a link to you please comment it below.
Also, if you think a link was misplaced do comment.

Download the compilation

Here you can download all of the brushes before. They come in a zip file, ready to send to photoshop.

You don't know how to import them in photoshop?
Simply go to the install location of photoshop (Normally in C:\Program files\Adobe\Photoshop). Open it up and search for a folder called "Prestablished settings", once there go to "Brushes" and paste the content of the zip file.
If you had Photoshop already opened you'll have to close it and re-open it to use your new brushes.

Enjoy :)

Next »
Go to Top