| Subcribe via RSS

On-Stage: Free Vector PSD Icon Set

August 27th, 2008 | No Comments | Posted in Uncategorized

This is our second icon set after a long time. We have been writing about Lights & Shadows and this whole Icon Set is purely based on the same concept. This icon set is a freebie on Smashing Magazine too.

On-Stage Icon Set

The beauty of this Icon Set:

  • 100% Vector - Shape Based
  • Layered PSDs
  • 128 x 128 PNG included
  • 100% FREE - use them anywhere…

Download

This file has been downloaded 1000 times.

On-Stage Icon Set Preview

Spirals

August 27th, 2008 | No Comments | Posted in Uncategorized
A free set of of spiral vectors by sexualtyranosaurus. You can easily create similar shapes with using the "Transform Again Feature" in Adobe Illustrator (Ctrl + D or Cmd + D) Download. To use open the pdf with Adobe Illustrator.

The dfGallery v2 - Coming Soon

August 26th, 2008 | No Comments | Posted in Uncategorized

Yes, It is the same dfGallery you are awaiting… Sure you are aware that we are working on the v2 and we have been trying to finish this from a long time but have failed. This is because we are constantly adding new features into it to make it one of the best free flash galleries

We are in the 80% of the completion and we promise the finish the rest within the next few weeks. We have been getting a huge number of requests for the next version and trying to incorporate almost every request into this version.

If you are not aware, the v1 of the Gallery is a simple SWF based on an XML but this new version is much better than the previous version. We have almost everything you will need for a gallery.

” THIS IS STILL GOING TO BE FREE “

Here are some of the cool features:

  • Admin

    • A full blown AJAX based Administration console to manage the whole app.
  • Yes, you can control multiple Galleries and multiple Albums for each of it.
  • Architecture

    • A slick architecture that allows us to extend to any new feature easily in the future [modular system].
    • We will also have a community where we have contributions for Themes and Skins, could even include Plugins…
  • Default Album Types:

    • Flickr
    • Picasa
    • Manual Image Uploads [multiple]
  • A huge list of properties / features you can toggle from the admin interface.
  • Themes

    • Themes give you full control over the layout of the Gallery
    • Elements / Buttons / Controls on the Gallery are a part of Themes
  • Skins

    • Skins are the look & feel of the Theme.
    • You can have multiple Skins for a Theme
    • Image based skinning system
    • XML controlled positioning of elements

NOTE: We are still engineering and your ideas will be highly appreciated.

CSS Menu Contest

August 26th, 2008 | No Comments | Posted in Uncategorized

 iTouch

Submit cool CSS menus to win an 8GB iPod Touch.

Most Desired WordPress Hacks: 11 Common Requests and Fixes

August 26th, 2008 | No Comments | Posted in Uncategorized

This is the first article in our new three-part WordPress series. I want to share with you some hacks that i found to be very useful when i was working on the redesign of Noupe and during the design of my other site Devsnippets. Throughout this article, we’ll be focus on many WordPress Theme hacks, ideas, tips and useful tutorials you need to have ready in hand when developing WordPress websites.

You might be interested to check out our previous four part series, "Powerful guide to master Your WordPress Theme</a

So let’s get started and don’t forget to subscribe to our RSS-Feed to keep track on our next post in this series.

Using Custom Fields to Display Post Thumbnails



One of the most interesting features in WordPress is using Custom Fields, which can turn your WordPress blog into a fully customizable CMS website. I use custom fields to create image thumbnail for each post here on Noupe and on Devsnippets as well and display the thumbnails on the home page and the Archive page.

Follow the steps below and you will get it ready

  1. You need to be able to upload images to your server in order to do this. You can do this using your FTP Client or any WordPress plugins to help you upload your images through the admin area.
  2. Open a new post and scroll all the way down to the bottom where it says Custom Fields. Click on the plus button to expand it.
  3. Enter the word “image_thumb” in the “key” field, and enter the fill path of the image that you uploaded in the “Value” field.
  4. Do what you usually do in every post: add title, post text, choose a category and publish.
  5. Now open your index.php file that is in your current theme folder, search for this line:
    
    <?php the_content('Read the rest of this entry &raquo;'); ?>
    
  6. Add the following code above that line
    
    <a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><img src="<?php $values = get_post_custom_values("image_thumb"); echo $values[0]; ?>" alt="<?php the_title(); ?>" /></a>
    

Other great Solutions

Avoiding Duplicate Content

Duplicate content refers to two or more web pages that have the same, or almost the same, content. We must avoid duplicate content to not get penalized by search engines. But sometimes we need to show two (or more) lists of posts on one page, we usually do this by using Multiple Loops (one standard loop and one from a certain category). This is done when you want to feature not only the very latest post written, but also posts from a certain category.

  <?php $my_query = new WP_Query('category_name=featured&showposts=1');
  while ($my_query->have_posts()) : $my_query->the_post();
  $do_not_duplicate = $post->ID;?>
    <!-- Do stuff... -->
  <?php endwhile; ?>
    <!-- Do other stuff... -->
  <?php if (have_posts()) : while (have_posts()) : the_post();
  if( $post->ID == $do_not_duplicate ) continue; update_post_caches($posts); ?>
   <!-- Do stuff... -->
  <?php endwhile; endif; ?>

Other Solutions

Login Box in your sidebar



When i was designing DevSnippets, i wanted the users to easily login through the front page and skip the login page. Many solutions are out there and i found a good one at WPdesigner, i will add the code here just in case we don’t find it in the future.

	<li>
		<?php global $user_ID, $user_identity, $user_level ?>
		<?php if ( $user_ID ) : ?>
		<h2>Control panel</h2>
		<ul>
			<li>Identified as <strong><?php echo $user_identity ?></strong>.
			<ul>
				<li><a href="<?php bloginfo('url') ?>/wp-admin/">Dashboard</a></li>

				<?php if ( $user_level >= 1 ) : ?>
				<li><a href="<?php bloginfo('url') ?>/wp-admin/post-new.php">Write an article</a></li>
				<?php endif // $user_level >= 1 ?>

				<li><a href="<?php bloginfo('url') ?>/wp-admin/profile.php">Profile and personal options</a></li>
				<li><a href="<?php bloginfo('url') ?>/wp-login.php?action=logout&amp;redirect_to=<?php echo urlencode($_SERVER['REQUEST_URI']) ?>">Exit</a></li>
			</ul>
			</li>
		</ul>

		<?php elseif ( get_option('users_can_register') ) : ?>

		<h2>Identification</h2>
		<ul>
			<li>
			<form action="<?php bloginfo('url') ?>/wp-login.php" method="post">
				<p>
				<label for="log"><input type="text" name="log" id="log" value="<?php echo wp_specialchars(stripslashes($user_login), 1) ?>" size="22" /> User</label><br />
				<label for="pwd"><input type="password" name="pwd" id="pwd" size="22" /> Password</label><br />
				<input type="submit" name="submit" value="Send" class="button" />
				<label for="rememberme"><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever" /> Remember me</label><br />
				</p>
				<input type="hidden" name="redirect_to" value="<?php echo $_SERVER['REQUEST_URI']; ?>"/>
			</form>
			</li>

			<li><a href="<?php bloginfo('url') ?>/wp-register.php">Register</a></li>
			<li><a href="<?php bloginfo('url') ?>/wp-login.php?action=lostpassword">Recover password</a></li>
		</ul>

		<?php endif // get_option('users_can_register') ?>

	</li>

Of course later i wanted to make it even more easier and prettier to register and login through the front page and skip the login and register pages, so we coded a small widget using Prototype to switch between the login and registration box all on the front page. I will write a tutorial about this very soon.

Creating a menu Showing Certain Categories



If you would like to have a menu like the one we have here at noupe, to show certain categories, just add the line of code below and style it as you wish.


<ul class="topmenubar" style="float:left; width:720px;">
<?php wp_list_categories('orderby=name&include=7,72,23,16,1,7,17,26'); ?>
</ul>

The template tag, wp_list_categories, displays a list of Categories as links. You can Include or Exclude Categories as you wish, just enter the category id and don’t forget to add the “include” or the “exclude” parameters to manage it.

By default, wp_list_categories() generates nested unordered lists (ul) within a single list item (li) titled “Categories”. You can style that list item with a CSS selector.

Other great Solutions

  • Display categories in horizontal Drop-Down menu- This tutorial will explain how to create a horizontal menu bar showing the main categories and sub menus showing the sub-categories using CSS and javascript.


  • Multi-level Navigation Plugin for WordPress- The plugin generates the code necessary to create a Son of Suckerfish horizontal dropdown, vertical flyout or horizontal slider menu. You have control over what items (pages, categories, archives, blogroll etc.) appear in your dropdown via the plugins options page.

Display Categories in a Dropdown box

Sometimes you want to displays a list of categories in a select (i.e dropdown) box with no submit button. The easiest way to do this is use the wp_dropdown_categories template tag.


<form action="<?php bloginfo('url'); ?>/" method="get">
    <?php
	  $select = wp_dropdown_categories('show_option_none=Select Category&show_count=1&orderby=name&echo=0&selected=6');
	  $select = preg_replace("#<select([^>]*)>#", "<select$1 onchange='return this.form.submit()'>", $select);
	  echo $select;
	?>
    <noscript><input type="submit" value="View" /></noscript>
</form>

Most Wanted Posts and Categories hacks

How to exclude certain categories from being displayed in the loop.


<?php if ( have_posts() ) : query_posts($query_string .'&cat=-13,-26'); while ( have_posts() ) : the_post(); ?>
  • Advanced Category Excluder- The main goal of this plugin is to enhance WordPress’s functionalities by hiding some unwanted categories, from defined parts of the blog like: your search results, your RSS feed listing, your category listing, and also your entry page, if you want to.

How to display posts from a certain category

If you want to display certain posts from a certain category like the one i am using for the news section on Devsnippets.


<ul  class="news">
     <?php query_posts('cat=6&showposts=5'); ?>
     <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

Post Author Related Solutions

Having multiple authors on your blog is really fun, we need to have good solutions to have nice custom author pages, show their latest posts, highlight author Comments in WordPress posts, show their avatars and author bio below every post.

Getting Author Page on your WordPress blog

By default WordPress will use the author.php then the archive.php file then your index.php file to display the author info. That is, if you do not have an author.php file, WordPress will check for archive.php, and so on.

So, if you want to change the look of your author pages, you need to create an author.php file if it doesn’t exist, by copying archive.php if that file exists, or index.php if it doesn’t.

If you want to show the author’s main website, email contact, and biography, helping readers learn more about the author.

Articles by <?php the_author(); ?>
Author Website: <?php the_author_url(); ?>
Author Email: <?php the_author_email(); ?>
Author Bio: <?php the_author_description(); ?>

Solution

Display Author Bio below each Post

If you want to have that handy little author bio box at the top of the article with an author photo, you can do the following:



Solution

Separate Author comments from other comments

When you have multiple authors on your blog, you will need to style the author comments differently, here is how you can do it:


<li class="<?php if ($comment->comment_author_email == "authorname@domain.com") echo 'author'; else if ($comment->comment_author_email == "anotherauthorname@domain.com") echo 'author2'; else if ($comment->comment_author_email == "thirdauthorname@domain.com") echo 'author3'; else echo $oddcomment; ?> item" id="comment-<?php comment_ID() ?>">

Display Twitter Messages on your blog

If you want to display your Twitter status on your blog instead of using Twitter-hosted scripts to save loading time.

How to

  • Twitter Tools- Twitter Tools is a plugin that creates a complete integration between your WordPress blog and your Twitter account.
  • twitterRSS- This plugin allows you to pull in an rss feed from your twitter account and display it on your site.

Noupe´s Fresh Look, BIG Thanks and New Series

August 25th, 2008 | No Comments | Posted in Uncategorized

After one year using that brownish layout the time for a change has come.
With over 10,000 subscribers, it’s been a great year. We’re celebrating with a new look, and some changes to make the new design better.

If you’re reading this in your RSS reader, please click through onto the site to see the new look. Let me know what you think of it!

I needed to improve the usability of the site by making navigation easier and directing visitors to the appropriate parts of the site, also i felt it was too busy.

Also i was really trying to validate the HTML of the site, so its now more valid with couple of errors here and there.

Anyways, we are still adjusting the new layout, so you may find some glitches. Feel free to report us about any problem you might have or if you have suggestions or critics as well. We’d love to hear from you.

On the other hand, we are planning to publish a new series of for WordPress designers with amazing hacks to tweak your blog as you need, new resources, ideas and inspiration.

New writers are Welcomed!

As you may know, we are looking for talented and professional writers and authors. If you think that you are one of themc, send us your ideas at info[at]noupedotcom.

Big Thanks goes to:

I would like to thank all of you for your great suggestions and contributions, we wouldn’t make it without you.

Also i owe a lot of thanks to the great blogs in the same niche as this one. Some of the best are Vandelay Design, CSSGlobe, CSSDrive, Freelancefolder, Wefunction, DesignFloat, justcreativedesign, Design Flavr, Six Revisions, SmashingMagazine, Abduzeedo, Problogdesign, DavidHellmann ifohdesigns.

Special thanks goes to Chris Coyer, David Walsh for helping me with the DevSnippets small widget at the right column here, i wanted to get the direct link to the source articles and couldn’t do it without their help.


Great Sponsors

I want to say thank you to all our great sponsors for helping keep NOUPE running at full steam.

So what would like to see more?

Well, it is your decision. Since we wouldn’t be able to do it without you, which is why we would like you to decide what you want to see more on NOUPE.

So, what do you think? Thoughts, comments? I’d love to hear them all!

Typographic Techniques in Adobe Illustrator

August 24th, 2008 | No Comments | Posted in Uncategorized
If you had any ideas or questions about designing type with Illustrator, take a look at this image-based tororial. It covers techniques like: transfering sketches type into vector-based format, using templates, stroke cap options, outlining stroke and balance. Click on the image to see the full tutorial.Thanks to inde-graphics

Adobe MAX 2008/2009

August 23rd, 2008 | No Comments | Posted in Uncategorized
MAX is an experience unlike any other — an opportunity to connect with thousands of designers, developers, partners, executives, and Adobe staff for education, inspiration, and community. MAX 2008/2009 will be held in San Francisco, Milan, and Tokyo. Be sure to mark your calendar for this important global event. More here and here

Sydney Opera House Vector

August 22nd, 2008 | No Comments | Posted in Uncategorized
The Sydney Opera House in vector format. Free stock from limeshot. To use open the PDF file with Adobe Illustrator. Download

dfMarine for Blogger

August 21st, 2008 | No Comments | Posted in Uncategorized

The dfMarine theme which we initially released for Wordpress is now on Blogger.

Marine Theme

Demo

Download

This file has been downloaded 51 times.

Converted to Blogger by Templates Novo Blogger.