Author Topic: Styling Custom Fields by Layout Position VM3  (Read 25077 times)

PRO

  • Global Moderator
  • Super Hero
  • *
  • Posts: 10442
  • VirtueMart Version: 3+
Styling Custom Fields by Layout Position VM3
« on: March 21, 2015, 17:28:19 pm »
VM3 has different templating then VM2 with respect to custom fields.

Now the Custom fields, Related Products,Related Categories, and Add to Cart custom fields all use the same file.
sublayouts/customfields.php

BUT! You do not have to style them the same way.

A custom field is called like such
echo shopFunctionsF::renderVmSubLayout('customfields',array('product'=>$this->product,'position'=>'related_categories','class'=> 'product-related-categories'));

Too add a different style for the related categories field we just change
sublayouts/customfields.php

After this
if (!empty($product->customfieldsSorted[$position])) {
// Add this
 if ($class !='product-related-categories' ){

Then before the closing tag , we must add another }
Change this

<?php
} ?>
To this
<?php
} }?>


NOW: We have to add our layout for the style product-related-categories
So we add this
<?php
if ($class=='product-related-categories' && $product->customfieldsSorted[$position]) {
   ?>
   <div class="<?php echo $class?>">
      <?php
      if($customTitle and isset($product->customfieldsSorted[$position][0])){
         $field = $product->customfieldsSorted[$position][0]; ?>
      <div class="product-fields-title-wrapper"><span class="product-fields-title"><strong><?php echo vmText::_ ($field->custom_title) ?></strong></span>
         <?php if ($field->custom_tip) {
            echo JHtml::tooltip (vmText::_($field->custom_tip), vmText::_ ($field->custom_title), 'tooltip.png');
         } ?>
      </div> <?php
      }
      $custom_title = null;
      foreach ($product->customfieldsSorted[$position] as $field) {
         if ( $field->is_hidden ) //OSP http://forum.virtuemart.net/index.php?topic=99320.0
         continue;
         ?><div class="product-field product-field-type-<?php echo $field->field_type ?>">
            <?php if (!$customTitle and $field->custom_title != $custom_title and $field->show_title) { ?>
               <span class="product-fields-title-wrapper"><span class="product-fields-title"><strong><?php echo vmText::_ ($field->custom_title) ?></strong></span>
                  <?php if ($field->custom_tip) {
                     echo JHtml::tooltip (vmText::_($field->custom_tip), vmText::_ ($field->custom_title), 'tooltip.png');
                  } ?></span>
            <?php }
            if (!empty($field->display)){
               ?><div class="product-field-display"><?php echo $field->display ?></div><?php
            }
            if (!empty($field->custom_desc)){
               ?><div class="product-field-desc"><?php echo vmText::_($field->custom_desc) ?></div> <?php
            }
            ?>
         </div>
      <?php
         $custom_title = $field->custom_title;
      } ?>
      <div class="clear"></div>
   </div>
<?php
} }?>


After we have added the separate style, you just modify it to display like you want to.
I use separate styles for every custom field position
Please note that for every style you add you must add an exclusion to the original default style display.
For example changing this

 if ($class !='product-related-categories' ){
to add more like this

 if ($class !='product-related-categories' && $class !='li' && $class!='drops' ){



d0ublezer0

  • Jr. Member
  • **
  • Posts: 213
Re: Styling Custom Fields by Layout Position VM3
« Reply #1 on: June 01, 2015, 11:11:38 am »
OK! how to change $field->display; html code for related products, without change customfields.php model?
Because, i dont need "_blank" link opening.

PRO

  • Global Moderator
  • Super Hero
  • *
  • Posts: 10442
  • VirtueMart Version: 3+
Re: Styling Custom Fields by Layout Position VM3
« Reply #2 on: June 01, 2015, 14:45:11 pm »
sublayouts/related.php

TAIWAR

  • Jr. Member
  • **
  • Posts: 240
Re: Styling Custom Fields by Layout Position VM3
« Reply #3 on: December 04, 2017, 15:43:34 pm »
Hello

I need : not display custom field for all my product from my  catagorie page view but sorry I don't know what code I need to disable and in which files of VM ?

Thank you

VM 3 0 18

Studio 42

  • Contributing Developer
  • Sr. Member
  • *
  • Posts: 4699
  • Joomla & Virtuemart developper
    • Studio 42 - Virtuemart & Joomla extentions
  • VirtueMart Version: 2.6 & 3
Re: Styling Custom Fields by Layout Position VM3
« Reply #4 on: December 05, 2017, 21:30:20 pm »
A better way is to replace
<div class="<?php echo $class?>">
with
<div class="<?php echo $class.' '.$position ?>">
So you have an extra parent class and can add some css eg.
.onbot  .product-fields-title-wrapper{float:left;width:100%}
.onbot  .product-field-display{float:left;width:33.33%}