Escape a Shebang /#!/ in URL for Google URL Builder - wordpress

Question

Does anyone know if/how I can escape the shebang or encode the uri to make a link work properly in google analytics url builder? I want to add campaign parameters to product page urls to track ads success. The url for each individual product page looks like this:
http://www.oursite.com/classic-movies/#!/Title-of-Movie/p/12345678
When I put the product page url into the url builder, it says the url is invalid. I think it is because of the #!. I have tried escaping out the special characters, replacing the shebang with %23%21 or %21!
It appears valid in the url builder, and the builder generates a link with utm tags, BUT when you paste the tagged link into the browser, it does not take you to our product page. It takes you to our website, but gives a "sorry does not exist" message.
I also tried this:
http://www.oursite.com/classic-movies/?_escaped_fragment_=/Title-of-Movie/p/12345678
It generates a link in the builder and does link to the product page of our website (yay!), but the url adds this after the campaign name: #!/Title-of-Movie/p/1234567
The shebang is back! Will that be a problem?
For reference, we're using the Ecwid storefront plugin for a wordpress site.
Thanks in advance.

Answer 1

Short answer
You should use the URL without fragment (hash part) as a base for building URLs with queries (the part starting with '?') and then append the hash part to the end of URL.
Example:
1) Take http://www.example.com/classic-movies/#!/Title-of-Movie/p/12345678
2) Remove hash part: http://www.example.com/classic-movies/
3) Use this hash-free URL as a base and add query parameters yourself or use any automatic builder. Example: http://www.example.com/classic-movies/?utm_source=myblog&utm_campaign=xyz&abc=def
4) Append the hash part to the end of the URL: http://www.example.com/classic-movies/?utm_source=myblog&utm_campaign=xyz&abc=def#!/Title-of-Movie/p/12345678
You're done – the final URL is valid URL which will work fine for browser/customer, your site server and tracking tools like Google Analytics
Long answer
1) URLs could be very different, but their structure is actually quite the same and that's a part of the web standards.
URL is built this way:
protocol://site/path?query#fragment
(I simplified it and take in consideration only the parts we're talking about, the actual scheme is a bit more complicated)
Taking your product page URL, that will be:
protocol: http
site: www.example.com
path: classic-movies/
query: (empty)
fragment: !/Title-of-Movie/p/12345678
Now, if you want to add query parameters, you know where to insert them. As to the fragment part, it should be always in the end, regardless of whether it contains !
2) Google Analytics doesn't track the fragment parts of the URLs.
Urls like http://www.example.com/coolpage and http://www.example.com/coolpage#!anyparameter=anyvalue are the same for Goolgle Analytics. That's likely the reason why their URL builder tool doesn't accept that.
By the way, Ecwid uses fragment part of the URL all the time to address the product and category pages, but that's not an issue if you want to track your product pages in Google Analytics. Ecwid solved that problem by sending special 'virtual' page views to Google Analytics every time a customer browses your store. So in your GA reports you will see your store pages.
3) If you use Google Adwords for your ad campaigns, I'd suggest linking your Google Analytics and Google Adwords profiles to have better picture of customer behavior and the campaign performance. Check out this thread on Ecwid forums for the details:
http://www.ecwid.com/forums/showthread.php?t=10835