Syntax highlighting – now in our Liquid template editor

Until now the Theme Editor has displayed your theme’s Liquid template files in a very boring, black text field.

We think this makes it harder to edit and change your theme files than it needs to be, so we’ve added a bit of colour to the whole process.

Now, when you go to edit a theme’s Liquid file, you’ll see the text highlighted and colour-coded according to the syntax of the language. You’ll see HTML, CSS and Javascript as well as all the Liquid tags highlighted using different colours so that it makes it a lot easier to navigate your way around the file. In addition, strings, numbers and various other bits of punctuation are highlighted as well.

To round off this update, we’ve added line numbers on the left to make it easier to locate and refer to the code.

In technical terms, this is known as a syntax-directed editor, but we just call it easy to use.

Introducing SASS – Syntactically Awesome Spiffy Stores

Actually, it’s really “Syntactically Awesome Stylesheets”.

For all the theme designers out there, we’ve just made your life a little bit easier. We all know that sometimes CSS stylesheets can get complicated, so anything that can help you manage that complexity is a welcome bonus.

As you may already know, when you enable the Theme Editor by creating a ‘theme.settings‘ file, you can parse your CSS files by making sure they have a suffix of ‘.css.liquid‘.

Now, as part of the CSS processing that gets initiated to deal with the Liquid tags, we’ve added a pass through the SCSS processor, which is part of the SASS CSS extensions. You can read more about these CSS extensions at http://sass-lang.com

By using the CSS extensions, you can simplify your stylesheets by using variables, conditional logic, mixins and templates, nested attributes and a whole lot more. Even better, at the end of the processing you get a compressed CSS file so you can ensure that your site loads as fast as possible. Even if you don’t use any of the CSS extensions, you still get a compressed stylesheet, so that’s got to be something to smile about!

You can read more about the Spiffy Stores Theme Customizations in our Knowledge Base.

Add Geolocation to your Liquid Theme

Here’s something to help you customize your Spiffy Store’s Liquid Theme for your overseas customers.

We have added some new Liquid Theme variables that will give you access to the geolocation data for your customer. This will give you access to the Country, Country Code, City and Timezone information for the customer, based on the IP address being used.

Continue reading

New design for Hair Fairy Clips Store

We’ve just finished a re-design of the Hair Fairy Clips store using the new Georgia Theme.  If you’re interested in getting us to modify a theme for use in your Spiffy Store, it can generally be done in about 2 weeks and will cost you from $70 for a few changes up to $450.00 for a complete overhaul.

Contact us today to find out about our store design service.

The minimal theme just got spiffier!

New Spiffier minimal theme for Spiffy StoresWe’ve just updated the minimal theme so that now it can be re-coloured in your theme editor.  You can now easily add your logo, add images to your slideshow, change your store background colour, the colour of your navigation, your links, as well as your text, footer background, and footer text.

The best thing of all is that all of your colour changes are also reflected in your checkout, which also exactly matches the colour scheme you’ve created.

It comes with a few different colour schemes built-in as well, which you can see by clicking on the image to the right.

New Theme Customization Options

We’re pleased to announce that we have a new feature for our theme templates… Theme Settings.

Although the Spiffy Stores Themes have always been highly configurable, this configuration necessarily required some knowledge of HTML and CSS.

Not any more.

The new Theme Settings ability means that theme designers can now create a custom settings form that allows the end-user to simply choose from basic theme configuration options such as colour scheme, custom logo configuration and design layout.

Continue reading

Antiqua theme released

We know we’ve been teasing you a little too much with the delayed launch of this theme… well the Antiqua theme is now available to all stores in your theme gallery.  Check out the theme preview site at http://antiqua.spiffystores.com

To apply this theme to your store, just navigate to the “Theme gallery” section in your Toolbox (in the Design & assets section). You’ll see the Antiqua theme there.

If you want to try it out on your site, remember to save your current theme by downloading it first. This means that you’ll be able to restore it at a later date if you’d prefer to use your old theme.

Structuring Information for Search Engine Snippets

Here’s a quick update.

We’ve added a small improvement to our Theme support by defining a new header variable which can be used in the Theme.liquid file as part of the section.

Rather than hand-coding author, copyright, description and keywords meta tags, you can just code

[ruby]
{{ header.author }}
{{ header.copyright }}
{{ header.description }}
{{ header.keywords }}
[/ruby]

These variables will automatically generate the appropriate meta tags for your page’s content.

The advantage of these automatically generated tags is that they structure the description information in a way that makes it easy for the search engines to extract the relevant information about your product or page and this will appear as the snippet in the search results.

For details have a look at our Knowledge Base documentation

Liquid Template Variables – header

Shipping notification emails & packing slips

Shipping Notification Email

We’ve been working hard on getting the shipping side of processing your orders sorted out to make it as streamlined as possible for you.

Now, when you mark an order as shipped, a notification email is sent out to the customer to let them know their items are on their way.

You can also add a tracking number so they can track their shipment.  A new Order Shipping Report is also created instead of the old Fulfilment Report, which also allows the printing of Packing Slips.

Very soon you’ll also be able to customise your emails as well, so you’ll be able to completely re-brand all aspects of your store! Check out the preview of the email to the right.

Enjoy!