A Selection of Code Snippets from Design Reviver Answers

Feb 19
2010

Everyday Design Reviver Answers is offering solutions via useful snippets of code, helpful resources and general tips for all your web design issues. And as such we would like to share with you our favorite code snippets from this last week.

It has been yet another good week, thanks for your support!

Have you asked a question yet?

How Can I Display More Than One Twitter Feed On My WordPress Blog?

We do this by accessing the persons Twitter account RSS feed, then fetching it and embedding it on your site.

Replace the example RSS’s with the ones you’d like.

get_item_quantity(3);
$rss_items = $rss->get_items(0, $maxitems);
?>

    <?php if ($maxitems == 0) echo '
  • No items.
  • ';
    else
    // Loop through each feed item and display each item as a hyperlink.
    Foreach ( $rss_items as $item ) : ?>

  • <a href='get_permalink(); ?>'>
    get_title(); ?>

I Have Multiple Authors On My Site, How Can I Display Their Info?

If you want to display their info at the bottom or beginning of the post, then use this and place it in the corresponding area of your WordPress files. (i.e. Single.PHP or Comments.PHP)

Edit the author box as necessary.

How Can I Display Someone Else’s FeedBurner Post On My Site?

You can add the following jQuery code anywhere you want on the site (i.e. Sidebar, footer, etc.) Just remember to replace and specify which feed you’ll be recalling.

$(document).ready(function(){
$.ajax({
type: "GET",
url: "http://feeds.feedburner.com/examplefeed",
success: Function(data){
$("#date").text($(data).find("item:first>pubDate:first").text());
$("#title").html("link:first").text()+"'>"+$(data).
find("item:first>title:first").text()+"");
$("#description").html($(data).
find("item:first>description:first").text());
}

What Can I Use To Place A Shadow Behind My Images And Outlines?

If you’re refering to having your images and boxes with a drtop shadow, then you need the Box Shadow CSS feature to work for you. Here’s what you need to place in your CSS:

.shadow {
box-shadow: 3px 3px 3px #f2f2f2;
-moz-box-shadow: 3px 3px 3px #f2f2f2;
-webkit-box-shadow: 3px 3px 3px #f2f2f2;
}

What’s The Easiest Way To Redirect A Specific Page On My Site?

If you want to redirect users to another site once they enter a specific area on your site then you just have to use some of this Javascript code in the page to be redirected from:

Replace the www.google.com with the URL address you wish to redirect to.

Unanswered Questions

There are always some questions that seem to get through the net, can you help us answer them?

  1. What Is A Good Resource To Create Style Sheets For Multiple Web Browsers?
  2. How To Create A Profile Which Can Be Navigated, Without Using HTML Or Flash?
  3. How Do You Find New Clients?
  4. What Are Your Top Usability Tips For Web Designs?
  5. What’s A Good Mobile Framework To Use?
  6. How Can I Integrate ECommerce On My Site Without Any Coding?

Thanks again, firstly to everyone who asked a question, but most importantly thanks to everyone that took the time to offer always helpful and useful answers.

Google Olympic Logos from Past To Present

Feb 19
2010

Black and white portfolio websites

Feb 19
2010

5 Cool and Fresh Photoshop Text Effects Tutorials

Feb 19
2010

Text effects seems to open up a can of creativity within artists that is unrivaled with any other aspect of graphic design. By taking the simplest form of text and a blank canvas you can create something amazing and at times awe-inspiring.

For today’s news round-up we have a small collection of amazing text effects and tutorials for Photoshop.

3D Typewriter Text

Photoshop Text Effects

In this tutorial you’ll create some 3d typewriter hammer keys in Illustrator and mix them together with some painting techniques and the Vanishing Point Filter in Photoshop to create a stylish multi-dimensional wallpaper.

View the tutorial.

Photoshop Grungy Metal Effect

Photoshop Text Effects

In this tutorial you will learn how to create a text effect using textures from stock images. The final image is a grungy picture with text being illuminated in the dark.

View the tutorial.

Jungle 3D text in Photoshop

Photoshop Text Effects

This is a hunourous Photoshop tutorial that explains how to create a 3D jungle text effect. You will firstly create the text in Xara3d and then Photoshop to texturize the letters using the animals’ skin.

View the tutorial.

Retro-Style Text Effect in Cinema 4D and Photoshop

Photoshop Text Effects

For this tutorial you will learn how to create 3D text and merge it into a retro-style scene, using Illustrator for the text, Cinema4D to make the text 3D and finally Photoshop to bring it all together.

View the tutorial.

3D explosion using the Brush and Smudge Tool

Photoshop Text Effects

In this tutorial you will learn how to create a 3D explosion using the Brush and Smudge Tool using Photoshop and its default settings. After creating the explosion, the tutorial also features a few steps guiding you on how to create and implement your own 3d text.

View the tutorial.

By Paul Andrew (Speckyboy and speckyboy@twitter).