Since I started uploading a selection of free stacks to the ThemeFlood website, a number of people have been downloading them. Quite a few people have not downloaded new stacks before, so the installation process is confusing a few people. Unlike RapidWeaver themes, plugins and snippets, stacks do not install themselves. Each stack is formed of a standard folder called widget.stack or similar. Once this is downloaded an un-zipped, it must be installed manually into the correct folder in order for stacks to see it and add it to the stacks library.

All stacks should be copied over to ~/Library/Application Support/RapidWeaver/Stacks/ where ~ is the name of your home directory.

Here is a quick video to illustrate this better:

Screen Recording - Computer

I'll admit I'm not much of a social networker! I'm proud to have been one of the first onboard the Twitter train, and indeed I use Twitter as an effective business tool. But as for the whole facebook / myspace malarkey, to be honest this is just kids-play in my eyes and not something I can be bothered with. A client recently asked me to setup a FeedFriend widget in the sidebar of their blog. Friendfeed, unlike feedburner, is not a service I had previously heard of or come across so I had to quickly research this service and signup for an account. It is not very clear from the FriendFeed website what this service is or how it works. But basically FriendFeed is another form of social aggregator. Its purpose is to fetch information from your other social hide-outs such as Twitter, Blogger, Facebook, Tumblr, Delcious, Digg, Flicjr, Last.fm, and YouTube to name a few. When you post information to any of these services, FeedFriend pulls this information into a single consolidated list. This list of postings is sorted into date / time order and other FeedFriend members can subscribe and post comments. As of August 2009, FeedFriend has since been purchased by FaceBook.

Much like many social networking services, FeedFriend provide a widget (what we used to call HTML code) to paste into a website. This fetches your FeedFriend feed to display on a website for all to view. The code loads the FeedFriend content insider a rather gory looking window which has obviously been optimised for Internet Explorer 4. However as this article explains, it is possible to customise the FeedFriend widget so it works more in harmony with your chosen RapidWeaver theme.

Step 1
Log in to your FeedFriend account. Next to the search bar at the top, click on the blue Tools button. Under the tools section, scroll down to the sub heading "share your feed" and click the Embeddable Widgets link. Next you want to click the Feed Widget link which will land you on a page similar to the screen capture below:



Step 2
Choose how many entries are to be displayed. Five is the default value, but more active users may want to display more entries. It is recommended you untick the Logo and Subscribe link options. Ensure the Javascript option is ticked under the format section.

Step 3
Copy and paste the generated code snippet into the sidebar container of your RapidWeaver project or into the main content container. If pasting into a styled text input box, it would be recommended you highlight your code and go to Format > Ignore Formatting in RapidWeaver to clear away miscellaneous line breaks and other formatting.

Step 4
FeedFriend allow you to customise the appearance of your FeedFriend widget further using CSS code. Details of the selector names they use can be found here. This code should be entered into your custom CSS box under the Page Inspector in RapidWeaver. FriendFeed have incorrectly suggested that items such as font sizes should be implemented using point dimensions. This is incorrect and percentage or em values should be specified instead.

Tips:
Once you have confirmed your email address for using FriendFeed, options like the commenting should work. If you have set your FriendFeed to private (so others cannot view it) the widget will not work because access to it will be blocked.

Is it worth it?
The main advantage FriendFeed offers RapidWeaver users is the ability to consolidate many sources of social information into a simple digest with options for other FeedFriend users to comment on your entries. I think most people would probably prefer keeping content from different sources separate and easily distinguishable for readers. But if you are limited to space or unable to use some of the excellent social networking stacks available, then FeedFriend is a promising solution.

PlusKit is one of the most useful RapidWeaver plugins you can get and offers a single plugin with many different functions for improving projects. Probably the most frequently used function in PlusKit is ‘@import’ which gives you the ability to import the content of one page into another without the use of iFrames. Lets say for example you had a Twitter feed created with Stacks, you could use PlusKit to display that Twitter feed on another page such as a Blog or Styled Text page. It is a very useful function to have if you are working with lots of different page styles. Not all pages are compatible with PlusKit due to the way they are setup. But if you can work around this list of non-compatible pages, it is a fairly easy function to setup.


Step 1
With your RapidWeaver project open, go to File > Add Page in the RapidWeaver menu. From the list of plugins you have installed, select PlusKit. If you don’t see PlusKit on the list, you will need to download and install it from the Loghound Software website: Restart RapidWeaver for PlusKit to become available in your list of installed plugins.

Step 2
Rename your PlusKit page from untitled1 to something like PlusKit. Although this is not essential, it may stop you from accidently deleting the PlusKit page from your project. Each individual RapidWeaver project only requires 1 PlusKit page and this should be kept hidden. A hidden page will be dimmed out in the RapidWeaver page list.


Step 3
Switch RapidWeaver into edit mode. On the page you want to import content, enter the following:



This code can either be entered in the main content container of a page or in a sidebar. The choice is yours depending on where you want the content to be shown.

Step 4
Between the double open and close brackets, type the name of the page you wish to import. Page names are case sensitive so a page named Twitter Feed would be entered like this:



Step 5
Switch RapidWeaver into preview mode. The rendered content should then be visible.

Taking things a step further:
Some third-party RapidWeaver themes support the use of Extra Content which allows you to position content outside the normal editable bounds of a RapidWeaver theme or apply specialist styling. It is possible to use the @import function in conjunction with Extra Content. If for instance you had an Extra Content container named 4 which you wanted to put your Twitter feed inside, you would enter the following code in the sidebar:

<div id=”myExtraContent4”>

</div>


And you will find your @import function continues to work fine. Likewise if you are using the Stacks plugin by YourHead software, you will find that entering the @import code in a suitable stack produces the same results. It is this degree of flexibility that makes @import such a useful feature in PlusKit.

I am not going to hide the fact that Stacks (by YourHead Software) is probably my all time favourite RapidWeaver plugin. For those unaware of this plugin, Stacks enables you to quickly and effortlessly build professional looking pages which otherwise would have to be coded by hand using HTML and CSS.

Quite often when you are working with Stacks, as your layout comes together, you find yourself in a position where something doesn't look quite right on a certain page. Rather than delete stacks and remake them on another page, a trick I have adopted is to create a 'clipboard' page to stash my spare stacks in. This keeps them stored safely within the RapidWeaver project until I can find a use for them. You can also use the clipboard to store configured stacks in so they can be quickly copied to other pages. Here I will show you how to set up a clipboard page in your project to store stacks in and copy and paste stacks between pages.


Step 1:
Add a new Stacks page to your RapidWeaver project. Rename this page something like "Stacks Clipboard" or similar. Give it a short and relevant name so you wont accidently delete it.


Step 2:
While on your stacks clipboard page, open the RapidWeaver page inspector and click the general tab. Un-tick the first two options which are "Enabled" and "Show in menu". This will prevent your stacks clipboard being visible and showing in the navigation menu.



Step 3:
Stacks does not have a copy or paste button. But the standard copy and paste keyboard shortcuts in RapidWeaver work fine. In one of your stacks pages, click into edit mode and single-click the stack you want to make a copy of. It should be highlighted with a blue dotted border as shown below. Press the keyboard shortcut CMD and C to copy the stack.



Step 4:
Switch into your stack clipboard (remaining in edit mode) and single-click somewhere on the page. Then press the keyboard shortcut combination CMD and V to paste the stack into the clipboard. The pasted stack is normally rendered at the bottom of the stacks page, but you can click and drag it anywhere else in the page. Note that you can also copy and past stacks between RapidWeaver projects, so if for instance you have two projects open in RapidWeaver, you could copy a stack from one project into the other.

Another quick stacks tip:
Stacks makes use of some rather large inspector windows. On a small screen or when RapidWeaver is close the the screen edge, these inspector windows can be partially obscured by the screen edge. Clicking at the top of your stack inspector window (imagine there was a window title bar there) and dragging the inspector will 'snap' it off the stack and leave it free-floating on your screen. To close the stack inspector again, just click outside the stack inspector to minimise it again.

An excellent new resource worth bookmarking. The aptly named "Do's and Don'ts of Modern Web Design" offers a good range of tips and tricks with the aim of improving websites. The site is split into "Do" and "Don't" categories for easy reading. To be honest, many of the points raised have been discussed for so long now, that good developers should be following them by now. But it helps to see a site like this where all the information is condensed into useful "told you so" sized pieces! Should be some good information here for designers and developers alike.