Posts Tagged ‘tutorials’

This tutorial provides advice for sorting posts when telling a story in WordPress. The default display of posts in WordPress is chronological with the most recent being first at the top of the page. For storytelling you may want your posts to display in a more logical order for the reader. There are options for bloggers telling a story in WordPress to have posts display with episodes in a series much like a book chapter by chapter.

The first tutorial method is a simple modification of the code in your template. To display posts in reverse chronological order (oldest first) modify the index.php file in the wp-content/themes/[your theme]/ folder. Look for the line of code and above that add this line of code to have posts display in reverse ascending order.

The next tutorial advice is a WordPress plugin to handle sorting. To allow multiple options for the sort order, you may want to search WordPress for sorting plugins. Some provide options from the backend admin so you can set options for a variety of query types by date, time, author, and more, and then within each of those you may sort results with a second option. For example, the main sort could be by author with those results further sorted by a second field like category or date.

Caution: After reviewing several my advice is checking plugin compatibility to your WordPress installation version before installing.

Finally, this third tutorial and option comes from a WordPress hosted blog of poetry written by my late Grandmother. My choice was to override the WordPress default maximum posts listed, which is 15, and have all 39 poem titles listed alphabetically in the sidebar. After all poem content was prepared and later published in one day in a random order, I created a custom html/text widget to replace the list of recent posts with the alphabetical list of all poems here.

The custom html WordPress widget concept works when the blog content is fixed like that one-time list of all poems, or in a story that gets posted as episodes and the last chapter is published. Just add new links to the sidebar widget as new episodes are posted until complete.

There are more WordPress sort plugins and tutorials, and certainly may be new ones by the time you view this post. The good news is there are options for controlling post chronological sorts when telling a story in WordPress.

The illustration below shows the 6 steps used in the avatar photo edit tutorial to create a new graphic for this Life with Corky puppy website and his CorkyStory Twitter account.

The large photo left is the original photo of the dog taken while going for a ride. The large photo right is the new avatar with a more dramatic look including a blurred background and better contrast on the puppy’s face.

Tutorial steps from before (left) and after (right) are included below the illustration:

Tutorial sequence for avatar photo edit in 6 steps marked A through F:

A: Original photo without any edits. Zoomed in to trace the puppy’s head.
B: Photo mask filled form (in red) made by tracing in the previous step.
C: Clipped puppy’s head in vector artwork with all background removed.
D: Original photo (A) cloned with blur applied to the entire photograph.
E: The cropped head from (C) is placed on top of the blurred photo (D).
F: Brightness adjustments of the cropped head creates the final version.

Besides the links above to the home page and the Twitter account, the original photo of Corky the puppy before cropping may be viewed on Corky’s website on page 3 of his Fleet Peeples Dog Park photo gallery at LifeWithCorky.com.

The podcast episode in August 2008 with the do-it-yourself desktop blog and ping tutorial presented a potential problem of broadcasting blog updates for owners with multiple blogs. From testing the free software it was apparent at the time that listing multiple blogs would ping all of them even if only one was updated.

Owners with multiple blogs faced the problem of announcing updates to blog tracking services when in fact only one of several blogs were updated. The solution given at the time was to have separate installations and icons on your desktop for each blog. From my experience since then, and facing this very problem, the solution was simpler than I imagined.

Rather than multiple desktop icons I only list one blog in the program and feature just one blog and ping icon on the desktop. When updating one of my 6-7 blogs I do a quick edit using copy and paste as follows. From the top tool bar select “Menu” and then “Your Blogs” from the drop down menu, and then “Edit Blog” for the single blog listed.

Next, change the title and then copy/paste your blog URL into the next 3 boxes being sure to leave the trailing RSS link in the last box. Save, exit, and then ping and you’re done. Exit the program and then edit the title and URL with copy/paste the next time you update one of your multiple blogs.

This simple method takes 60 seconds to edit each time you post to one of your blogs, so it is efficient without the extra clutter of multiple software installation icons on your desktop.

With the recent GoDaddy web design makeover for a revised look including new navigation, their email tutorials provide a great tool for customers who favor this very popular domain registrar and hosting service company. Follow this link to the list of GoDaddy email tutorials to learn how to setup email service on your personal computer.

Often my web design clients opt for the free email forwarding included with a new domain or hosting purchase. While you may easily have email for info@(your domain) forward to your free email account at services like Google GMail, Yahoo!, or AOL, there is a downside. For small business owners in particular your image as a professional organization will be enhanced if your return emails are sent directly from an email account that matches your domain name.

Customers emailing you from your website where an info@ or sales@ email link includes the domain name may feel you lack sophistication, or even be unpleasantly surprised, if the return message uses a free email service provider. The GoDaddy email tutorials make enhancing your corportate image easier than ever. The strategy of creating a favorable first impression will be reinforced with a gorgeous web design and matching email to your domain, and then make sure to send return emails from that same address.

This advanced photo edit tutorial in Xara Xtreme shows an example of how to hide unwanted portions of a photograph for web graphics in custom web design. The process from start to finish took 5 minutes. In this case the web graphic needed to be revised to remove the toddler playing in the hallway. Here’s how the photo edit was done in a series of 6 illustrations marked A to E:

Photo A (below left) shows the original photo taken by the client which displays the toddler to be removed. Viewing the carpet, floor trim, and wall to the right of the baby, I selected a vertical portion taller than the person, and created a rectangular clipping mask as shown in photo B (below right).

Photo C (below left) shows the cropped vertical section of the carpet/trim/wall taken from a cloned duplicate of the photo. The original photo placed in the background has 65% transparency applied in preparation for the next step.

Photo D (below right) shows the carpet/trim/wall clipping stretched horizontally to cover the toddler and part of the background decor. To create a realistic graphic, solving the problem of the clipping covering the planter and leaves will be next.

Photo E (below left) shows less transparency on the background, and some transparency of the carpet/trim/wall for an enhanced view, and then the clipping mask drawn precisely over the planter and leaves without revealing any of the toddler. Select the mask and carpet/trim/wall graphic and use CTRL+2 to crop the masked portion.

Photo F (below right) shows the final web graphic after removing transparency of both pieces to digitally create the new photo. The carpet/trim/wall piece has feathering applied so it blends in better with the background, and now the photo is ready to insert in their custom web design.

Users of Xara Xtreme may use shortcut CTRL+K for cloning and CTRL+B and F to send pix front or back during the edit. Select the mask and photo then use CTRL+3 to crop. The only other feature needed in Xara is the feathering tool. For higher quality work for print rather than in a web design, use the steps in this photo edit tutorial to begin, and then zoom in for more precision.

Email inquiries received this week from two visitors asked for advice about web design audio and video tips including audio or video templates. Advice given on web design for podcasts, audio books, and video tutorials is presented here for all website and blog or podcast owners.

Here’s some advice for do-it-yourself multimedia audio or video production. The steps involve planning, production, and distribution, so understanding more details helps me offer advice for each step. As just one example, if multimedia is informal just for site visitors, or a downloadable video, you most likely won’t need a CD cover or other artwork unless you need something virtual like an online website graphic.

If I had to specify a quality range for production it would be 1) amateur, 2) advanced, and 3) professional and certainly the costs for production would relate to the quality requirements.

My podcast of web design advice is done at home with a usb stereo microphone and then I use Audacity (freeware) to edit out the uhms, ahhs, and mistakes. I then mix the background music and narration tracks into a single mp3 file. The same process is used in website video production for screencast tutorials on my site except I’m adding the audio track to the video during post production edit.

For podcast episodes, audio interviews, or free online video tutorials I’m content with advanced level quality. For multimedia intended for sale my advice would be higher quality equipment beginning with a condenser microphone to achieve the professional level. Booking time in a recording studio would ensure top quality depending on your audience and budget.

For my readers and site visitors interested in web design services and assistance in do-it-yourself projects for audio or video, be prepared by providing details on those key steps: planning, production, and distribution. Custom website design services include html or xhtml code templates plus scripts or flash for audio players or video players to add to a custom web design.

The topic for the next episode of the Small Business Website Mailbag web design podcast will cover trends in blog and ping services. From personal experience, and after feedback from a custom cms web design client for custom blogger template design, some ping services for broadcasting new blog post announcements may be in trouble.

Some have closed their websites, and others have been offline for weeks or provided sporadic service. One blog pinging service website changed their home page to a simple announcement that they closed after 4 years due to the time and effort required to track millions of blogs. A free service depends on sponsors or ad revenue to provide an incentive to stay in business. Do-it-yourself blog and ping may be the best alternative.

In addition to the review of trends in blog and ping services, I will introduce a do-it-yourself desktop solution for adding a blog and ping icon on your computer. This is an open source program that I have modified to update the list of target blog tracking services, and podcast listeners will receive links and a blog and ping tutorial that allows them to directly ping services from their desktop.

This blog and ping desktop solution for broadcasting updates to your blog eliminates the middleman, so bloggers may announce blog updates in less than 60 seconds after posting. The software download and custom modification instructions included in the tutorial should take less than 5 minutes to install. You ping 8 major services with a single click, and then a text report lists each blog service with a pingback confirmation that the ping was received successfully.

Check the title and show notes later this week to listen to the podcast episode about do-it-yourself blog and ping for DIY blog promotion.

The free pdf cms web design and do-it-yourself seo ebook promised in last week’s podcast was released today. This web design and search engine optimization tutorial includes a list of 35 search phrases at #1 or #2 on Google page one about web design that brought visitors to this website. The seo results of natural methods for page optimization, and over 130 page one results in just 6 weeks provides proof the methods in the seo section of the tutorial do work.

Visit the CMS Web Design Tutorial Outline of the ebook on the main site to view the table of content, and then download your free copy or read this 50 page CMS Web Design DIY SEO Ebook online.

As usual, you do not have to register or provide an email address to download the cms web design and do-it-yourself-seo pdf ebook. See the seo methods and results that others pay $1000′s to learn with this 50 page free download seo ebook in pdf at no cost or obligation.

The newest page on the main site for web design using a CMS, or Content Management System, is an outline of the web design training tutorials provided to my clients for small business custom cms web design. The outline lists the initial 14 chapters of training materials in pdf that allow owners to create new content for their website without a requirement to learn html code. Some lessons may be released as video tutorials, also.

View the list of web design tutorials for cms clients here. Small business owners interested in do-it-yourself web design, or free website resources, may want to consider this outline for planning their web design project. If enough people ask, I may feature a public ebook version of the pdf training written with generic advice rather than customized for my cms web design clients only.

A new web design video tutorial demonstrates masking photographs to clip the background, and then combining two photos for a web graphic illustration. This client purchased a stock photo of a boxer being punched and wanted to convey a message about new internet users being abused in an upcoming web design. The second photo overlay in this web design graphic adds a business shirt and tie to the boxer’s bare chest to look more like an internet user.

Next, a new custom business card artwork gallery #2 features 50 more full color business card examples. Most include the business card front and back to show how card backs may be used for small ads, or a call to action. The gallery uses an advanced web design technique in CSS to display 50 cards larger than actual size in half an open browser window. Enlarged business card views display instantly as you mouse over the thumbnails, and do not use javascript or flash. In addition, each card has a caption describing the company business product or service in plain text for added SEO value.

Finally, both card galleries have a new comment for clients who want to order fewer than 5000 new business cards. The printer I recommend now offers 1000 2-sided full color UV coated cards for $30 plus tax and freight.

Watch the advanced photo edit video for web graphics on my main site, or view 100 examples of business card artwork in the original 50 card gallery or new Gallery 2 with 50 more designs, and then email me from any page with questions about custom graphic art for web design or print.