SolidShops has closed. This site is an archive: signing up and the contact forms are no longer available.

How To: Display Description Excerpts Only

Sometimes, your clients will ask you to print out only a piece of the product descriptions they have entered. A typical situation is a front page which only shows a short introduction text about a product and a detailed product page which contains the full product description.

To make it easy for you and your client to accomplish this, we have implemented the following solution.

The client enters a product description as usual and clicks on the “add more break” button in the editor. This will insert a break that defines the end of the excerpt. That’s it.

The template designer now prints the product or page description as usual, but by using the excerpt filter:

{{ product.description|excerpt }}

This will only print the excerpt of the description (the part before the ‘more break’) instead of the full description, nice and easy. If you have any questions or remarks, please let us know in the comments section below.

Tip: Use variables in your CSS to simplify themeing

Writing great CSS is an art in itself. Web designers are always pushing the limits of our favorite markup language. There have been a few cool initiatives like the LESS css preprocessor to make the use of variables possible inside CSS.

With SolidShops however, you don’t need the overhead of additional libraries, just use our simple templating language to assign variables or even write if/else structures inside your CSS files.

Here’s a small example to give you an idea of how you can make writing CSS easier by using variables inside your stylesheets:

{% set roundness = "5px" %}


.roundit {
-moz-border-radius: {{ roundness }};
-webkit-border-radius: {{ roundness }};
border-radius: {{ roundness }};
}

If you want to change the roundness of your elements with class .roundit, just adjust the variable on top once instead of manually updating every single occurrence of the border-radius property.

I’m sure that you designers and developers out there have many more creative ideas on how to use this for your own benefit. If you got some ideas to share, post them in the comments below and we’ll add them to this post!

A custom 404 error page never hurt nobody

The dreaded 404 page is the page your visitors reach when they try to go do a page on your site that doesn’t exist. Maybe the page has moved or there was a typo in the URL. Whatever the cause, your user may be confused about what to do next or may even be put off by the ugly default “404 – Page Not Found” error your browser pulls out of its hat.

Some creative web designers go the extra mile to comfort their visitors that have lost their way around the site. You can do the same with SolidShops, simply by creating a new “Custom template” named “404” in your store’s theme. Design the page just the way you want and whenever visitors land on a non-existing URL  in your store, they will be redirected to your custom 404 page.

Here are a few great examples to give you some inspiration.

A whole lot more great examples:

http://www.hongkiat.com/blog/60-really-cool-and-creative-error-404-pages/
http://www.sitesketch101.com/404
http://www.smashingmagazine.com/2007/08/17/404-error-pages-reloaded/
http://www.hongkiat.com/blog/49-nice-and-creative-error-404-pages/

Let us know how you’ve spiced up your SolidShops 404 page and we’ll feature it in this post!