Performancing Metrics

Archive for the ‘WordPress Tutorials’ Category

How To Create A Cool “Bubble Up” Effect For Your Blog’s Icons Using CSS

CSS Bubble EffectA few years ago, the bubble effect that I’m about to show you to create could only be executed using flash animation but thanks to some CSS innovation, the limitations and boundaries to simple yet elegant design are crumbling. For any blogger or website owner, its very important to learn a little HTML and CSS; you will find that you have more control over your blog’s design and will be able to implement simple changes that can make your blog’s design stand out.

Here is a short and simple tutorial to give your buttons a nice bubble up effect that is sure to catch your readers’ attention, using the image swap method in CSS. Read More

Categories: Blog Design, WordPress Tutorials
Tags: , , ,

How To Add Support For Menus In Your WordPress Theme

Are you running WordPress 3.0 yet? If so, you might have come across a nifty little addition called Menus. You’ll find it on your admin Dashboard in the Appearances section, and here’s a little screenshot of how it looks:

As you can see, I’ve set up a new menu named “Lorraine Menu” here, and added various things to it by selecting from the elements on the left side of the page: a link to Devlounge, links to some pages, and so forth.

Also of note is the message beneath Theme Locations that states:

The current theme does not natively support menus, but you can use the “Custom Menu” widget to add any menus you create here to the theme’s sidebar. Read More

Categories: WordPress Themes, WordPress Tips, WordPress Tutorials
Tags: , , , ,

Custom Post Types Sources You Should Know About

Lots of optionsBy now you should be aware that WordPress 3.0 comes shipped with Custom Post Types. It’s a feature that may not be easy to grasp at first, but it holds almost infinite power over what you can do with WordPress. Custom Post Types are not set in stone as to what they exactly are. It’s more important you realize that they can represent any type of content you want. WordPress already ships with several post types such as posts, pages, attachments and even revisions, so it’s basically up to your imagination what you can do with it.

There are three sources about Custom Post Types I think you all should read to get a better grasp of what it can do for you. I’ve heard people say that the new WordPress 3.0 Custom Post Types feature is really not all that important, but I’d like to show them different by presenting you these three great sources. Read More

Categories: WordPress Tips, WordPress Tutorials
Tags: , ,

Optimise Your WordPress Themes With Better Author Pages

Recently Ajay D’Souza asked how we made our author archive pages here on BloggingPro. I personally am a big fan of displaying content differently on different sections of blogs and also think that archives should be more informative than be just a collection of excerpts.

Because I personally believe that an ‘Author Information’ block below every entry overkill is, the author archive is the right spot to display more information about every author and also display the entries written by authors in a short and concise way.

Part 1: Adding The Author Description and Gravatar

Creating customised author pages is really simple. Other than some CSS customisation the code for the author description is entirely provided by known and documented WordPress template tags and information gathered from the author profile.

First we need of course a author.php template for this to work and you need to make sure that every author fills in their profile. The code used in following code samples is backwards compatible (to WP1.2!) and makes use of the $ curauth functions documented in the WordPress Codex Author Templates. The email address is protected from spam harvesters. Read More

Categories: WordPress Tips, WordPress Tutorials
Tags: ,

How To: Display Your WordPress Category List in Multiple Columns

Do you sometimes get that feeling to go all overboard and do things differently with your design? OK, I might not be the most creative person with visual designs, actually I like simplicity, but the fact was that I recently switched to a single-column design for my own WordPress blog.

With simplicity, and single-column design, came the following problem: ‘How to implement a smart navigation?’ Important is to understand my blog: iFranky is a mix of several topics and is both my brand and a personal space to write about life as well as a tumblelog and collection of interesting entries I wrote on other blogs. The readership is a mix of friends, bloggers, clients and students I lecture about blogging and social media. This leads to a mix of different topics, but not all are worth to be displayed on the home page.
The main navigation factor is based on the categories, categories I used in previous designs iterations to display multiple loops on the home page or to implement different backgrounds.

Simplicity meant that my complete navigation would be send to the footer, an often overlooked design element (There is no fold), even the header navigation.
Because my main page only shows the main entries, I somehow had to integrate a category list in the footer but who wants to add one column of more than 15 categories or a drop-down? Trust me when I say that I have analysed click behaviour and barely one bothers with these often sky-high columns or drop-downs. The solution: display your category list in columns. Read More

Categories: WordPress Tutorials
Tags: , , ,

Tutorial: How To Merge 2 WordPress Blogs

For a project I am involved with we recently considered merging 2 rather large WordPress blogs. These were 2 blogs with several thousands entries and posts and at least 20 authors have written on those blogs over the years. The combined blog would have more than 10,000 entries and more than 40,000 comments.

In this post I am going to walk you trough the whole process, because it is simpler than it sounds and should not scare anyone away. Depending on how ‘hardcore’ you, the merger could be done in some hours only. Yes, some hours only.

Getting Started

Although this tutorial is aimed at both ‘beginners’ and ‘pros’, I assume that you have a certain basic knowledge, understanding from WordPress and setup already:

  • You know how to backup a database;
  • You know how to FTP;
  • You have a localhost setup;
  • You have a basic understanding of WordPress database tables, ie. when I mention wp_options, you know that this is a database table and you know how to ‘find’ this table;
  • You know how to make changes to the database

The walkthrough is also based on both blogs running a similar permalink structure and using the same plugins. Read More

Categories: WordPress Tutorials
Tags: , ,

Publish Your Blog In Multiple Languages With WPML Plugin For WordPress

wpmlMany people want to publish their blog in different languages or offer translations to their readers. Often a translation plugin is used offering automated translation via Google Translate or Babelfish. But if you speak/write several languages you can use the WPML plugin to publish your blog in several languages, and if you want to have each language on a separate (sub)domain.

The great thing about WPML is the ease to set the plugin up and stat using it, contrarily to other plugins. All you need to do is upload the plugin and fill in the settings.

Configuring WPML

WPML Settings 1

The first settings panel after activating the plugin allows you to set the main language, this is the language an entry will be published in if you do not select an other language for that post. Note that this setting will not change the language of your WordPress admin backend, you still need to localize your WP install for this (more info on localization at the WordPress codex).

wpml-2

When using the basic settings, you now only have to opt what other languages you want to add to your site. Once you have selected the additional languages you only have to decide where you want the widget with the language switcher. If your theme does not use widgets, use <?php do_action('icl_language_selector'); ?> in your theme. You can customize the display/colors of the language selector in the advanced settings.

Now your site is prepared to deal with multi-lingual content. Read More

Categories: WordPress Plugins, WordPress Tutorials
Tags: ,

Display Upcoming Entries In Your Post With A WordPress Shortcode

Since some days several contacts have been considering the option to display upcoming posts on their site. WordPress offers a really simple solution for this in the form of the attribute post_status. The post_status is stored in the wp_post table and has generally the attributes: draft, private, publish or static for pages. There is one more attribute which we will use in this example: future.

It is now simple to create a list of the 5 upcoming entries and display this in your theme, fe. in your sidebar.

<?php
$my_query = new WP_Query('post_status=future&showposts=5');
?>
<div class="sidebar-box">
    <?php
    if ($my_query->have_posts()) : while ($my_query->have_posts()) :
        $my_query->the_post();
        ?>
        <ul>
          <li>
           <?php the_title(); ?>
          </li>
        </ul>
    <?php endwhile; else: ?>
        <div>
        <ul>
          <li><?php _e('No upcoming Posts'); ?></li>
        </ul>
        </div>
    <?php endif; ?>
</div>

You can now easily style this in your CSS.

Use A Shortcode To Display Upcoming Entries In A Post

First, what are shortcodes? I wrote a small intro to shortcodes on Devlounge yesterday with some examples of how to build a shortcode.

Why would you want to display a list of upcoming posts within an entry? You could be writing a series and want to use your upcoming entries as an additional teaser in the hope that the reader will subscribe or return to your site. You could use a post template for this but it is very simple to create a shortcode. Once you have created this shortcode it is then very simple to add the list of upcoming posts anywhere in an entry.

Building the shortcode

For this example we are going to build a shortcode [upcoming] and will use the tag series as selector. Doing this, it will avoid that scheduled entries not tagged Series will not be displayed. This can be handy on multi-authored blogs with a regular, scheduled posting rhythm.

Add the following code to your functions.php.

function upcom($atts, $content = null) {
       extract(shortcode_atts(array(
               "num" => '5'
               "tag" => 'series'
       ), $atts));
       global $post;
       $myposts = get_posts('numberposts='.$num.'&post_status=future&order=DESC&orderby=date&tag='.$tag);
       $retour='<ul class="upcoming">';
       foreach($myposts as $post) :
               setup_postdata($post);
            $retour.='<li><a href="'.get_permalink().'">'.the_title("","",false).'</a></li>';
       endforeach;
       $retour.='</ul> ';
       return $retour;
}
add_shortcode('upcoming', 'upcom');

All you have to do now to display this list in an entry is use the shortcode [upcoming] in the editor.

In this example I used <ul class="upcoming"> to easily style the output in your CSS.

Modifying The Shortcode Function

The shortcode function above can easily be modified.

- The example returns 5 posts, change the value in line 3 to display more or less entries
- Change the tag you want to use in the same way as you would change the number of displayed entries (line 4).

Categories: WordPress Tips, WordPress Tutorials
Tags: , , ,

Freelancing with WordPress – WPCandy

The past few days, WPCandy.com has been running some great articles about using WordPress for freelancing. From dealing with project management, to managing contacts, to setting up a portfolio, and (as of today) even invoicing.

If you’re doing much in the way of freelance blogging, or just want some ideas of how you might better organize your own projects using WordPress as a management tool, I highly suggest checking them out.

They each focus on a very specific set of needs and how WordPress might fill those needs (and at times suggests better options), so it’s pretty easy to mix and match a solution that could work for just about anyone.

Here’s a tidbit from the “project management” article to get things rolling…

After checking out all these options Iʼve found the “WordPress-as-Project-Management-System” experience to be extremely lacking. The options are either simple enough that they could be replaced with Google Docs or a simple notebook or so complex that trying to use them is nearly impossible. There simply is no killer project management plugin for WordPress… yet.

I think it is worth noting that the best replacement Iʼve found for Basecamp is an open source project called Project Pier which does almost everything Basecamp does. Itʼs even themeable and they have some pretty slick options. If you want a self-hosted project management solution, Project Pier is definitely the way to go.

Check out WPCandy.com for the original articles, and a pile of other fun stuff.

Categories: WordPress Tips, WordPress Tools, WordPress Tutorials
Tags: , , , , ,

Top 50 WordPress Tutorials

NetTuts has put up a list post of fifty of what they consider the top WordPress tutorials. It includes some very helpful posts, including a few from their own blog that are definitely worth reading.

I found some to be more useful than others. Some tutorials are just learning one or two line PHP scripts that will help you add or remove features from your blog, while others are thousands of words long, and require almost a weekend course to understand.

If you are looking to modify your WordPress installation in new and interesting ways, it is worth checking out this tutorial list.

Categories: WordPress Tutorials

Content


Receive the top stories from BloggingPro and the Splashpress Media network every week, right in your Inbox. Relevant and timely content is yours for FREE!