Display attributes on top of Add to Cart button

adilx
Inactive member
Topic Author
New Member

12 years 9 months ago #16961 by adilx

Replied by adilx on topic Re: Display attributes on top of Add to Cart button

I applied the CSS Milo gave me but it wont look right if there are no attributes for a particular product. A big space is left at the spot where the two attributes were.

The website visitor might have look harder for the button because it is an inch below the description text.

Although it looks right if the product has one or two attributes because they take up the empty space.

Please Log in to join the conversation.

ivan.milic
Support Staff
Moderator

12 years 9 months ago #16963 by ivan.milic

Replied by ivan.milic on topic Re: Display attributes on top of Add to Cart button

??? yes maybe better you just modify flypage , but I just noticed that you are not using our templates so you will have to think it on yourself.

Please Log in to join the conversation.

adilx
Inactive member
Topic Author
New Member

12 years 9 months ago #16967 by adilx

Replied by adilx on topic Re: Display attributes on top of Add to Cart button

Ofcourse I am using your template and the product details flypage I am using is this one:

/public_html/components/com_virtuemart/themes/hot_fashion/templates/product_details/flypage_hot_fashion.tpl.php

I also attaching a screenshot of the problem I am having.

Basically I compared the original VM 1.1.8 flypage and the $html variable is located at a different spot in both the files. Maybe this is the problem?

Attachments:

The following user(s) said Thank You: milos

Please Log in to join the conversation.

milos
Support Staff
Moderator

12 years 9 months ago #16985 by milos

Replied by milos on topic Re: Display attributes on top of Add to Cart button

Both attributes and button are inside the addtocart code, and it's showing button first, and attributes next. You can't change it. Therefore, I gave you a CSS trick. You can use it, or leave it as it's by default (button, then attributes).

Please Log in to join the conversation.

adilx
Inactive member
Topic Author
New Member

12 years 9 months ago #17003 by adilx

Replied by adilx on topic Re: Display attributes on top of Add to Cart button

This is not default in Virtuemart 1.1.8.

In the default VM template this is the order

1. DIV for the attributes
2. DIV for the add to cart button

You can please check the source in this demo installation:

peahost.com/joomla15/index.php?page=shop...virtuemart&Itemid=53

Code:

[color=#0000bb]THIS DIV IS FOR THE ATTRIBUTES[/color]

<div class="vmCartDetails"> 

    <div class="vmCartChild vmRowTwo">
  	<input type="hidden" value="10" name="product_id">
<input type="hidden" value="10" name="prod_id[]">
 
  	<div class="vmCartAttributes">
  	    <div style="float: left;text-align:right;margin:3px;" class="vmAttribChildDetail">
        <label for="Size_field">Size</label>:
    </div>
    <div style="float:left;margin:3px;" class="vmAttribChildDetail">
        <select name="Size10" id="Size_field" class="inputboxattrib">
			        	        <option value="big">big</option>
	                	        	        <option value="medium">medium</option>
	                	        	        <option value="small">small</option>
	                        </select>
    </div>
    <br style="clear:both;">
    
    <div style="float: left;text-align:right;margin:3px;" class="vmAttribChildDetail">
        <label for="Power_field">Power</label>:
    </div>
    <div style="float:left;margin:3px;" class="vmAttribChildDetail">
        <select name="Power10" id="Power_field" class="inputboxattrib">
			        	        <option value="100W">100W</option>
	                	        	        <option value="200W">200W</option>
	                	        	        <option value="300W">300W</option>
	                        </select>
    </div>
    <br style="clear:both;">
    
	</div>
		</div>
	 
</div>

[color=#0000bb]THIS DIV IS FOR THE ADD TO CART BUTTON[/color]

<div style="float: right;vertical-align: middle;"> <label class="quantity_box" for="quantity10">Quantity:&nbsp;</label><input type="text" value="1" name="quantity[]" id="quantity10" size="4" class="inputboxquantity">
		<input type="button" onclick="var qty_el = document.getElementById('quantity10'); var qty = qty_el.value; if( !isNaN( qty )) qty_el.value++;return false;" class="quantity_box_button quantity_box_button_up">
		<input type="button" onclick="var qty_el = document.getElementById('quantity10'); var qty = qty_el.value; if( !isNaN( qty ) &amp;&amp; qty &gt; 0 ) qty_el.value--;return false;" class="quantity_box_button quantity_box_button_down">
		    
    <input type="submit" title="Add to Cart" value="Add to Cart" class="addtocart_button">
    </div>

Please Log in to join the conversation.

ivan.milic
Support Staff
Moderator

12 years 9 months ago #17007 by ivan.milic

Replied by ivan.milic on topic Re: Display attributes on top of Add to Cart button

Order is ok, attributes then add to chart.

components\com_virtuemart\themes\hot_fashion\templates\product_details\includes\addtocart_form.tpl.php

Please Log in to join the conversation.

Time to create page: 0.093 seconds