Tools, Design tools that is.
Tool #1 – Sketch App by Bohemian Coding
Tools, Design tools that is.
Tool #1 – Sketch App by Bohemian Coding
New year, new site. It’s been a long and wonderful 2012. I’m excited for 2013 and all the new adventures both with my family and in the design/development field. I’m making a resolution to blog more so I can share my designs and learnings. I am very thankful for some great people and sites in the design field and I would like to give a shout out.
You gotta follow these guys, they were all these to me this year; friends, talented, inspiration, helpful, awesome, had integrity, looked up too, giving, followers of Jesus, uniquely gifted, bros, humble, and much more.
I’m very glad to be in this field of Design and Development, wouldn’t have chosen anything else to work in. I hope to release some more WordPress themes this year for free and design resources.
Happy 2013 and beyond!
The best way to understand how to use multiple loops is to actually show an example of its use. Perhaps the most common use of multiple loops is to show two (or more) lists of posts on one page. This is often done when a webmaster wants to feature not only the very latest post written, but also posts from a certain category.
Leaving all formatting and CSS issues aside, let us assume we want to have two lists of posts. One which would list the most recent posts (the standard 10 posts most recently added), and another which would contain only one post from the category ‘featured’. Posts in the ‘featured’ category should be shown first, followed by the second listing of posts (the standard). The catch is that no post should appear in both categories.
Step 1. Get only one post from the ‘featured’ category.
have_posts()) : $my_query->the_post(); $do_not_duplicate = $post->ID; ?>
In English the above code would read:
Set $my_query equal to the result of querying all posts where the category is named featured and by the way, get me one post only. Also, set the variable $do_not_duplicate equal to the ID number of the single post returned. Recall that the Do stuff line represents all the formatting options associated for the post retrieved.
Note that we will need the value of $do_not_duplicate in the next step to ensure that the same post doesn’t appear in both lists.
Step 2. The second loop, get the X latest posts (except one).
The following code gets X recent posts (as defined in WordPress preferences) save the one already displayed from the first loop and displays them according to Do stuff.
ID == $do_not_duplicate ) continue;?>
In English the above code would read:
Get all posts, where a post equals $do_not_duplicate then just do nothing (continue), otherwise display all the other the posts according to Do stuff. Also, update the cache so the tagging and keyword plugins play nice. Recall, $do_not_duplicate variable contains the ID of the post already displayed.
The End Result
Here is what the final piece of code looks like without any formatting:
have_posts()) : $my_query->the_post(); $do_not_duplicate = $post->ID;?> ID == $do_not_duplicate ) continue; ?>
The end result would be a page with two lists. The first list contains only one post — the most recent post from the ‘feature’ category. The second list will contain X recent posts (as defined in WordPress preferences) except the post that is already shown in the first list. So, once the feature post is replaced with a new one, the previous feature will show up in standard post list section below (depending on how many posts you choose to display and on the post frequency). This technique (or similar) has been used by many in conjunction with knowledge of the Template Hierarchy to create a different look for home.php and index.php.
This information was found at WordPress.com’s Loop docs at wordpress.org
My second theme release for WordPress called Theme Starter. You can find my first theme here.
This theme is 3.0 compatible. This theme is meant to be a single theme starter for those that need a starting place without trying to take apart a more complex theme. It uses the 3.0 navigation, and includes the post thumbnails (option).
the_post_thumbnail(); to uses the post thumbnail feature.
Here is a screenshot:
Here is a Live Demo
And you can find the download here: Theme Starter
WordPress has 9,992 plugins (at the time of this post) available on their Plugin Directory. I use an average amount of plugins for my client sites and personal sites, usually it varies per site. Part of my daily routine is to check out the 1000’s of new feeds that are related to my design and development. Half of them are WordPress related and over time I have download, tested, tweaked, and recommended 100’s of plugins. A friend on twitter @joshhemsley mentioned that I should do a post about my findings of WordPress plugins. Take a look and if you have any to add to the list leave a comment. So, here it goes…
GigPress is a powerful WordPress plugin designed for musicians and other performers. Manage all of your upcoming and past performances right from within the WordPress admin, and display them on your site using simple shortcodes, PHP template tags, or the GigPress widget on your WordPress-powered website.
by Rocket Genius
WordPress form Management plugin
Conditional Form Fields
Enhanced Post Custom Fields
Dynamic Field Population
Post Category Field & Image Field
Easily Pass Data To Confirmation Page
Visually Create Forms with Our Sleek Editor
by Alison Barret
SimpleMap is a powerful and easy-to-use international store locator plugin. It has an intuitive interface and is completely customizable. Its search features make it easy for your users to find your locations quickly.
by Alex King
This plugin integrates your WordPress blog with your Twitter account allowing you to send new blog posts to Twitter as a tweet and and vice versa. Cross-promotion of a blog posts to Twitter is fairly common and can be automatically achieved with Twitter Tools. You can also create digests that consolidate all of your tweets. Also, the plugin is entirely pluggable and can be extended just like WordPress itself.
by Alex King
MailChimp’s Analytics360 plugin allows you to pull Google Analytics and MailChimp data directly into your dashboard, so you can access robust analytics tools without leaving WordPress. Using the Google Analytics API and the MailChimp API, you’re treated to the elegant user experience you expect from both platforms. Instantly connect the dots (literally) between posts, email campaigns, and your site’s traffic.
Automatically add links to your favorite social bookmarking sites on your posts, pages and in your RSS feed. You can choose from 99 different social bookmarking sites!
The Social Media Marketing Plugin that lets you put social bookmarking links in your posts and other pages. Help your readers promote your blog!
With Facebook’s recent release of the new Open Graph, you can now update your fans on Facebook when something on a page they’ve liked has changed! WP Facebook puts your posts, pages, and other types of content on Facebooks Open Graph where they belong!
by Simon Wheatley
This plugin adds a checkbox, “include this page in menus”, which is checked by default. If you uncheck it, the page will not appear in any listings of pages (which includes, and is usually limited to, your page navigation menus).
by Lester ‘GaMerZ’ Chan
Allows you to optimize database, repair database, backup database, restore database, delete backup database , drop/empty tables and run selected queries. Supports automatic scheduling of backing up and optimizing of database.
by John Blackbourn
Completely disables the plugin update checking system in WordPress. The plugin prevents WordPress from checking for updates, and prevents any notifications from being displayed on the Plugins page. Ideal for administrators of multiple WordPress installations.
by Nathan Rice
The WP-Cycle plugin allows you to upload images from your computer, which will then be used to generate a jQuery Cycle Plugin slideshow of the images.
Each image can also be given a URL which, when the image is active in the slideshow, will be used as an anchor wrapper around the image, turning the image into a link to the URL you specified. The slideshow is set to pause when the user hovers over the slideshow images, giving them ample time to click the link. Images can also be deleted via the plugins Administration page.
by Vinicius Massuchetto, Krizalis, Bojan Josifoski
This plugins is nothing else than a front-end to the nice S3Slider jQuery plugin that lets you:
Upload and crop images;
Set the size, order and timout of the slider;
Edit a text to be shown on each image;
by Anna-marie Redpath
This simple ‘utility’ plugin allows one to have any widget used in a page shortcode in any theme – no need to use the hybrid theme or create a special template.
The plugin is made for easily embedding videos into a blog post. The videos can be integrated from external portals (like YouTube, Google Video and many many others) or they can be uploaded to the web server or a remote server and integrated as well. Additionally a corresponding link to the video on the particular video portal page or a download link to the local file can be generated automatically, if demanded.
by Backend Labs, Inc.
Have you tried all the other testimonial plugins for WordPress? Do they all suck? With our plugin you can easily manage the testimonials for your website. We allow you to configure the testimonial prefix, suffix, and even the number of testimonials displayed on your WordPress site.
You can feature, sort, and set the status (Hidden, Pending, Public) of testimonials. We even allow you to have a form so your users can submit testimonials right on your website. Best of all, they are marked pending and require your approval before they go public!
This is a very useful sidebar addition, as it can be used to display all sorts of useful information in a list format – news updates, site updates, software updates, etc. All you need is the URL of the RSS feed.
by Ben Millett
by Aaron Harun
AJAXed WordPress (aWP) is an extremely powerful plugin that harnesses the power of AJAX and WordPress to improve the user experience, the administration capabilities and the design potential of any WordPress based blog.
by Brahim Machkouri
Assigns icons to categories
by Dave Rupert
Uses the signature Dribbble shot CSS.
Specify the number of shots (up to 10).
You can enable/disable drop shadow.
by Dan Zappone
Lightbox Plus implements ColorBox as a lightbox image overlay tool for WordPress. ColorBox was created by Jack Moore and is licensed under the MIT License. Lightbox Plus permits users to view larger versions of images without having to leave the current page, and is also able to display simple slide shows.
This Plugin is an enhancement for WordPress’s comment function. It enables users to reply on a exist comment, and the discussion will be displayed threaded or nested.
Some other links for plugins and plugin development.
Because of CSSEdit’s unique focus on style sheets, it offers a wide range of features for any level of expertise. Starting out? Selector Builder and advanced visual editors will gradually help you understand CSS instead of dumbing you down.
For anyone well-versed in CSS, the Live Preview and intelligent source environment are invaluable tools to get your website or application styled in a fraction of the time it took before. Add powerful X-Ray web page inspection, and you’ve got an unbeatable CSS debugging suite.
CSSEdit offers unrivaled real-time styling of absolutely any web page. Even when your dynamic Web App is powered by a complex database or makes use of advanced AJAX, you can style and analyze it without the hassle of uploading or refreshing.
Design beautiful, innovative and fast-loading web sites… with a beautiful, innovative and fast app. CSSEdit‘s intuitive approach to style sheets and powerful previewing features will make you deliver awesome standards-based sites in no time!
I recently had a chance to submit my web design portfolio to a very well known and well designed magazine called Web Designer Magazine. A couple a months ago I recieved an email from them saying I got accepted. I was thrilled and super excited. My article is in May magazine, Issue 170. Here is a screenshot from my iPad.
I was recently working on my logo for Brisk Studios and I was having trouble and was tired of my current “brand”.
I wanted something fresh and bold. Something that would be to spread across all the branding types of media like business cards, website, letterheads, etc..
With today’s designers and the charity of their works and projects, I came across a site: tenbytwenty
He had posted a free font that I really like called “Nevis”
I definitely like sans-serif fonts and bold typefaces. I wanted the logo to have the letters B and S, but I wanted to add a little flare to it. Which gave me an idea to incorporate in my design. Lightning!
Lightning has some great qualities like: powerful, quick, energy, and light. The Definition of my last name Brisk is active, fast, energetic. So I thought to myself what a great connection.
Here are the sketches from the starting process:
I finally came up with something I felt fit me.
I was really happy with the final outcome, I was able to use that logo to make new business cards, new website design, and a new outlook on my business.
My new business cards:
My new website:
Conclusion: Thank you design community for the inspiration, free fonts, and encouragement. I hope this post will inspire someone else to use the high quality resources that are around and feel good about creating a brand for themselves.
I’m happy to announce today for download the release of my first custom WordPress theme called Squared 2! It still has some little minor things including no support for IE, but I’ll let the the wordpress dev’s take care of changing that.
You can see a live demo here.
So without further ado your download link:
Any questions or support needed feel free to leave it in the comments section. Thanks.
UPDATE: In the next version 1.1 I will be including a help text and fixes.
Custom Photography Blogs is going live on Aug. 31st and I can’t wait to proudly announce it on Monday. CPB is started by Jane Johnson who is a creative and passionate photographer who knows that every photographer wants their own person blog that they can express their photos and creativity. Just like she does.
I’m the other half of the project, I build what she designs, see my other post on the process we go through to build these custom blogs. We use WordPress for all of the photography blogs. We want people to be able to afford a custom blog so that’s where we come in, we design custom photographer blogs each with their own personality at a price that they don’t have to break the bank.
Preview of the home page:
Jane is a great person, has a passion for perfection and knows what she wants. She has made me a better designer and coder because of that. If you’re interested in a custom blog please check out Custom Photography Blogs.
You can also follow Jane on twitter.