Category: Web Design

  • How to Setup Ruby on Rails in Windows 7

    Here’s what worked:

    I opened my web browser and searched for “how to install ruby on rails on windows 7” and found a new site called Railsintaller, which has the DevKit and SQLite3 included in the installation file! I downloaded the installation kit and went to the installation directions page which had step-by-step instructions on how to install Ruby on Rails in Windows.

    HINT: The “$” signs in front of the commands used in their instruction page are not meant to be typed in. They are used to signify the beginning of a line of code, but not meant to be typed into the console.

    After downloading and running the executable from Railsintaller you are prompted for your name and email address, then the prompt sits waiting for a hand-typed response. This is where you create a new Ruby on Rails (RoR) application by typing: rails new [application name] (where application name is the name of the application you want to create).

    Next, browse to the application folder by using the “CD” (change directory) command like this: cd [application name]. For simplicity, Railsinstaller has created a new directory on the root of your computer called C:Sites. This is where your application folder is stored. From this directory you can now start the RoR application by typing: rails s (or “rails server”).

    Windows Firewall may initially block the server attempt, but simply click “Allow” and then browse to http://localhost:3000 on your computer. “Welcome aboard. You’re riding Ruby on Rails!” Further instructions walk you through obtaining a text editor and setting up a GitHub account, but I’ll leave that up to you to read through.

    HINT: The console window has to stay open to use the web app. As soon as you close the console window, the browser window no longer responds.

    Here’s what didn’t work:

    1. Download the Windows RubyInstaller and install.
    2. Download RubyGems and extract it.

    Did you install the app from step 1 and extract the folder from step 2? If yes to both, continue.

    3. Open “Start Command Prompt with Ruby” from the Start Menu under Programs > Ruby.
    4. Use DOS “CD” commands to browse to where you extracted the RubyGems folder.

    I extracted mine to C:Users[Username]Downloadsrubygems-2.0.0rubygems-2.0.0, which means at the command prompt I had to change directories (CD) by typing: cd C:Users[Username]Downloadsrubygems-2.0.0rubygems-2.0.0 to navigate to that directory (replace [username] with your Windows username and CD to wherever you extracted the folder).

    5. Once at the correct directory in the “Start Command Prompt with Ruby” interface, type: ruby setup.rb
    6. If successful, it should say, “Ruby Interactive (ri) documentation was installed…”

    How to Install Ruby on Rails

    With RubyGems loaded, you can now install all of Rails and its dependencies through the “Start Command Prompt with Ruby” interface.

    7. At the “Start Command Prompt with Ruby” command line, type: gem install rails
    8. Wait. Nothing will happen for a second. This takes a while, depending on your computer speed. Follow the prompts if you get a yN question.

    After it’s complete, it will say something like “..gems isntalled” and you will be back at the command prompt. Nothing will happen next until you create an application.

    9. At the “Start Command Prompt with Ruby” command line, type: rails new C:Users[Username]Rails[ApplicatonName] (where [username] is your Windows username and [application is your new application’s name – don’t worry, it will create the directory if it doesn’t exist).
    10. After that’s complete, at the command line type: cd C:Users[Username]Rails[ApplicatonName] to change directories and then type: rails server.

    You should now be able to browse to http://localhost:3000 on your PC and begin using the web interface there, but for me it didn’t work right away. When I initially attempted to run “rails server” I got the error message, “Could not find gem ‘jquery-rails (>= 0) x86-mingw32’ in the gems available on this machine. Run `bundle install` to install missing gems.” However, running “bundle install” would do several things, but the end result would be the same. I’d get the same error. After doing some research I found help on Stack Overflow that mentioned installing the gems one by one. I started by typing “gem install jquery-rails”, which installed successfully, but when I typed “rails server” to start the server, I got a “coffee-rails” error so I typed “gem install coffee-rails” and waited for that to install before typing “rails server” again. Every time it couldn’t find a gem, I just kept typing in the gem name with the install command until they were all installed. For some reason “bundle install” wasn’t working for me, but individual installs would.

    When I got to the “sqlite3” error, the message was different. It said, “Error installing sqlite3 The ‘sqlite3’ native gem requires installed build tools. Please update your PATH to include build tools or download the DevKit.” I didn’t see that anywhere in the instructions so again I had to research it and found out the DevKit is a separate install from a different download page (it’s at the bottom – get the “tdm” one, not the “mingw” one)). You’ll want to put these files wherever you originally installed the other Ruby files. For me it was C:Ruby200 and I copied the extracted files into C:Ruby200Devkit. Using the “Start Command Prompt with Ruby” command line, type: “ruby dk.rb init” then “ruby dk.rb review” and finally “ruby dk.rb install”. The DevKit is now installed, which meant I could then install sqlite3 by typing: gem install sqlite3, but this time the error message was different. It said, “sqlite3.h is missing. Install SQLite3 from http://www.sqlite.org/ first.” Wow. This is like a wild goose chase. After searching around I couldn’t find anything particularly useful, but one site mentioned a possible borked installation of rails so I reran the “gem install rails” command, not knowing what effect that would have. It came back with “1 gem installed”. Again I attempted to start the server by typing: rails server, which didn’t work, so I uninstalled it.

    Ruby Installer for Windows

    I downloaded the Ruby Installer and re-installed Ruby in a different directory with the same result. I found forums that talked about copying the sqlite3 DLL and EXE files into the Windows System and System32 folders, which I did, but it didn’t seem to make a difference. I couldn’t seem to get past the sqlite3 header issue so I closed all of the programs I had open and uninstalled Ruby again.

  • Best eCommerce Platforms in 2013

    Which e-commerce site would you recommend? Is it better to have a site that starts as a blog with a shopping cart added, or an e-commerce site with a blog added?

    BigcommerceI’m currently recommending BigCommerce.com as the number one best eCommerce platform in 2013. It’s an online shopping cart/ecommerce platform that performs well, looks great, and has a standard HTML/CSS backend theme structure. It’s an example of an e-commerce site with a blog added. It’s a managed site that you pay monthly for, rather than a self-hosted site like WordPress, osCommerce, or Magento Community, but it’s not much to pay for the amount of support and consulting that comes with that fee. I’ll discuss more on this later. For now, let’s look at the number one blogging platform, WordPress, when ecommerce is added.

    WP-Ecommerce is the most popular ecommerce plugin that runs on WordPress, but I don’t recommend it. I have experience using it myself and from helping clients with it. It does work most of the time, it’s just that when it doesn’t, support is hard to come by. It’s also hard, but not impossible, to make it look good. CSS and theme elements have a lot to do with that, but the plugin has it’s own CSS too, which makes it harder to configure. If you are deadset on using WordPress as your platform, consider Woocommerce first because of all the great themes and support available for it, but if you truly want to self-host, consider Magento Community instead. You might also want to consider osCommerce (read my comparison of Magento vs. osCommerce). Self-hosted ecommerce packages are not easy. If you don’t want to pay someone to support it (or to put it another way, if you want to support it cheaply), what I am recommending right now to clients is BigCommerce.com.

    BigCommerce is easy. Software and hosting are managed for you, it has integration with Google Shopping, is SEO friendly, loads super-fast, has blogging functionality, and has gorgeous themes. For a low monthly rate you also get support and some initial consulting. Compare that with hiring a web designer like me and/or hosting it yourself. The bottom line is that WordPress is not an ecommerce platform, it’s designed for blogging. Although it is powerful enough to run an ecommerce site, it’s not its specialty and it will always be harder than a platform designed for ecommerce. For a second hosted solution, consider Shopify. It’s slightly more expensive than BigCommerce and uses less ‘open standards’ of coding, but if you like it better, it’s still a great shopping cart system.

  • osCommerce Vs. Magento Community

    Recently an e-commerce customer who uses osCommerce asked me about re-installing his e-commerce site from scratch or whether or not he should switch platforms:

    1. Can I start from scratch to build an osCommerce site? What’s involved? Would I need to link my shipping and payment?

    Yes, but I don’t recommend that because it’s out-of-date technology that’s hard to update and doesn’t look that good compared to what else is out there. Installing a new OS Commerce install involves:

    1. Creating a blank database via your web hosting control panel.
    2. Downloading the latest osCommerce zip file from osCommerce, unzip it and extract the ‘catalog’ folder.
    3. If you want your shop to be available at http://www.yourdomain.com/catalog then upload the whole of the catalog folder to the root directory of your website via FTP. If you want the site to be available at http://www.yourdomain.com then just upload all of the contents of the catalog folder, but not the folder itself.
    4. Make sure that the permissions on all of the folders are set to 755, and if that does not work then set them to 777. Make sure that the includes/configure.php file and the admin/includes/configure.php file are set to 777 for the duration of the install. Once the install is complete reset to 644, 444, or 400 depending on your server setup.
    5. Go to http://www.yourdomain.com/install and begin the install procedure. Your DB Server will probably be ‘localhost’, your db user name and password (for mysql access) will have been provided to you by your web hosting company. The name of the database you already know – because you just set it up. Do not enable SSL, elect to store sessions in the database and not files (untick the box), and do not enable persistent connections.
    6. After the install create a folder called ‘backups’ inside the ‘admin’ folder (via FTP), and delete the install folder. Reset permissions on the two configure.php files.
    7. Password Protect your ‘admin’ folder using the Password Protect feature in your web hosting control panel.

    2. Can the new site be full screen format? Or can it have a different look? I have not yet figured out how to give my osCommerce site a different look.

    The CSS files in the catalog folder control the color and look of the site. The “catalog/includes/header.php” and “catalog/includes/footer.php” files contain the structure of the tables that control the width of the site. A quick find and replace in your editor will replace all the pages that have the same code as above in the catalog folder. The header.php and footer.php files have a little different code and would need to be manually changed. Look for the “table” element that looks like this:

    [html]
    table width=”100%”
    [/html]

    3. I’m not sure if I want a completely new site – different address or just revamp my current. I think maybe both. Can I use the same shipping and payment for two sites? New site would be O.S. only….I need a no cost option otherwise I would consider something else.

    Magento Community Edition is a much better ecommerce platform and is free to download and use, but to answer your question, yes, you can use the same shipping and payment information for both sites. If you’re serious about considering Magento, there is a osCommerce Migration tool to convert your osCommerce site to a Magento site.

    osCommerce vs Magento4. Why Magento vs. osCommerce?

    Magento has ‘Store View,’ which allows online shop keepers the ability to set up multiple stores with the same products, at different prices, and even in different languages from a single admin area. Magento is better in terms of what it allows you to do and the customer experience. However, the community around osCommerce is huge, and even a person who does not know programming is able to enter and modify the code. If your shop is a huge online store and you are planning to have thousands of products then it’s better to use Magento as it is more robust and has a dedicated support team because of it’s enterprise customers.

  • How to Convert Shopperpress Custom Post-Type Articles to WordPress Posts

    Recently I wrote about how to setup a blog on Shopperpress, which then led one of my readers to ask about what happens to the custom post-type articles Shopperpress uses for the blog functionality when you convert to another theme or want to move your content to another site or ecommerce platform?

    I saw your Shopperpress post, and I just wondered if you could give me any advice. I probably will move from Shopperpress to another platform in the near future. But for now, is it OK to use the “new-articles” function on WordPress to write articles/blog posts? I just wondered if I did this, would the blog posts be transferable from Shopperpress to the new cart I purchase? I just was a little confused by your blog post that’s all. I currently use the “article” template from Shopperpress on my blog page.

    I haven’t tested it, but I believe that posts written as “articles” are custom post-types, which don’t display natively without the plugin or theme calling them specifically. This means that if you were to switch themes, your articles would not display unless the new theme specifically went looking for them.

    Switching to a different shopping cart platform is an entirely different matter unless you were referring to a different WordPress plugin like WP-Ecommerce, which I don’t recommend. If switching to Big Commerce, you’d probably have to copy and paste it all in manually so make sure you do some sort of backup that makes sense to you before switching over.

    I haven’t actually written any blog posts thus far, I’m just in the process of setting it up. Is there an alternative than using the “article” post type to write blog posts? Basically, Shopperpress has hijacked the “posts” option on WordPress to create new products instead. So I can’t create blog posts that way. Is there an easy way to write blog posts on Shopperpress that are easy to move to a new shopping cart if I did move? I don’t know if doing it manually in the future is particularly appealing.

    You’re right in that Shopperpress uses the normal “posts” option to post products. Your options for moving custom post-types like Shopperpress articles to normal WordPress post-types involve using a plugin like pTypeConverter or Post Type Convertr. Your other option is to use a plugin like Backup WordPress.

    Wordpress Post Type Converter

  • Friendly Professionals

    I want to focus on what we actually do and what we are good at. We aren’t really a web design shop, we are a WordPress design shop so that is what I want to focus on. We aren’t selling WordPress designs though, we are selling web site interactivity – the ability for a user to login and change content – essentially BlueBoards and BlueMessenger is now the core product, but we are just being more transparent in saying that we are selling WordPress installations which will allow for that functionality. We won’t have to hide that we are using WordPress, we can promote it because its well supported and adopted.

    Second, since we are selling the ability to edit their own website, we will also be selling the ability to manage their own email using Google Apps. This is secondary, but it falls into the primary selling point – control. We give the customers control of their website and their email, something they may have felt powerless to control in the past.

    We are also FRIENDLY PROFESSIONALS. That is who we are as people and in every business capacity we serve in from Telablue to Neighborhood Geeks. That is what sets us apart from the competition in this world.

    Telablue is a WordPress implementation shop serving the greater Indianapolis area. We specialize in developing web sites for WordPress using professional web design techniques. WordPress is an open source, fully supported content management system (CMS) that was originally developed for blogs, but can be used for almost anything. We chose WordPress because it allows our clients to manage their own content if they so choose, not to mention all the built-in functionality like search and RSS.

    Another one of WordPress’ greatest features is the ability to add software called plug-ins that add functionality for SEO, web forms, or social media, just to name a few examples. And for those who stay up at night worrying, WordPress has backup tools and we at Telablue use international web port monitoring to make sure your web site is up at all times.

    If you are unsatisfied with your current web designer, want more functionality and visitors, or are looking to get started online for the first time, let us show you how friendly, personable, and professional we can be. We can setup a tour of WordPress and go over your needs. The first consultation is free. New web sites start at $1200 for base design and implementation. Existing web sites can be ported to WordPress for as little as $600. Hosting starts at $125 a year and marketing packages start at $150 a month.

    NOTE: Telablue Web Design and SEO was an Indianapolis-area based, WordPress shop, specializing in developing user-editable WordPress themes and templates or transferring current web sites to WordPress installations. It was converted to Watershawl in 2010 and now operates as “Erich Stauffer”.

  • Web Design and Ecommerce

    This is an excerpt from an email conversation I had with my brother-in-law about web design and ecommerce:

    I made these very original drawings and study guides for my various med school classes. I’ve posted them throughout the semester at the medical school web site and have got rave reviews! Especially now that it’s finals time, many of my peers are relying on said study guides as a first source. Anyway, I got to thinking, what if I could consolidate all of my “products” into a website geared towards medical professionals or anyone studying the material. As I go through medical school I can continue producing and refining the drawings and info for each class. I could have a blog section where I give med school survival tips and document the process as I progress through med school. Some of my peers say they feel like they should give me money or buy me a drink for giving out these study guides. So, in the future, this website could have a donations section for some charity. Anyway, can you help me develop something along these lines? Of course, I will pay you for your time and efforts if you decide to help. Can you give me a rough estimate on how much something like this will cost to create and maintain?

    Thanks for thinking of me. I didn’t know that besides being so smart, you were also a great artist and entrepreneur too! Essentially I see you as needing a blog format with an eventual shopping cart. These don’t have to be the same sites. For example, the shopping cart could be a sub-domain of the main website, but I’m getting a little ahead of myself.

    Beginning with the end in mind, I see you creating and sharing content in a blog-like format that you eventually ‘roll up’ into a book that you sell. If you are only selling one book at a time or just want a donation button, you don’t need a full shopping cart, you just need a Paypal button to ‘click and buy/donate’.

    An example of someone doing something similar is The Oatmeal. That’s the shopping cart side, but you get the idea. Pioneer Woman’s blog does something similar in that she rolls her blog posts up into a new cook book every once in a while.

    For the blog, I’d recommend WordPress. If you want to self-host, the easiest way is to buy a Bluehost, HostGator, or 1and1 site for~$75 for a year of hosting and one domain. From there you would install “Simplescripts” for WordPress, then find an appropriate theme, and start blogging. You might also check out WordPress.com for a fully managed solution.

    I think all of this is within your grasp, it just may be a matter of either not having the time to set it up or not wanting to learn about how to set it up to get going. You might first consider whether or not you have the time to write to it, backlink to it, and other modes of promotion. If you don’t think you will actually post to it, I wouldn’t start. One way to test yourself to see if you will post is to start a Facebook page or even just email yourself on a regular basis to see if you have the conviction to do this before you get started.

    If you’re ready to get started and need help on the next step, let me know and I’ll help guide you. If you want me to do it all, we can talk about price, but I do have limited availability right now. Typically I charge clients [SEE Prices] for something like this, but I would help you for much less. Again, try to see how far you can get on your own based on what I’ve told you so far and let me know.

    NOTE: If you’re interested in more about self-publishing, check out Books are the New Business Cards or read more about WordPress, web design, and e-commerce.

  • How to Link to Articles in Shopperpress

    Shopperpress is an ecommerce WordPress theme that has many functions, but some are not so obvious. For example, you can’t easily edit the header navigation bar links. While it automatically links to pages you create and gives you the option to hide the ones you don’t want displayed, you can’t add custom links without editing the theme files directly. We created a Shopperpress child theme for one of our clients, but we didn’t want to break the inherent functionality of the theme – we wanted to work with it. The problem was, the client wanted the header navigation bar to link to “articles”, but it wasn’t really clear at first how to do this.

    How to Link to Articles in Shopperpress

    Shopperpress takes over WordPress default post types and calls them “Products”. This means that typical blog content is forced over to a custom post type called “Articles”. These articles are created and managed in the “Article Manager”. If your WordPress website already had blog posts, these will need manually changed over to the post type “Article Manager”. To display all of the articles, create a page called “Articles” or “Blog” or whatever you like and change the Page Template type to “Articles Template”. This “TPL” file in the Shopperpress theme calls a hook that pulls in all of the articles. This new page will now appear in the header navigation until it is asked not to. To change the order in the menu, change the Order number of the pages. The lowest number, starting at “0” will appear on the left and the highest number will appear on the right. If the numbers are the same, they go in the order they were created.

    More Notes About Shopperpress Blog Function

    • Shopperpress requires you to change the Permalinks to %postname% which means that you lose any SEO value of putting categories before post names with %category%/%postname%.
    • Shopperpress requires you to put in a description for each article. It doesn’t automatically display the content or the excerpt. This gives you more control, but takes time.
    • Exported blog post Articles created as the Articles Template custom post type will not display on a default WordPress installation when imported unless Shopperpress is used.

    While Shopperpress is great for automatically pulling in affiliate products from sites like Amazon and eBay, it’s not a great blogging platform, but that’s okay if your primary goal is to use WordPress for ecommerce. However, if you’re wanting to develop an ecommerce site, we are currently recommending Big Commerce due to it’s speed, extensibility, and CSS/HTML editability.

  • Add or Exclude From Specific Post in WordPress

    I’ve been doing a lot of content management lately and that means managing larger back archives of web data used in content marketing. Over the course of time, things you might have wanted to happen in the past to every web post in WordPress may not always apply in the present or the future. When it’s a rare occurrence, such as when you don’t want a particular thing to display on a particular post that displays everywhere else, you’ll need to make an exception loop for that post in the single.php file.

    Now this sounds easy, and it is, but for some reason I had a really hard time finding it. The confusion lied in that WordPress names all pages and posts with a “Page ID” number, which is a unique number in the WordPress SQL database, like a primary key. But just because the name says “Page ID”, that doesn’t mean WordPress thinks of pages and posts in the same way. According to the WordPress Codex, when querying a post, you must use “is_single”. Here’s the code below:

    Where the number (in this case 1454) is the page ID of the post. NOTE: is_page and is_post do not work for blog post IDs.

    [php]
    thing you wanted to show if that post

    thing you wanted to show otherwise
    [/php]

    When I was searching for a solution, other people were using it to show or hide excerpts. I was using it to show or hide a specific block of code I was using like a boilerplate at the end of each post in the client’s theme. You can use it to show or hide whatever you like, but let me know in the comments.

  • 2 Ways to Get More Email Addresses 2 New Ways to Get Money

    For small businesses who are interested in growing their email marketing and transactional email in order to better market and reduce costs, I wanted to share two new ways to collect emails, which just happen to dovetail into two new ways to make money.

    2 New Ways to Get Email Addresses:

    In the past, you may have ‘straight-up asked’ people for their email addresses with a paper form in your office or a web form on your website. You may have even incentivized them with a coupon for handing over such valuable information. But maybe this hasn’t worked so well for whatever reason (fear of spam? older client base?) so here are two new ways to collect email addresses:

    1. Ask the patient or customer at checkout whether or not they’d like their statement receipt emailed to them. If they don’t have an email on file, we add it then. People may be more likely to give you their email address when it has to do with transactional information like statements and balances.

    2. Allow patients/customers/donors to make payments online or to buy products (like toothpaste or gift certificates) online. In either of these cases, the patient will be required to enter their email address. These also happen to be the two new ways to get money.

    While cost savings associated with email vs. paper mailings, turning off the lights when you’re not using them, and stopping the local newspaper might work for a while, eventually you’re going to want to start getting more cash flow in the door. You’re going to want to leverage the website you’ve already paid for to start collecting payments and/or selling products online.

    2 New Ways to Get Money:

    If you don’t already take payments online, your paitents or customers are paying in person or by mail. Why are you making it so hard for your constituents to give you money?. Here are two ways you can get patients or donors, respectively, to start paying online:

    1. Allow patients, customers, or donors to make a payment online. These payments can be setup as a one-time or recurring payment and can be stand-alone or embedded in an ecommerce platform like OScommerce, WP-e-Commerce for WordPress, or Shopify. I’ve also heard Big Commerce is good, but have no experience with it.

    2. Sell something online that you can ship to them – a new revenue source. If your office is already used to mailing out packages daily via USPS, FedEx, and UPS, why not add product sales to the mix? Think of it as a value-added service to your business by saving your customers or patients a trip to the office to pick something up you sell.

    Payment Gateways

    One of the most confusing aspects of setting up and accepting payments online via credit card or debit card is the “payment gateway” which is the service that actually processes the transaction. There are plenty of banks and other companies that offer this service with a host of different requirements and possibilities. While I recommend using Square for some small businesses, they do not offer a web payment gateway. The alternative to Square is Stripe, which has similar pricing and transparency. Paypal has traditionally been a great option and one I have used in the past, but Stripe is making it easier to stay PCI-compliant due to the way their technology keeps all the credit card processing on their servers. However, according to their site, “SSL is required when you use Stripe.js to make live charges. If you aren’t using Stripe.js, you’ll also need to ensure your server is fully PCI compliant.”

    If you would like to learn how to add payments to your website and are located in the Indianapolis, Indiana area, please give Erich Stauffer a call.