Archive

Archive for the ‘Magento’ Category

My Team Plugin for WordPress

December 19, 2013 1 comment

We are  happy to release “My Team” a new WordPress to display team/staff members. You can also display a set of pictures and information in different layouts.

Nowadays, WordPress is more than just a blog. And behind such website is a team. The plugin acknowledges those guys, by creating a template which anyone can copy in his theme directory and have a page ready for the people behind it. The plugin provides the administrator with a nice interface to add/edit/delete the team members. The plugin is under active development so keep checking the page. The plugin uses the short-code given at

http://wordpress.org/plugins/wp-my-team/

Features:

You can display the entries in 4 different main ways

  1. Grid view.
  2. Grid view with Information on hover.
  3. Table list view.
  4. Number of Columns.
  5. Image Shapes and effects.
  6. Text Align.
  7. Special Settings.
  8. Image Sizes.
  9. Email Settings.
  10. Single Page Settings.
  11. Auto Generation Shortcode & PHP Function.

screenshot

Understanding Regular Expression

October 22, 2013 Leave a comment

Regular expression is the most important part in form validations and it is widely used for search, replace and web crawling systems. If you want to write a selector engine (used to find elements in a DOM), it should be possible with Regular Expressions. In this post we explained few tips that how to understand and write the Regular Expression in simple way.

Will discuss about basic regular expression in three stages.

Stage 1

Symbol             Explanation

^                       Start of string
$                       End of string
.                        Any single character
+                       One or more character
\                        Escape Special characters
?                       Zero or more characters

Input exactly match with “abc”

var A = /^abc$/;

Input start with “abc”

var B = /^abc/;

Input end with “abc”

var C = /abc$/;

Input “abc” and one character allowed Eg. abcx

var D = /^abc.$/;

Input  “abc” and more than one character allowed Eg. abcxy

var E = /^abc.+$/;

Input exactly match with “abc.def”, cause (.) escaped

var F = /^abc\.def$/;

Passes any characters followed or not by “abc” Eg. abcxyz12….

var G = /^abc.+?$/

Stage 2

Char                Group Explanation

[abc]                 Should match any single of character
[^abc]               Should not match any single character
[a-zA-Z0-9]      Characters range lowercase a-z, uppercase A-Z and numbers
[a-z-._]              Match against character range lowercase a-z and ._- special chats
(.*?)                  Capture everything enclosed with brackets
(com|info)         Input should be “com” or “info”
{2}                   Exactly two characters
{2,3}                Minimum 2 characters and Maximum 3 characters
{2,}                  More than 2 characters

Put together all in one URL validation.

var URL = /^(http|https|ftp):\/\/(www+\.)?[a-zA-Z0-9]+\.([a-zA-Z]{2,4})\/?/;

URL.test(“http://selvabalaji.com);                      // pass
URL.test(“http://www.selvabalaji.com”);            // pass
URL.test(“https://selvabalaji.com/”);                   // pass
URL.test(“http://selvabalaji.com/index.php”);    // pass

Stage 3

Short Form     Equivalent              Explanation

\d                      [0-9]                         Any numbers
\D                     [^0-9]                       Any non-digits
\w                     [a-zA-Z0-9_]            Characters,numbers and underscore
\W                    [^a-zA-Z0-9_]          Except any characters, numbers and underscore
\s                       –                                White space character
\S                      –                                Non white space character

 

var number = /^(\+\d{2,4})?\s?(\d{10})$/;  // validating phone number

number.test(1111111111);           //pass
number.test(+111111111111);     //pass
number.test(+11 1111111111);    //pass
number.test(11111111);               //Fail

 

Quick tips for: Hide a Magento Test Site

October 15, 2013 Leave a comment

With every Magento e-commerce website I create for my clients, I create a carbon copy for use as a test environment that is accessible on the web.

There are a number of benefits associated with doing this before making changes on a live environment:

  • The ability to upgrade on the test server as updates become available.
  • Test extensions from Magento Connect.
  • Developing, testing and implementing new features.
  • Get sign off from the client while still in a test environment.

I can then quite easily and efficiently role out these enhancements without fear of complication.

What is vital though is that search engines don’t crawl and index the test environments. This can be done quite easily from within the Magento Dashboard.

Navigate to Configuration -> Design -> HTML Head and set the Default Robots option to ‘NOINDEX, NOFOLLOW’. This should add a ‘NOINDEX, NOFOLLOW’ meta tag to your site.

 

7 common mistakes in Magento SEO

October 15, 2013 Leave a comment

1. Homepage title “home”

If I had a dollar for every Magento store out there I’ve seen with a homepage title “home” I’d be a rich man. The homepage is usually a CMS page. Go in there and change the title of the page into something more suitable such as “Blue Widgets Online Store – Example.com”.

2. Using “default description” field

System > Configuration > General > Design > HTML Head > Default description – Leave this blank or you’ll have such a mess of duplicate descriptions on your store that don’t really describe the given URL that it will be unbelievable. Also, please make sure your meta keywords are not “magento, magento commerce” etc.

3. Not turning on rel=canonical

Save yourself from lots of duplicate content issues. Turn canonicals on for both products and categories.

4. Logo title and/or alt “Magento Commerce” 

Logo, usually in the top left of your website. Don’t have it say “Magento Commerce”. I’ve seen that a lot of times.

5. Forgetting to turn meta robots to “index, follow” and remove robots.txt disallow after a move from staging/dev site to the live site

System > Configuration > General > Design > HTML Head > Default robots “INDEX, FOLLOW”.

Sometimes people leave this as noindex, nofollow on dev server and forget to change it when they migrate to the live server.

6. Having a default layered navigation

Layered navigation is a hell for the SEO.

7. Building a sitemap with sample products and sample categories

I’ve seen this one as well. Check what’s in your sitemap.xml before you submit it to Google. No sample products please! :)

How Multiple Websites & Stores Work

October 15, 2013 Leave a comment

One of Magento’s advanced features allows for management of multiple websites and stores within one installation, and we have an amazing system to support this:  GWS – aka “Global, Website, Store.”

  • Global: This refers to the entire installation.
  • Website: Websites are ‘parents’ of stores.  A website consists of one or more stores. Websites can be set up to share customer data, or not to share any data
  • Store (or store view group): Stores are ‘children’ of websites.  Products and Categories are managed on the store level.  A root category is configured for each store view group, allowing multiple stores under the same website to have totally different catalog structures.
  • Store View: A store needs one or more store views to be browse-able in the front-end.  The catalog structure per store view will always be the same, it simply allows for multiple presentations of the data in the front.  90% of implementations will likely use store views to allow customers to switch between 2 or more languages.
  • multiple_websites_diagram
  • Example scenario

    Let’s say you want to sell appliances, consumer electronics, and DVD’s and CD’s.  For the purpose of this example we’ll separate the catalog into two stores and three websites.  The appliance line will be sold on its own website, and the remaining items on another website.  You bought appliances.com and coolstuff.com for this purpose.  You don’t want customer data and order data to be shared between the two websites, so data sharing will be turn off in the configuration between them.

    Under coolstuff.com you create two stores – Electronics, and Media.  Consumer electronics will be sold through the electronics store, and the media items through the Media store.  Since each line of items is very extensive, it makes sense to create a separate category structure for the Media store and the Electronics store… otherwise the category tree would be large and cumbersome.  When the stores are created, you simply assign a different root category to each store.

    In addition, you want to feature your catalog for both websites in English and Spanish.  To do this, you will create an English and Spanish store view for each of the three stores.  When entering catalog data you can switch store views in the admin to create the additional product titles, descriptions etc…

    Configuration

    The configuration of Magento uses GWS as a kind of tree when setting up the stores.  When it is initially installed, all configuration settings point to “default”, meaning the global installation.  A check box next to each configurable item can be un-checked in a particular website or store view, to indicate that this item will be specific to this website or store view.  For example, you will offer authorize.net as a payment module on both websites, but you only want to offer google checkout on coolstuff.com.  In the configuration, you’d select coolstuff.com in the store view drop-down, find the google API settings, and un-check “use default” in the google checkout tab.  For this specific website you can now enable or disable google checkout.

    All modules in the configuration function the same way.

    Moving on to store views – after a store view has been created, you can configure the layout and visual settings of the store view however you’d like – a drop-down allows customers to switch between store views.  This will reload the current page with the alternate view.  This can be used for multiple languages, but can also be a way to easily do A-B testing between several design packages to see if one yields more conversions.  The possibilities are endless!

    The above is meant as a basic overview of this functionality – the best way to learn how to set it all up is to install Magento and get in there and start playing around.

Magento’s Default Files and Folders Structure

October 15, 2013 Leave a comment

This part of the Magento tutorial will provide detailed information regarding the Magento’s default files and folders structure.

You will learn more about the functions of main files and folders included in the Magento package.

The files and folders included in the main directory are as follows:

• .htaccess – contains mod_rewrite rules, which are essential for the Search Engine Friendly URLs. There you can also find standard web server and php directives that can improve your web site performance.

• .htaccess.sample – this is a backup of the .htaccess file. If you modify .htaccess it can be used in order to get the default settings.

• 404 (directory) – The folder stores the default 404 template and skin for Magento.

• app (directory) – This folder contains the modules, themes, configuration and translation files. Also there are the template files for the default administrationtheme and the installation.

• cron.php – a Cron Job should be set for this file. Executing of the file on a defined time period will ensure that the complicated Magento caching system will not affect the web site performance.

• downloader (directory) – This is the storage of the web downloader files. They are used for the installation and upgrade of Magento through your browser.

• favicon.ico – the default favicon for Magento. A small icon that is shown in the browser’s tool bar once your web site is loaded.

• index.php – the main index file for Magento.

• index.php.sample – A backup of the default index file. It can be used to revert the changes in a case of a index.php modification.

• js (directory) – Contains the pre-compiled libraries of the JavaScript code included in Magento.

• lib (directory) – The Magento core code is located in this folder. It contains the software’s PHP libraries.

• LICENSE_AFL.txt – The Academic Free License under which the Magento software is distributed.

• LICENSE.txt – The Open Software License under which the Magento software is distributed.

• media (directory) – This is the storage of the Magento media files – images out of the box, generated thumbnails, uploaded products images. It is also used as a container for importing images through the mass import/export tools.

• mage (in versions older than 1.4.2.0 this tool was called pear)- The file controls the automatic update through the downloader script and SSH. It handles the update of each individual Magento module.

• php.ini.sample – This file contains sample php directives that can be used in order to modify your PHP setup. If you want to alter the default setup edit the file and then rename it to php.ini.

• pkginfo (directory) – Contains files with information regarding the modules upgrades’ changes.

• report (directory) – This folder contains the skin of the Magento errors reports.

• skin (directory) – There are located the themes files – images, JavaScript files, CSS files, Flash files. Also there can be found the skin files for the installation of skins and administration templates.

• var (directory) – Cache, sessions, database backups, data exports and cached error reports can be found in this directory.

If you want to modify an existing template or set a new one you should know that the template files are separated in 3 folders:

• /app/design/frontend/default/YOUR_TEMPLATE_NAME/layout/ – Contains the .xml files that define which modules should be called by the template files and loaded in defined areas on the site.

• /app/design/frontend/default/YOUR_TEMPLATE_NAME/template/ – Contains files and subfolders that structure the final output for the users using the functions located in the layout/ folder.

• /skin/frontend/default/YOUR_TEMPLATE_NAME/ – Contains the CSS, images, JavaScript and Flash files related to the template.