My Writings. My Thoughts.
How to Find the Supply and Demand of Keywords
// February 5th, 2008 // No Comments » // Google, SEO, eCommerce
1. Go to : http://freekeywords.wordtracker.com 2. Type in the keyword phrase you’re researching for. Click on “Hit Me”. 3. The number next to the keyword phrase is how many times a day people type in the keyword phrase. This is called the “demand”. (Note: you want this number to be at least 15-20).
1. Go to Google http://google.com 2. In the search bar type: allintitle: keyword phrase 3. Hit enter. The search result number presented is the “supply” or “competition”, and is how many sites have those keywords within the html title tag of their sites. (Note: you want this number to be below 30k).
Custom Meta Descriptions, Meta Keywords, and Title Tags in Shopify
// November 21st, 2007 // No Comments » // SEO, Shopify, Web Builders, eCommerce
UPDATED:
Shopify can be a great web builder, especially if you want complete product control and full customization to the template. The programming language in Shopify is mainly written in Ruby On Rails. Unfortunately, Shopify doesn’t have a way to do custom meta and title tags built in. However, with some tweaking having your own custom meta tags and title tags is possible. Similar directions can be found in Shopify’s forums where other great insights can be found. Well, with that said, here are the directions for doing this:
1. Login to your Shopify administration.
2. Now click on “Assets” and then click on “Theme Editor”.
3. You will need to edit some things in your template for this to work correctly. Click on “Theme.liquid” to go into the edit page for your main theme file.
4. On this page you will see something like this near the top of the code:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>{{shop.name}} - {{page_title}}</title>
{{ 'textile.css' | global_asset_url | stylesheet_tag }}
{{ 'lightbox.css' | global_asset_url | stylesheet_tag }}
{{ 'prototype.js' | global_asset_url | script_tag }}
{{ 'effects.js' | global_asset_url | script_tag }}
{{ 'lightbox.js' | global_asset_url | script_tag }}
{{ 'layout.css' | asset_url | stylesheet_tag }}
{{ 'shop.js' | asset_url | script_tag }}
{{ content_for_header }}
</head>
You will need to DELETE the code that says:
<title>{{ shop.name }} | {{ page_title }}</title>
5. Now add the code the following code between your <head></head> tags:
{% case page_title %}
{% when 'Welcome' %}
<title>Title for your home page</title>
<meta name="description" content="Your description goes here" />
<meta name="keywords" content="Your keywords go here" />
{% when 'Page Name' %}
<title>Title for your home page</title>
<meta name="description" content="Your description goes here" />
<meta name="keywords" content="Your keywords go here" />
{% endcase %}
Replace in the “Page Name” with the name of your page or product exactly as it is named. For example, if I had the page called “The Elephant ate Here” I would replace “Page Name” with “The Elephant ate Here”. You will also want to place your meta own descriptions and meta keywords for the appropriate page.
So, the examples here would then look something like this:
{% case page_title %}
{% when 'Welcome' %}
<title>Title for your home page</title>
<meta name="description" content="Your description goes here" />
<meta name="keywords" content="Your keywords go here" />
{% when 'The Elephant ate Here' %}
<title>The Elephant ate Here | and there is nothing left</title>
<meta name="description" content="The elephant ate everything that was here. There is now nothing left." />
<meta name="keywords" content="elephant, ate here, nothing left, all gone" />
{% endcase %}
You can repeat the following code for each page or product that you would like as well:
{% when 'Page Name' %}
<title>Title for your home page</title>
<meta name="description" content="Your description goes here" />
<meta name="keywords" content="Your keywords go here" />
Click “Save” when finished and then click on “Close” next to the save button to go back to the Theme Editor page.
Product Navigation in Shopify
// November 14th, 2007 // No Comments » // Shopify, Web Builders
What these directions are setup to do are to help you create pages that contain a list of links that connect to your individual collection (or category) pages for your products. So you will have a link in your side navigation that connects to a page (you can call this “Products” if you would like) that contains links that connect to some of your collection pages (or product category pages). Here are the steps for setting up an effective navigation in Shopify:
1. Login to your Shopify account for your site.
2. Click on “Products” and add your products.
3. After adding your products, click on “Collections” then click on “Create new Collection” and make a new collection (these are basically categories that you are going to be putting your products into). Remember what you name your Collection; the relative URL for you new collection will be something like “/collections/watches”.
4. Now click on “Blogs & Pages” then click on “Create Blog or Page”. Create a new Page.
5. While still editining your page, create links that you can use to connect your new page to your collections pages. You will need to use textile coding to create the links.
Example: If you want to create a link on the word, “watches” you would need to type the following in your edit box for you page: “watches”:/collections/watches
6. Create links for the collection pages (or category pages) you would like to be displayed on this page using this process. Click “Post Page” when finished (or, if you are editing an already created page, click on “Add Changes”.
7. Now, click on “Navigation” to add your newly created page to your side navigation. After clicking on “Navigation” click on “Add Link” under the list that is beneath “Main Menu”. Choose a name you would like (“Products” may be a good choice) for the “Name of link”. In the “Links to” drop down choose “Page”. After doing this another drop down menu will appear to the right of the “Links to” drop down. From that drop down choose the page you just created. Click “Add Link” when finished.
Meta Tags in Shopify
// October 29th, 2007 // No Comments » // Design, SEO, Shopify, Web Builders, eCommerce
Alright, we’re back. It’s been some time since I’ve posted last. Lots of projects going on at work, at home, and school. One of such projects has been playing around with Shopify. My most recent discovery with Shopify is how to create custom meta tags. Although, I’m still trying to figure out how to create custom meta tags for each page, you can still create custom meta tags for your individual products. What this does basically, is automatically turn the description for your product into the meta description and turn the tags assigned to your product into meta keywords. That’s better than nothing and with using Shopify your main focus is going to be on your products, anyway. Here is what you will need to do to get these this to work:
1. Login to your Shopify admin.
2. Navigate to “Assets” (Shopify recently changed “Look and Feel” to “Assets”). Then click on where it says “Theme Editor”
3. Now click on “Theme.liquid” to open up your layout code for your template.
4. Near the top of the code will be where the header code starts. Look for “<head>”. After the <head> tag enter the following code:
{% if template == “product” %}
<meta name=”description” content=”{{ product.description | strip_html }}” />
<meta name=”keywords” content=”{{ product.tags | join: “,” }}” />
{% endif %}
5. Click “save” when finished for it to take effect.
Learning Firefox from Mozilla
// August 6th, 2007 // 4 Comments » // Development, Firefox, Google
With Firefox becoming more and more popular, there has been an increasing amount of information on how to use it. I was reading through the “Tips and Tricks” category of the Mozilla blog when I came across some useful information. This particular post was especially useful for novice and advance users alike. A printable cheat-sheet on the keyboard short-cuts in Firefox. There was another post I found useful as well; with tips on changing the font size in your browser to restoring closed tabs to using the Google search bar at the top as a calculator.
What is Meebo.com?
// July 24th, 2007 // No Comments » // Google, Misc, Web Builders, WordPress
Have you ever been on a trip or away from home or office and the only computer you have access to is one that doesn’t have MSN messenger? Meebo.com is a free solution for you. At www.meebo.com you can log into your MSN messenger account, AIM account, Yahoo! messenger account, or your Google Talk account, and chat with your friends, family, or coworkers straight from the web browser. No downloading required. Meebo.com even has their own messenger that you can create an account for and sign in at this login page. There is even a way to embed a Meebo chat into your website or blog. The WordPress created blogs have this function as one of their widgets. For the free account, you can look it up by going to your Dashboard, then to your Presentation tab, then to Widgets. With WordPress sites that you have bought your own hosting for (like from Bluehost, or Hostmonster) you will need to download a plugin that would enable Sidebar Widgets. You can find a plugin at www.wordpress.org
Suggestions Welcome
// July 21st, 2007 // No Comments » // Development, Misc, Web Builders
As you have seen, I have done different tutorials on how to use different builders such as Site Creator Plus, and WordPress. I’m always looking for suggestions. If you have an idea of something you would like covered or if you have additional questions, leave a comment with your suggestion.
Snipshot Cont.
// June 27th, 2007 // No Comments » // Design, Photography
This week I played around more with resizing images with Snipshot. It was a lot of fun. I found it way easy to use, very user friendly, and straight forward on how to resize, crop, and enhance images. Here are some screen shots and a quick overview of how to resize, crop, and enhance the color of images.
1. Go to Snipshot.com and click on the button that says “Browse” underneath where it says “Open from your computer.”
2. A window will pop-up that you can use to navigate through your computer to the image that you are wanting to edit. Go ahead and choose the image you would like to resize, crop, or enhance the color of.
3. Now you can do any or all of the remaining steps:
a. Cropping: After clicking on the Crop button at the top of the screen, click and drag one of the red boxes to change the area you would like to crop. Press enter or double click to apply the crop.
b. Resizing: Similar to cropping, you can resize the image by clicking and dragging one of the little red boxes. Selecting the corners will keep the image to scale. Selecting the edges (top middle, bottom middle, left middle, and right middle) will skew the image (or scrunch it up).
c. Enhancing: I’m putting the rest of the options into this category. There are a lot of different things you can do with this. Clicking on “Enhance” will automatically alter your image for you, correcting the lighting, contrast, etc. Clicking on “Adjust” will give you options where you can change the size of the image (yes, you can resize it here too), tilt the image (this keeps the dimensions of the image but moves the contents of the image around. Just play around with it, you’ll understand), change the brightness (how light are dark the image as a whole is), change the contrast (how light the lights are and how dark the darks are), change the saturation (how concentrated the colors of the image are), change the hue (that’s the color), and change the sharpness (how blurry the image is).
4. When finished with your changes save your image. You can actually save in a variety of formats: to your computer (JPG, GIF, PDF, PSD, PNG, and TIF) or to the web (WebShots and Flickr). (I went over WebShots in a previous post).
(Note: I did all the cropping and resizing for images in this post with SnipShot)
Putting on a New Face
// May 22nd, 2007 // 1 Comment » // Design
A few months ago, for a college project, I was required to put a picture of my head in another picture and make it look realistic. This is what I came up with. Enjoy.
Before
AfterCheck Out the New Content Available
// May 19th, 2007 // No Comments » // About Me, Development
Along with this site I have been doing another blog where I have been posting different things that I have learned related to e-commerce, SEO, webdesign, and websites and builders. Feel free to browse through these post that I have imported from my other site. You can either browse a page at atime, or by category. And remember, if you ever want to give me a comment, suggestion, ask a question, or even just say hello, please leave a comment with a related post.
