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

PRO

  • Global Moderator
  • Super Hero
  • *
  • Posts: 10275
  • 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' ){


I do NOT do development work for hire.

d0ublezer0

  • Jr. Member
  • **
  • Posts: 107
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: 10275
  • VirtueMart Version: 3+
Re: Styling Custom Fields by Layout Position VM3
« Reply #2 on: June 01, 2015, 14:45:11 pm »
sublayouts/related.php
I do NOT do development work for hire.