linking k2store fields to template CSS

I would like to use bikestore with k2store. If I create a price field in k2, how does it adopt the proper styling? In other words, how do I link the k2store's CSS to individual fields in k2?

If you mean K2 Extra Fields then you can add the name of the field to its class which you can use in css by its fieldname. Such as below example.

In file: templates/gk_bike_store/html/com_k2/templates/default/item.php
Line: 189 you will see following code. This code is single line but for display purposes I have broke it down to few lines.

Code: Select all

<li class="<?php echo ($key%2) ? "odd" : "even"; ?> type<?php echo ucfirst($extraField->type); ?> group<?php echo $extraField->group; ?>">
<span class="itemExtraFieldsLabel"><?php echo $extraField->name; ?>:</span>
<span class="itemExtraFieldsValue"><?php echo $extraField->value; ?></span>
</li>


You can use fields name as css class such as below span examples.

Code: Select all

<span class="itemExtraFieldsLabel <?php echo $extraField->name; ?>label"><?php echo $extraField->name; ?>:</span>
<span class="itemExtraFieldsValue <?php echo $extraField->name; ?>value"><?php echo $extraField->value; ?></span>


Lets say following are our extra fields: VIPCharge, UsualCharge

So by above example this would produce following html

Code: Select all

<span class="itemExtraFieldsLabel VIPChargelabel">VIPCharge:</span>
<span class="itemExtraFieldsValue VIPChargevalue">£100</span>
<span class="itemExtraFieldsLabel UsualChargelabel">UsualCharge:</span>
<span class="itemExtraFieldsValue UsualChargevalue">£50</span>


You can then use following in css.

Code: Select all

.VIPChargelabel { your css }
.VIPChargevalue { your css }
.UsualChargelabel { your css }
.UsualChargevalue { your css }


See you around...

Thank you for the response... Let me be a bit more detailed about our situation. We have Creativity set as our default template and we want to use k2 as our store. We wish to set a k2 category default template to bike store so that whenever a k2store item is called it has the properties of bike store's CSS (example: module). Is there a simple solution to this?

You can try following.

Considering your "Creativity" template is installed.
1. Copy Bikestore template to joomla template folder or install template from extension manager.
2. Assign Bikestore template to your K2 Store menu item in template settings.


If this doesn't work then second choice
Copy Bikestore>html>K2 Store to Creativity>html>K2Store
Manually Copy K2store related css from BikeStore css files to Creativity > css > override.css

See you around...

Thanks for the tips... Is there a quick stay package with k2store already setup and installed? This would make things much easier...