Skip to main content

Installing Virtuemart for Joomla

VirtueMart is a free piece of Shopping Cart Software made for Joomla.  It works right out of the box with a few minor tweaks, but it also allows for some major customization.

There is a lot to learn about VirtueMart to get it fully customized for your needs, but if you want a free e-commerce shopping cart component for Joomla, VirtueMart is the leading candidate.

To install VirtueMart is easy.  Download the latest complete package from the VirtueMart website.  Log into your Joomla adminstrative interface and upload the package that you just installed (see Joomla - Installing Components and Plugins).  You need to unpack the file you just download because you are only going to need to initially upload the file called com_virtuemart_1.1.5.j15.zip (corresponding to the version you downloaded).



After you have unpacked and uploaded the component, you will presented with a page asking whether you wish to go directly to the store or install sample data.  If you have data you want to enter right away, select go directly to the store.  If you want some sample data which you can delete later, to help fill up your store, then choose the install sample data route.


You will be asked to wait a minute while the installation completes and then you will be taken to the VirtueMart control panel.  From within this panel, you can begin administrating your store information, adding items, editing payment and shipping information, etc...  You can find some tutorials for these actions here (more being added every day as the support site grows):


Once you get comfortable with the VirtueMart control panel (now found under the components menu), there are a few other modules and plugins that are distributed with VirtueMart that you may be interested in.



Under the plugins folder found in the unpacked download you completed earlier, you will find:

Plugins

vmproductsnapshots
This is a very handy plugin that will enable you to embed store items into Joomla articles.  I find this helps when you want to append a store item after an informational article.  This plugin allows you to keep the flow of your site, helping to direct the flow of a visit from an article to a purchase.
After installing this plugin, make sure you go to the plugin category and enable the plugin because it installs in a disabled state.

Usage:
{product_snapshot:id=XX,showname=y|n,showimage=y|n,showprice=y|n,showdesc=y|n,showaddtocart=y|n,displayeach=h,displaylist=v,width=90%,border=0,style=color:black;,align=left}

example:

{product_snapshot:id=7,showname=y,showimage=y,showprice=y}

string id (product_id) replace XX with the product you want to show, to show more than one prodcut, separate with vertical bar |

string showname (show the product name? y or n)

string showimage (show product thumbnail? y or n)

string showprice (show the product price? y or n)

string showdesc (show the product short description? y or n)

string quantity (the quantity to add to cart. Separate with vertical bar when there's more than one product eg 1|2|1)

string showaddtocart (show an "Add-to-cart" link? y or n)

string align (can be default (empty), left, right or center)  Sets the alignment of the product snapshot table within the content.

string displayeach (the horizontal or vertical orientation of the product attributes. h or v)

string displaylist (the horizontal or vertical orientation of the products.  It only applies when there is more than one sku. h or v)

string width (The width of the Table element)

string border (The value of the Border attribute of the Table element)

string style (the value for the style attribute of the Table element)

vmxsearch.plugin
Installing and enabling this plugin will allow you empower the built in Joomla site search feature to include all the items in your shop in Joomla's site search.  If you want to use a search feature on your site, this is a must to install.



Modules
Modules that come with Virtuemart will be explained in the next post.  Some of these are nice and powerful and give plenty of customization options.

Comments

Popular posts from this blog

How To Run Chrome From Within Notepad++

If you have recently tried to Run  Chrome from within Notepad++ recently, you've probably encountered the same issue I did.  Chrome didn't run. The fix is actually really simple.  Open up the Run box in Notepad++ and browse to your installation of Chrome. ie.  C:\Program Files\Google\Chrome\Application\Chrome.exe Select the file when you find it.  Now, the trick is: Put quotation marks around the path you see in the Run  box.  Now, put 1 space after the closing quotation mark. Type this: $(FULL_CURRENT_PATH) It'll look something like this: Click Run .  If Chrome opens, click Save and set your hotkey.

Developer Note: Virtuemart - Editing the Add to Cart MooTool Popup

To edit the “Add To Cart” popup that appears when you add an item to a cart in Virtuemart, there are few files that you need to know about. These are the files to know \components\com_virtuemart\themes\default\theme.js \components\com_virtuemart\js\mootools\   - contains the files for editing the appearance of the popup. To edit the appearance of the box, edit \components\com_virtuemart\js\mootools\mooPrompt.css to change the styles as well as editing the 2 images in the directory to edit how they appear as well (close box and header-background)

Divi Theme - Remove pause 'on hover' of the full width slider

In the Divi theme, open up /js/custom.js Comment out the following code (around line 144) if ( settings.slideshow && et_slides_number > 1 ) { $et_slider.hover( function() { $et_slider.addClass( 'et_slider_hovered' ); if ( typeof et_slider_timer != 'undefined' ) { clearInterval( et_slider_timer ); } }, function() { $et_slider.removeClass( 'et_slider_hovered' ); et_slider_auto_rotate(); } ); }