CoreCommerce

We have evaluated the results of the 24×7 service over the last 4 months and have determined that the weekend volume does not require around the clock phone and chat support. Therefore, to better allocate our resources, the support/solutions department will be moving to a new schedule effective January 1st, 2012.

We still offer 24×7 monitoring of paid accounts through the emergency ticketing system and will be staffed for phone and chat support 24 hours per day Monday through Friday, 8am to 5pm on Saturdays, and closed on Sundays. This allows for better support coverage during the very busy mid-day regular business hours.

CoreCommerce management wants to provide each of our staff time with their families and friends this Holiday season. As a result, our offices will be closed from 4pm to 12am on Christmas Eve and from 12am to 12am on Christmas Day. We will also be closed from 11pm New Years Eve and all day New Year’s Day. We hope and trust that you will enjoy this time with family and friends and will have a wonderful and safe holiday.

Summary:
12/24 Christmas Eve: Close @ 4p
12/25 Christmas Day: Closed all day
12/31 New Years Eve: Close @ 11p
1/1 New Years Day: Closed all day

Introduction and Overview

What is an image sprite?

An image sprite is a collection of images that have been combined into a single image. Image sprites are most commonly used for images that are seen throughout a site and are generally not used for page specific images due to the amount of work it takes to create an image sprite. An example of where image sprites could be used would be for images that appear in a sites navigation or for icons that are used repeatedly on multiple pages, such as social networking icons in a sites header or footer.

Why use image sprites?

Every time an image is loaded on a web page a server request is generated and bandwidth is used. For sites that contain multiple images in repeated areas this can slow down load times, especially for users on slower connection speeds. In order to lower the number of server requests and to minimize the amount of bandwidth used on images, image sprites may be used.

Where can I see Image Sprites in use?

To see image sprites in action, visit www.bradlilley.com, where sprites have been used for all of the header and footer navigational links. In this example, there appear to be a total of 23 images or icons, 46 if you count the hover state of each link, but in reality only two images are being used; One for the header links and one for the footer links.

The header is built using only one image sprite but appears to contain a total of 4 images. (8 if you count the hover state of each image.) To see what this sprite looks like without any CSS formatting click Here .

The footer is built using only one image sprite but appears to contain a total of 19 images. (38 if you count the hover state of each image.) To see what this sprite looks like without any CSS formatting click Here .

How do I create a sprite?

Image sprites can be made using any number of image-editing programs such as Photoshop, Illustrator or Fireworks. These three are probably the best programs for sprite creation, but there are cheaper or even some free solutions available on the web.

To implement the sprites you will also need a text editing program such as Textmate or Sublime text. You have the option of using a WYSIWYG (What you see is what you get.) editor such as Dreamweaver, but it is recommended that you use a plain text editor as it will give you more control over your code and prevent frustration later on.

The following steps will walk you through the basics of creating an image sprite. There are hundreds of additional tutorials on the web that can be found by doing a simple search for “css image sprites”. In addition, we have also listed several useful resources at the end of this post to help you get started.

Step 1: Asset creation and organization.

The first step in creating image sprites is to gather and combine any pre-existing images into one file. If there are no pre-existing images for you to use you will need to create the images that will be used in your sprite. It is recommended that you use vector images if at all possible as this will allow for easier scaling of the images and will prevent image quality degeneration if the image needs to be re-sized multiple times. Using vector images will also make it easier to change or update your images in the future.

Once all of the assets have been created and gathered into one file, you will then need to lay-out the images in an organized manner, paying close attention to your alignment, padding and margins. This is especially true when working with sprites that will contain a hover state, in which case being off by even 1 pixel can affect the way your sprite behaves. You can adjust the alignment of the sprites with code once they have been implemented, but getting the alignment right in the beginning will save you time and frustration later.

Step 2: Image optimization.

After all of the images for your sprite have been created and are properly aligned you will need to optimize the images for the web and save the images in the appropriate file format. The format that you choose will be based on a number of factors such as transparencies and image quality. If you are using a Photoshop it is recommended that you use the “Save for Web & Devices..” feature and choose the format that offers the best quality with the lowest file size. In the example listed above the sprites are all in .png format because the images needed to have a transparency but required more detail than a basic .gif could offer. Choosing the right format at this phase is crucial because it would defeat the purpose of using sprites if our final image ended up being so large that it used more bandwidth to load than all of the separate yet smaller images combined. We will not cover it here, but it is worth mentioning that you may also elect to use Interlaced and/or Progressive images with sprites if needed.

How do I implement a sprite?

After you have created and optimized your sprites for use on the web, you will need to implement them using HTML and CSS. There are several techniques that can be used including the Phark or Fahrner Image Replacement techniques when working with image sprites. The basis of these techniques is to position your sprites while maintaining semantic, standards-compliant code that can still be access by search engine crawlers and individuals with disabilities. This is especially true when using sprites for any navigational elements within your site and it is never a good idea to use purely image based links, as this will prevent search engines from crawling your site and will make your site inaccessible to individuals using assisted devices such as screen readers.

To demonstrate how sprites work we will again use www.bradlilley.com’s main navigation. The HTML and CSS code below is what controls the links and their hover states.

The main navigation for www.bradlilley.com is built using a simple unordered list where each list-item has the sprite image set as its background and gets its own unique id. These id’s are what we will use to position the the sprite with css.

Each list-item, with its unique id, has an normal and hover state where the “background-position” is set according to the position of the image contained within the sprite being used. In this example each menu-link is exactly 40 pixels tall and each instance of the image sprite decreases by 45 pixel per link to offset the images contained within the sprite. The reason the offset is 45 and not 40 is because there is a 5 pixel padding between each image in the sprite itself. You will also notice that there is a 90 pixel offset between each menu-links “normal” state. This is because each image contained within the image sprite has a combined total height of 45 pixels, and the normal state repeats every other image, thus 45 + 45 = 90. This is how this particular site utilizes sprites, and is by no means the only method available. Sprites can be laid out as you see fit and are not restricted to this exact method.

Conclusion

While image sprites may take a little bit more work up front, they are definitely a viable and streamlined option for anyone looking to lower the amount of bandwidth used loading images on any their site. Using image sprites also helps clean up a sites image folder by combining multiple images into one larger image that can be updated with minimal effort.

Additional Resources

The following is a list of additional resources that you may find useful while creating your own image sprites.

W3C Schools – CSS Image Sprites
A List Apart – Image Slicing’s Kiss of Death
CSS-Tricks – CSS Sprites: What They Are, Why They’re Cool, and How To use Them

There is an important change coming to Google Checkout over the next few months – Google Checkout is becoming part of Google Wallet.

**For CoreCommerce Users, this does NOT change anything about how you use Google Checkout.

Google Wallet is a virtual wallet that securely stores payment information and makes paying fast both in-store and online. With an NFC-capable device such as the Sprint Nexus S 4G, buyers can use the Google Wallet app to make purchases at thousands of retail store locations with just a tap of the phone. On the web, buyers simply click a Google Wallet button to make quick and secure purchases with their saved payment information.

Google Checkout buyers will now manage all Google Checkout and Google Wallet orders at http://wallet.google.com/manage. Buyers will be able to make purchases with their existing accounts at sites that accept either Google Checkout or Google Wallet.

For merchants, organizations and developers who use Google Checkout to sell items or collect donations, and for integration partners that offer Google Checkout as part of their shopping cart services, nothing is changing right now. In early 2012, we’ll ask Google Checkout integration partners to change any text on your site that talks about Google Checkout for buyers to Google Wallet. No additional integration or other technical updates will be necessary.

We will email you again in the next few months to let you know when to expect the new Google Wallet purchase experience and button. In the meantime, you can learn more about the transition by attending our webinar at:

https://google.connectsolutions.com/checkouttowallet/event/event_info.html and by visiting www.google.com/payments/index.html.

As a brief introduction, I work for Minnesota Workwear, an online clothing store that carries over two thousand products. A few months ago Google stated that they were changing the requirements for Google Shopping feeds to require a wider variety of attributes to actually publish your feed. You can consult the previous link for information on your types of products but for clothing in particular, we were suddenly required to add attributes for gender, age group, color and size. Having worked with several shopping carts previously, I knew this could become a tremendously tedious task or worse yet, you could be left out to dry if your cart didn’t have these fields already in place or quickly accommodate these changes.

We have always been nothing but impressed with the functionality of the CoreCommerce cart, and this case was no different. We’ve had a couple people tackle the input of product attributes, so I figured it would make sense to put together a quick tutorial, and was surprised just how quickly I was able to do it and how easily everyone was able to get to work. What follows is the guide we put together:

How to add required Google Shopping feed data

Once logged in, navigate to Products>Inventory and select a product to edit:

Once at the product page, navigate to Advanced tab in the top gray navigation bar and then to the Google Products tab in the left navigation as seen below

Once in the Google Products interface, the minimally required fields to fill out are Condition, Availability, Category, Color, Size, Gender and Age Group. ISBN does not relate to us nor does expiration date, so those can be completely ignored. Our description currently pulls from the on page description, but can be formatted better by using the description field here.

When selecting product category, it is a hierarchical structure. The first category is Apparel & Accessories, once that is selected another category drop down becomes available where the next subcategory can be selected. Continue until you reach the closest match for that item.

Once you have the appropriate category, click the Setup Apparel Variant Attributes button. You will be offered your color options. Select the appropriate options.

Once color is selected, click the size drop down to select the appropriate sizing options, and then once again click Setup Apparel Variant Attributes button. You will be offered different sizing selections, choose the appropriate ones. Once complete, click Done (in the upper right hand corner of the pop up).

With your sizes selected click Done (in the upper right hand corner of the pop up) and then save your changes.

The following features will be released on November 9, 2011 as the newest feature for CoreCommerce:

Secure/Non Secure Auto Image Toggle

We updated how some of our widgets work in the system so that if the URL you are on is a secure (https) URL, for example the one page checkout, it will pull the images it uses for the widget via HTTPS.

Conversely, if the URL you are on is NOT a secure page, i.e. the product detail page, then it will pull those same image via HTTP.

ECHO (now known as an Intuit product) Payment Gateway Integration

We now integrate with the ECHO gateway (now known as Intuit) for accepting credit cards. This is a direct payment gateway, so your customers will NOT leave the site when entering their payment info, IF you choose to use ECHO as your payment gateway.

Minimum Quantity Updates

For our minimum order quantity feature, which allows you to control at the product level if a product requires a minimum to add it to your cart, you can now control the system so that it will count a product with a specific set of options as one product minimum, or if you want the system to add all similar items, regardless of the option choices, together to check for minimum order quantity for an item.

For example, the old way (which you can still use), was setup so if you have Product “Shirt” and it comes with a color choice and a size choice, and you set the minimum order quantity for that product to 3, then let’s say for example, you try to add 1 of “Shirt” with color “Red” and size “Small”, it would require you add at least 3 “Small Red Shirts” to the cart, since the minimum quantity is “3″.

But what if you only want 1 “Small Red Shirt” and 2 “Blue Medium Shirts”. The only way would force you to have to buy 3 of each style, the new setting will allow you to add any combinations you want to the cart, for example:

• 1 “Small Red”
• 1 “Medium Blue”
• 1 “Large Green”

Then, it will wait until you checkout to check and see if you have 3 “shirts (regardless of size/color) in your cart, vs. it having to be 3 “red/small” shirts AND 3
“blue/medium” shirts.

So it becomes a more true product based minimum quantity feature with this new setting.

One of the main enemies of e-commerce websites happens even before the user ever experiences the your shopping cart software. For many shoppers the concept of doing business on line is still a foreign language. They fear what they do not understand and cannot see.

Add the lack of person-to-person communication and fears about unsecured processing of funds leads to other doubts for perspective customers and the result presents a challenge. Software features like the shopping cart can either enhance or hinder these concerns.

Build Trust

It’s a matter of building trust through professionalism. When a shopper finally gets brave enough to try an online transaction, the software and the shopping cart feature must be flawless. Clearly explain the buying process, the steps involved and the amount of time needed to complete a transaction on the first page and reinforce these factors throughout the checkout process.

In addition, websites giving phone numbers or electronic addresses for the purpose of answering questions or concerns need to make sure responses are provided in a timely manner, and so stated before the user request communication. If you list contact information only for a potential client to find a dead end, the clatter of clicking sounds to escape your site will vastly drown out the wanted “cha-chings” from money entering your bank account.

Mobile Friendly

Prior to arriving at the shopping cart, the entire experience should be mobile optimized. If apps and user friendly mobile sites are available for tablets and smart phones, those apps need to provide a smooth and sophisticated transition. Maybe even specific services for popular devices like iPhones and iPads should be a consideration. Expect shopping carts to be abandoned if too many options make the process complicated or slow through extra wait time to load intensive graphics and excessive finger zooming in and out. Consider a quick check out option or some type of mobile express lane for shoppers purchasing one or two items. Mobile shoppers will typically less time on your site and buy less.

Live Tracking

There is no substitute for clear and effective communication. Keep the customer informed of the process throughout. Changing a selection or back tracking to find a product should not be complicated.

Surprises are great for birthdays but not so good for customers trying to make a purchase. Give important information upfront to prevent unpleasant surprises at checkout. For example, keep inventory up to date. If a product is not available, the customer should get that message immediately when the item is checked. Live order processing after purchase ensures a confident shopper, who is much willing to refer you new business.

No surprises should show up in the shopping cart at all. Any extra charges or special conditions need to appear on the home page or cart in plain sight. More customers are likely to follow through with a transaction if the shopping cart includes an accurate list of selected items and prices listed. If your layout allows for it, a perpetual shopping cart which shows all items in your cart throughout the shopping experience can help reduce shopping cart abandonment when the checkout begins.

Even extra fees for shipping or taxes should be listed on the home page. There should be no surprises during the shopping cart phase when the shopper checks out. Surprises equal more abandoned carts. Many other factors are important to e-commerce but exhibiting mobile friendliness while maintaining a professional but friendly website with live tracking will give any business a solid start.

“I just wanted to let you know that we are now live and all traffic redirected to corecommerce. I also would like to let everyone that has helped me along the way know that I really appreciate your time and extreme willingness to help me through this transition. Every tech company should strive to have the outstanding level of service that Corecommerce provides! What a painless walk through a difficult transition! Thanks for being there with me!”

Brian Krenzin – petandkennelsupply.com

“Our average sale went up over 20% just putting our new CC site up.”

Julie Feickert – culturesforhealth.com

Hey folks:

As our ongoing effort to improve communication with our customers about our new features and the projects we are working on, we wanted to let you know about the new features inside your account (available now). The following features were rolled out successfully to all customers yesterday, Wed, 10/12. These features were financed by customers asking for these specific features (rather than community votes). Here is the list:

CoreCommerce Built-In Blog

We now have a Blog that you can use directly inside of CoreCommerce's system. You can create posts, categories, and have people comment on your blog items just like any standard blog can do. It is very useful and will help any CoreCommerce customer with SEO by having a blog on the same site as the CoreCommerce store. By having a blog on the same site as your CoreCommerce store, you can have the blog setup as http://www.yoursite.com/blog, which is better for SEO something like http://blog.yoursite.com.
For those of you asking for this feature — it's here! Details on how it works are in our knowledgebase here.

Google Product Feed Updates

We have updated and implemented the new updates to the Google Product Feed as required by Google.

Amazon Fulfillment

You can now use CoreCommerce in conjunction with Amazon Fulfillment to fulfill orders. You can have your orders sent to Amazon, and have the orders shipped and tracked via the Amazon Fulfillment interface.

Email Address in API

In the CoreCommerce API, you can now search for a customer by their email address.

Importing/Exporting Sort Order Values

In the past, you could create a custom sort order for options inside an option drop down, but this field was not part of the Product Option Import and Export tool. It now is so this field can now be imported and exported.

Channel Manager Integration

We now integrate with Channel Manager, a 3rd party tool you can use for fulfillment and order tracking. You do have to have a Channel Manager Account to use this feature with CoreCommerce. It can communicate with CoreCommerce to auto update orders with tracking information.

Tracking Integration with Lynx fulfillment

We previously integrated with Lynx fulfillment so that you could send orders from CoreCommerce to Lynx. We have also added the ability in this release for Lynx to talk back to CoreCommerce and update tracking numbers inside your orders.

Custom Payment Method Messages for Emails

For the Payment Methods "Check" and "Money Order" we have added a new field you can enter HTML into that will be included in the email reciept (HTML ONLY) to the customer when they place an order using that payment method.

NoChex Payment Gatewat Integration

We now integrate with the NoChex Payment Gateway for accepting credit card payments with CoreCommerce.

BCC Emails are sent as true BCC emails

In the past, you could go into the Admin Store Settings and tell the system to "blind carbon copy", or BCC, and email to another email address. When you set that up, it didnt actually BCC that email to the email, it sent a separate email. We have changed that at our customer's request to actually attach the email address you with to BCC emaill to to the actual email that is sent, like a true BCC.

Qty Based Pricing Updates

We have added the ability for Qty Based Pricing to show just 1 number for the low and the high ranges, when they both used the same number. In the past, if your low was 1 and your high was also 1, it would show "1-1". Now when you turn on this setting, it will just show "1".

Top Level Categories

We have added the ability to go to a specific screen that will show a list of JUST the top level categories in the system.

Don't autopopulate Ship To Address during checkout

We have now added the feature that will force the shipping address to NEVER populate automatically with the billing address, to accommodate those stores that require a different shipping address for each customer order.

Product Option Images Now Exportable

We have update the Product Option Import/Export tool to allow the images to be imported as well. It works just like the Product Images import too, where you upload the images via FTP to a folder on your site, and then you reference the name of the image in the import file.

Custom Fields can now be exported with Orders

If you create a custom field that a customer fills out during checkout, and that field is set to save with the order, that field can now be exported via the order export tool, whereas previously we did not.

New Payment Gateways

We now integrate with the Planet Payment or iPay gateway for accepting credit card transactions. Paymate Payment Gateway (Australia-based) & iPay Planet (aka Planet Payment) Gateway

Tax Update for US and Canada

Our system was setup in the past that if your main tax Country was something other than US or Canada, you could not set a tax rate for US or Canada at all. Now this has been changed to allow a flat rate for US and Canada, just like any other countries, when your main tax Country is something other than US or Canada.

New Design Tokens
We added 4 new tokens to the design token system, to allow for specific if statements based on your browser type, i.e. mobile, firefox, internet explorer.

Next Release: Early November 2011

We will do 1 more round of new features before the holiday season that focuses on improving page load time before the busy holiday season as well as FedEx Label printing with FedEx WebServices. We hope to get back on track with the community feature votes starting again in January.

Thanks,

CoreCommerce Team

CoreCommerce is a finalist for the 2011 Nashville NEXT Awards. The NEXT Awards, is to be held Tuesday, October 18 at the Renaissance Nashville Hotel, will honor the area’s most innovative entrepreneurs and area businesses experiencing the most significant growth in terms of revenue and employment. In addition to the awards recognizing businesses making the greatest contributions to the local economy, individual awards for outstanding entrepreneurs will be given in several categories.

The NEXT Awards build upon the Nashville Chamber’s Future 50 Awards, which for 19 years recognized the fastest-growing entrepreneurial businesses in Middle Tennessee. The new partnership with the Entrepreneur Center extends the concept beyond simply spotlighting emerging companies, differing from the Future 50 Awards in three important ways: public companies are now eligible to enter; three tiers have been established to recognize businesses at all stages of development (startup, growth and market mover); and individual awards will be given to entrepreneurs making an impact on the Nashville economy.

View the list of finalists here.

We have expanded our Legendary Support coverage to 24x7x365.

Providing 24/7 support is part of our ongoing commitment to customer service, and will be a particular benefit for our international customers. We’re pleased to be able to expand our phone support hours so CoreCommerce customers will have access to the technical support they need regardless of the time zone they’re in or the hours they work.

This has been one of our goals we have been working towards throughout 2011. We have quietly been offering 24/7 support for almost 5 weeks now as we moved our staff into those roles.

CoreCommerce’s commitment to customer service is supported by the high level of satisfaction expressed by customers backed by our Legendary Support. CoreCommerce holds a 93 percent customer satisfaction rating based on the feedback received in response to each interaction with a customer by e-mail or phone.