Net-at-hand Developer

Back when I first made the default design theme available for download, the tools that I was using to build it were mac apps that handled the SASS processing and whatever else needed to be done.

Nowadays, however, I’m using open source node modules that are more useful, powerful, and readily available. It’s also easier to make my setup freely available for others to use. So to that end I’ve been releasing my setup and the design theme itself on github.

So now I’ve got a few resources available for the Net-at-hand developer that wants some help getting set up to modify a responsive design theme for their own clients. Here’s what is available:

• The design theme on github.. This is the place to start. It has instructions for how to use it and what you need to do to get the setup running.
• Basic setup instructions. This walks you through setting up your development environment to use the tools that are downloaded by the design theme.
• A screencast showing how it works It’s easier to get an understanding of how something works when you can see it being done.

I’ve you’ve you need some help getting this figured out, reach out to me on Twitter or just contact support in the Net-at-hand admin pages.

The first downloadable design theme is now available on the download page. It is the Default theme which is used by this site and is a responsive design that adjusts automatically to the size of the screen that is viewing it, whether it be a large desktop monitor or a smartphone.

This should be a great theme to build your own designs on. Let me know if you have any questions about how it works.

I just finished adding a feature that will allow you to add attributes to image attachments. You can add id, class, or style attributes using the normal textile syntax.

read more

At some point in the future, we hope to make it possible to use Sass instead of straight CSS for your design themes.

Mark has been using Sass lately in developing design themes for his clients and has kind of fallen in love with it. There is so much that you can do with it that really cuts down on development time (he uses CodeKit for preprocessing his Sass files).

While you cannot yet use Sass in your design themes, we have added the capability of parsing Sass-style variables within your CSS file. So if you define your variables at the beginning of the document, you can use those variables throughout the document wherever you wish.

For example, if you define these variables:

$blue-color: #00f;
$red-color: #f00;

at the beginning of the CSS file, then anywhere that you put the variable name within the file, it will be replaced with whatever you define as the value.

Note that the syntax is pretty strict, so if you don’t get the results you are expecting, double check the syntax. Net-at-hand won’t find the errors for you, it simply won’t work if it’s not right.

Design themes that you create for your clients now have new features that you can enable.

Javascript Libraries

There are now three different javascript libraries that you can load automatically for any site that is using the design theme. When you enable the libraries they will get loaded in the document head for the site.

• swfobject is on by default since it is used by the current Net-at-hand audio player. However if your client doesn’t really use audio files then there is no need to have it running.
• Jquery has become pretty standard for sites that are wanting to do any significant javascript work. You can read more about it here.
• Jquery UI adds many different widgets on top of jquery. You can read more about it here.

Text for HTML head

There is now a field for the design that allows you to put additional tags within the HTML head for the design. Every page on the site will include the text that you put here. You can use this for loading additional libraries or any other item that you wish to put in the document’s head for the site.

These features were previously available via a plugin, which is still available, but it is more limited in that you cannot override what you put here for special pages.

Why?

These features were added in preparation for a new mobile-friendly design theme group that will be added in the near future. The theme requires a specific meta tag in order to be viewed properly on smart phones, and this new feature will allow us to do that on a theme basis instead of having to install plugins on a site basis.

When the theme is done we’ll be posting it here so you can use it as the basis for your own projects.