HelloARI logo: vinyl signs and identity design home«    web design«    sign design«    blog«    contact« 

web design and wordpress development 94114
san frnacisco web design

Gravity Forms for Ecommerce with tax and shipping options

I love Gravity Forms. It’s the best form building tool for WordPress and now it offers a new feature that allows more complex calculations between fields. Combine that with the PayPal Payments Pro and you have a really fast, simple and powerful ecommerce option for those times when a full WordPress ecommerce system/plugin is not needed. Easier to set up, easier to maintain and gets the job done.

The sample below allows for a variety of shipping prices based on order total (but you could base it on total number of items too). It also adds sales tax – but only if your shipping address is set to California. Of course you could set it to any state. Note that the shipping field disappears when selecting a different state. The key is to set up a “subtotal” field and put your calculations in there.

There are some notes in this form – let me know if you have further questions about how this is set up in the comments below and I’ll do my best to help explain the options. See screnshots at the end of this post.

UPDATE 8/2013: I found this bit of free code from GravityWiz that gives you a ‘subtotal‘ field – I have not tried it but looks like a simpler solution that saves lots of work if you need to edit your form products with any regularity.

UPDATE 4/2014: I have had users ask me for a copy of this form. Here’s a XML export of the form – should be ready to import into your Gravity Forms. Let me know if it helps.

 Gravity forms admin screenshots

greavity forms shipping subtotal gravity forms gravity forms california sales tax



Posted in WordPress, WordPress WooCommerce | Tagged | 9 Responses

Not For Sale: End Human Trafficking and Start Human Empowerment

Looks like a great non-profit – their goal is to fight the growing slave industry. I gave a donation and encourage my readers to check it out.

I want specifically to point out the design of their support page (they title it “empower”). It’s very impressive. They offer multiple ways to get involved in an interactive series of checklists. I’m not 100% convinced it’s what all visitors need – I would prefer a “quicklink” to just making a cash donation. But still it’s very innovative and other NGOs might find it inspiring. I can think of some other non-profits that I built WordPress sites for that could perhaps use a simper version of this kind of page to help communicate the many ways to promote their cause.

Want to get involved with Not For Sale? Want to be a part of the modern-day abolitionist movement? Not sure how to get started? This tool is designed to help identify which Not For Sale projects and programs are best suited for you.

By answering a few questions, the tool can tailor a list of action steps that will best help you get involved. Begin by choosing which areas of society you identify yourself, then you can refine your results by answering further questions about time commitment, community engagement, financial support and leadership. Let’s get started!

via Empower – Not For Sale: End Human Trafficking and Slavery.

Posted in Web Design | Leave a comment

WCSF: Notes From WordCamp 2012

Post “State of the Word” @WordCamp 2011


Well, this is long overdue but I finally cleaned up my notes from WordCamp.

Adding custom content types: I’ve always been on the lookout for a Drupal-like “views” module for WordPress. These tools come close:

Other fun things I learned about

  • SASS for CSS
  • REM not em for best responsive CSS
  • S2member for member and paid level management
  • Hellobar: a simple idea: use the top 30 pixels of yoru site for eye-catching messages. Hellobar includes A/B testing and it’s own analytics so it might be worth paying for on a ongoing basis. Other similar solution like Foobar are just a plugin with no extra fees. (let me know if you have a free version you use)
  • SlideDeck:  Slider & Gallery Plugin that gives a powerful UI and lots of sources and skins for building sliders
  • Flare social sharing bar
  • HappyTables: free restaurant website-building tool – developed around a customized version of WordPress

Chatting with Matt about new WordPress usage stats.

Notes from 2011

Posted in Web Design | Tagged | Leave a comment

Apple Mail “Letterbox” update fix

Apple Mail disabled the amazing “Letterbox” plugin after the recent Mac OS10.6.8 update. Here’s a link to an easy fix.

Letterbox is a plugin for Apple’s Mail.app that takes advantage of the full width of your monitor. It rearranges the interface into three vertical columns so the message pane is to the right of the message list, rather than below.

MailPluginFix is a free tool which will  fix any incompatible Mail.app plugin  after an update of Mac OS X.

via CODE2K:LABS – MailPluginFix.

Posted in Product Reviews | Leave a comment

Ari’s first Quirky invention: iPhone bike mount

After years of participating in the Quirky community I finally got motivated enough to submit my own invention idea.

Waterproof iPhone bike mount with integrated lens for wide angle video recording or “precording” while biking.



Some bikers want to record their ride for fun. Others want to record their ride for the insurance of having a record of a collision. Everyone wants a cool case that is waterproof and easy to use while biking for maps, music, chatting, reading SMS etc.

This recent NYTimes article talk about the popularity of recording video while cycling


You already have that iPhone in your pocket while you are biking so why not use it as a safety device?

READ MORE AND VOTE UP MY IDEA: Quirky ideations | Waterproof iPhone bike mount with integrated lens for wide angle video recording or “precording” while biking..

Posted in Inventions | 1 Response

WordPress security plugins: Wordfence

Anyone who has had their site hacked or blacklisted knows how important it is to stay on top of WordPress Security.

Yes, you should use the lastest versions of WordPress core and for the most part the latest version of plugins. But of course incompatibilities arise so be careful when updating.

The #1 security measure I suggest is to remove “admin” user – many robots will assume you have a “admin” user and try to guess the password. By keeping this default user name you are giving away half of the username+password puzzle that is the barrier between your site getting hacked and your site staying safe.

Another concept is that some plugins change the way WordPress works so it’s more secure while others focus on malware scanning to see if anything has been hacked. Sucuri is a great plugin that scans for hacks – you can do the same free scan from their website. You can also pay them to actively scan and they will actually fix any issues that come up.  Code Garage does backups as well as malware monitoring so that’s a good option to explore also.

Plugins that do many security tasks

  • WordFence: This is a great new plugin I’m testing out that offers a complete solution for free with an optional paid upgrade that actively scans your site from the outside to make sure it has not been hacked. So it combines security edits with malware monitoring.
  • Better WP Security: I’ve been using this one for a while and it’s great. It has a “one-click” feature that will harden a number of security features very quickly.
  • A good handful of features: Secure WP
  • WP Security Scan
Plugins that solve smaller pieces of the security puzzle 
  • Login LockDown an older simple plugin that works well but has not been updated recently. Getting the many emails it sent help me learn how many bots were randomly attacking my sites.
  • Login Lock: like the above with with a few extra useful features like a button to force logout for anyone logged in. This plugin is no longer supported. another replacement option:  Login Security Solution
  • Limit Login Attempts: yup, another plugin with similar features.
  • The name says it all: the Replace WP-Version plugin
  • Updated SSL Plugin: forces ssl anywhere passwords are asked for
  • Timthumb vulnerability scanner: does a bit more than just check for that one giant security issue…

WordPress Ecommerce folks at instinct.co.nz have a great checklist for how to secure WordPress

Posted in Web Design, WordPress | Leave a comment

GoodSync for Mac


GoodSync is a utility that provides all the tools you need to keep your data safe and up-to-date. It works by synchronizing (and backing up) files such as MP3s, Office docs, photos, financial documents,  between desktop HD/SSD, laptops, servers, and all manner of thumb/external drives.

GoodSync is very user-friendly—its’ got a geeky but usable UI and is full of functionality. If you need a too to backup your data to protect it from crashes or need to synchronize complex data on a network, this tool makes it simple to keep you data current and safe.

Compare to:

  • Syncables 360
  • SugarSync
  • Allway Sync


GoodSync for Mac

Works amoung Mac OS devices or between Macs and cloud services like Amazon S3 and Google Drive. Connect to other computers and devices by using GoodSync Connect , which finds other devices installed with GoodSync on the internet or over a local network in a peer-to-peer style. Performs syncs over a number of other networks, including (s)FTP and WebDAV. Or sync with clouds including Amazon S3, Amazon Cloud Service, Microsoft SkyDrive, Google Drive (Docs), MobileMe iDisk, and Windows Azure. You can also sync with mobile systems like WinMobile and BlackBerry devices.

Important notes about GoodSync for Mac

  • Free version gives 3 or fewer jobs and 100 or less files and folders in each job.
  • You need one license per computer
  • You do not uninstall the old version of GoodSync before installing a new one  unless you want to install into a different folder. The new version will keep the options and settings of the previous one.
  • Any data stored in a file can be synchronized


  • GoodSync Desktop for Mac license for $39.95
  • Other plans for PC, Mobile…

GoodSync for Mac review and tips

Tip: It’s important to create a folder at the destination first. I wanted to synchronize a folder “C:\testfolder” to a second drive (F). When I just set Good Sync “C:\testfolder” as the source and point it to F (as root) I thought Good Sync would create the folder for me but that’s not what happens. You will get  a message indicating the folder on F drive does not exist. If you tell it to go ahead and synchronize no files are copied.

Tip: The default is for Good Sync to only synchronize  when you manually tell it to. You can change that under View – Options-  Job name. You can tell it to synchronize automatically under a number of different schedules.

Bottom line: A great option for syncing data, a mature tool that can cover the bases for many use case scenarios.

Posted in Web Design | Leave a comment

Soft-launch: Shrub & Co cocktail mixers

I just soft-launched this new site. Their product is not available quite yet but will be sold on the site soon. It’s a new kind of cocktail mixer – but also used for non-alcoholic drinks like sodas. Based on a traditional “shrub” : It is prepared with an acidic fruit base  pickled in vinegar and then sweetened with sugar and finally used as a mixer with spirits such as rum or vodka to make a rum-shrub or vodka-shrub.  

Shrub & Co elixirs add depth and complexity to your drinks with a clever combination of sweet and savory notes. Rescued from the obscurity of the colonial era and reimagined for today’s craft cocktail enthusiast, our shrubs enhance your favorite concoctions.

visit: Shrub & Co | Cocktail mixer


Posted in Web Design | Leave a comment

QA the UI: Time Machine’s backwards ghost

Here’s something that’s been bugging me for a long time.

Now, I know the folks at Apple work hard to make the small details shine. I’ve had a couple acquaintances who have been involved with great hardware design there over the years. I have heard stories about the wonderful keyboard design (the super fast keyboard that I’m typing on at the moment). I’ve heard about the great lengths engineers went to to sync the sleep pulsing light of the Mac monitor and the Mac tower years ago. And the “sleeping heartbeat” or “breathing”  pulsing LED itself that is on many of the Apple products is a patent that took some skill to pull off (I think it is actually blinking really fast since LEDs don’t dim the way incandescent bulbs do). See “Breathing status LED indicator” patent that describes “The LED indicator is energized by pulse-width modulated electrical pulses” that my friend Jory Bell helped invent.


So why is this strange little UI element so backwards?

When Time Machine is operating the Finder window sidebar icon and the icon in the Mac menu bar spin in opposite directions.  If that pulsing light makes the “sleepy ghost” in the machine feel alive then this detail makes the machine seem like the left hand does not know what the right hand is doing.

While I’m at it – here’s a fun old screenshot of debug mode in mobile Safari showing Apple’s own store and how it generated 2 errors. That’s all cleaned up now I see but when the Debug Console was first introduced it  was fun to turn that tool on it’s maker.

Posted in Design, Inventions | Leave a comment

Crafty Cart WPEC theme

Storefront Themes - Premium WP-e-Commerce ThemesCrafty Cart was a great free WPEC (WordPress e-Commerce plugin) theme that I customized for a couple sites. But the developers seem to have disappeared so I’ve moved on to other WordPress ecommerce starter themes like those from Storefront Themes.

What I like about Crafty Cart is the playful design. It also features:

  • Simple product management options.
  • Fun and simple way to browse categories.
  • All the customizable power of the WordPress eCommerce system.
  • Want to try it out? See download link below.

Crafty was useful as a starting theme – as I mentioned I used it twice. It had some issues with IE and had a number of CSS cleanups to go through but came out well in the end. Let me briefly show some of the e-Commerce customizations I made.

Meeks Design Handbags craft eCommerce

My customizations on this site include making the product list only show image and name without price or ‘buy now’. I designed the logo and the over all “I’m busy crafting” branding that matches the aesthetic of the fabrics used in the products. This project included business card and other print collateral. I trained my client to use the site and manage inventory,  sales reports and other WordPress eCommerce features.

Sugar Petals cake decorations and food eCommerce

This project features a wholesale-only setup that only shows pricing to those that have applied and been approved for an account. The design started with their existing logo and created a new look that blended into their existing branding materials. I trained my client in how to accept new wholesale customers and manage a complex set of product and pricing tier options via the WordPress eCommerce coupons functionality.


Download Crafty Cart theme

Since it’s hard to find this theme online anymore, here’s a download link – this is the whole original theme but none of my customizations. This is still a great theme but one important feature that it is missing is a responsive design that makes it easier to purchase from a mobile device.

UPDATE: leave a note in the comments if you know of a WooCommerce theme that has a similar look to it….

Posted in WordPress, WordPress WooCommerce | Leave a comment
© 2018
contact  |  links  |  rss