VIRTUEMART: Styling the ADD TO CART button
The following will remove the ADD To CART text entirely (This could be used if the button was an image):
components/com_virtuemart/themes/default/templates/product_details/includes/addtocart_form.tpl.php
Other modifications can be made using this line of code.
class: Gives the button a CSS class
value: gives the button text (ie: Add To Cart)
PHP files that create the Blog pages.
** CATEGORIES **
PHP file that creates the products:
components/com_content/views/category/tmpl/blog_item.php
PHP that creates the page
components/com_content/views/category/tmpl/blog.php
** SECTIONS **
PHP file that creates the products:
components/com_content/views/section/tmpl/blog_item.php
PHP that creates the page
components/com_content/views/section/tmpl/blog.php
** BROWSE PAGINATION **
components/com_virtuemart/themes/default/templates/browse/includes/browse_pagenav.tpl.php
** FLYPAGES **
PHP file that creates the products:
components/com_content/views/article/tmpl/default.php
Removing the text heading on the frontpage
There is a text heading wrapped in a componentheading_ div class. To get rid of this, and display an image instead, look up this file:
components/com_content/views/frontpage/tmpl/default.php
Look for the div class componentheading, and wrap that div in a container div.
In your CSS file, set componentheading to display: none – and set a background image in your newly created container div.
Adding a unique CSS class to contentheading on the frontpage
Items in the frontpage are made up of a table with 2 rows, but Joomla has given both rows the same class: contentpaneopen
In my site I wanted my article headings to be contained in a div with a coloured background, and the text within that div needed to have its own unique class (Which it currently does not with joomlas default file)
To access the php file to create your own unique class, head over to this file:
components/com_content/views/frontpage/tmpl/default_item.php
Creating a pure CSS template for Joomla
I’ve been looking around trying to find resources on creating a complete tableless template for Joomla. Information is a little thin on the ground, but I did come across this excellent tutorial..
http://www.informit.com/articles/article.aspx?p=1152145&seqNum=1
More info, as I finalise my own CSS driven template..
The difference between CLASS and ID
ID : used once on a page – Denoted in CSS by a hash #
CLASS: May be used multiple times on a page – Denoted in CSS by a period .
VIRTUEMART: Change Ascending / descending sort default on Browse page
Make a change to the file located in administrator/components/com_virtuemart/html/shop_browse_queries.php
Line #23
$DescOrderBy = $vmInputFilter->safeSQL( $vm_mainframe->getUserStateFromRequest( "browse{$keyword}{$category_id}{$manufacturer_id}DescOrderBy", 'DescOrderBy', "ASC" ) );
Change to:
$DescOrderBy = $vmInputFilter->safeSQL( $vm_mainframe->getUserStateFromRequest( "browse{$keyword}{$category_id}{$manufacturer_id}DescOrderBy", 'DescOrderBy', "DESC" ) );
VIRTUEMART: To display both SHORT DESCRIPTION & PRODUCT DESCRIPTION in Browse page
Add the field you want to the SQL query in:
administrator/components/com_virtuemart/html/shop_browse_queries.php
on line 37 after `product_s_desc` add `product_desc`
Put the data in a variable in:
administrator/components/com_virtuemart/html/shop.browse.php
- after the product_s_desc version on line 392, add:
$product_description = $db_browse->f(“product_desc”);
- after the product_s_desc version on line 438, add:
$products[$i]['product_description'] = $product_description;
Use the $product_description variable in your browse_x.php template as needed. I used it on the folowing:
components/com_virtuemart/themes/default/templates/browse/browse_1.php
Don’t forget to wrap it in a DIV tag, so you can apply CSS styles to it..
Virtuemart: To display both SHORT DESCRIPTION & PRODUCT DESCRIPTION in flypages.
Find the flypage PHP:
components/com_virtuemart/themes/default/templates/product_details/flypage.tpl.php
look for the following line (This creates the product description):
insert the following after it (remember to wrap it in it’s own div tag to apply styles with CSS):
