Author Topic: Different Background for Each Product  (Read 504 times)

Jack Stiles

  • Beginner
  • *
  • Posts: 23
  • A beginner
Different Background for Each Product
« on: August 21, 2018, 20:30:01 pm »
So I have one more thing here... Lets say I only have like 5 products on a whole shop but I really need every one of them to be well designed. Is there a way to use a different background color for each product? Didn't find such a thing here on forum...

Iam on latest Joomla and latest VM

PRO

  • Global Moderator
  • Super Hero
  • *
  • Posts: 10280
  • VirtueMart Version: 3+
Re: Different Background for Each Product
« Reply #1 on: August 21, 2018, 21:07:10 pm »
for category page?

sublayouts/products.php

change this
    // Show Products ?>
   <div class="product vm-col<?php echo ' vm-col-' . $products_per_row . $show_vertical_separator ?>">

to this

    // Show Products ?>
   <div class="color<?php echo $product->virtuemart_product_id ?> product vm-col<?php echo ' vm-col-' . $products_per_row . $show_vertical_separator ?>">

then you will have a class set for each product


.colorTHE_PRODUCT_ID

Then just style it in your style sheet like you want.
I do NOT do development work for hire.

Jack Stiles

  • Beginner
  • *
  • Posts: 23
  • A beginner
Re: Different Background for Each Product
« Reply #2 on: August 22, 2018, 11:31:48 am »
OK great  :) - one question though. I am not really sure how sublayouts work but - if I change anything in it - does the update overwrite it?

Jack Stiles

  • Beginner
  • *
  • Posts: 23
  • A beginner
Re: Different Background for Each Product
« Reply #3 on: August 22, 2018, 11:39:34 am »
for category page?

Nah not really - I need to be able to change is on a product detail page - the whole page background.

GJC Web Design

  • 3rd party VirtueMart Developer
  • Super Hero
  • *
  • Posts: 8002
  • Virtuemart, Joomla & php developer
    • GJC Web Design
  • VirtueMart Version: 2.6.22 & 3.2.14
Re: Different Background for Each Product
« Reply #4 on: August 22, 2018, 12:31:51 pm »
same idea but on the over ridden product details template
GJC Web Design
VirtueMart and Joomla Developers - php developers http://www.gjcwebdesign.com
VM3 AusPost Shipping Plugin - e-go Shipping Plugin - VM3 Postcode Shipping Plugin - Radius Shipping Plugin - VM3 NZ Post Shipping Plugin - AusPost Estimator
Samport Payment Plugin - EcomMerchant Payment Plugin - ccBill payment Plugin
VM2 Product Lock Extension - VM2 Preconfig Adresses Extension - TaxCloud USA Taxes Plugin - Virtuemart  Product Review Component
http://extensions.joomla.org/profile/profile/details/67210
Contact for any VirtueMart or Joomla development & customisation

Jack Stiles

  • Beginner
  • *
  • Posts: 23
  • A beginner
Re: Different Background for Each Product
« Reply #5 on: August 22, 2018, 14:07:06 pm »
So this doesn't work. It always adds "color" to a class but no ID behind it :-(

Jack Stiles

  • Beginner
  • *
  • Posts: 23
  • A beginner
Re: Different Background for Each Product
« Reply #6 on: August 22, 2018, 14:11:22 pm »
I should add that I cannot add this to a product details because I need to adjust the whole background on a whole product page so I added this as a body class to my template index.php. But it wasnt working in product description as well. I always adds only COLOR which means its unable to understand this: <?php echo $product->virtuemart_product_id ?>

Jörgen

  • Global Moderator
  • Full Member
  • *
  • Posts: 1667
    • Kreativ Fotografi
  • VirtueMart Version: 3.2.12
Re: Different Background for Each Product
« Reply #7 on: August 22, 2018, 14:54:35 pm »
It should work in sublayout products.php. You must be in the right context. Within this for example:

Code: [Select]
foreach ( $products as $product ) {
Otherwise $product may be meaningless.

use

Code: [Select]
print_r($product);
to see the contents of product.


Jörgen @ Kreativ Fotografi
Joomla 3.8.3
Virtuemart 3.2.12
Olympiantheme Hera (customized)

Jack Stiles

  • Beginner
  • *
  • Posts: 23
  • A beginner
Re: Different Background for Each Product
« Reply #8 on: August 22, 2018, 16:22:02 pm »
Well I used another approach. But thank you guys cause this thread help me to understand how to proceed.

What I did was this - each product has a unique url so I did this:

color<?php if(strpos($_SERVER['REQUEST_URI'], 'productname') !== false):?>productname<?php else: ?><?php endif; ?>


Studio 42

  • Contributing Developer
  • Sr. Member
  • *
  • Posts: 3334
  • Joomla & Virtuemart addon developper
    • Studio 42 - Virtuemart & Joomla extentions
  • VirtueMart Version: 2.6 &amp; 3.0.x.y
Re: Different Background for Each Product
« Reply #9 on: August 22, 2018, 22:59:02 pm »

color<?php if(strpos($_SERVER['REQUEST_URI'], 'productname') !== false):?>productname<?php else: ?><?php endif; ?>

One of the poorest code i have see!

GJC Web Design

  • 3rd party VirtueMart Developer
  • Super Hero
  • *
  • Posts: 8002
  • Virtuemart, Joomla & php developer
    • GJC Web Design
  • VirtueMart Version: 2.6.22 & 3.2.14
Re: Different Background for Each Product
« Reply #10 on: August 23, 2018, 00:01:06 am »
<div class="color<?php echo $this->product->virtuemart_product_id ?>" >

if your on details
GJC Web Design
VirtueMart and Joomla Developers - php developers http://www.gjcwebdesign.com
VM3 AusPost Shipping Plugin - e-go Shipping Plugin - VM3 Postcode Shipping Plugin - Radius Shipping Plugin - VM3 NZ Post Shipping Plugin - AusPost Estimator
Samport Payment Plugin - EcomMerchant Payment Plugin - ccBill payment Plugin
VM2 Product Lock Extension - VM2 Preconfig Adresses Extension - TaxCloud USA Taxes Plugin - Virtuemart  Product Review Component
http://extensions.joomla.org/profile/profile/details/67210
Contact for any VirtueMart or Joomla development & customisation

Jack Stiles

  • Beginner
  • *
  • Posts: 23
  • A beginner
Re: Different Background for Each Product
« Reply #11 on: August 23, 2018, 08:22:06 am »
One of the poorest code i have see!

Well thank you for letting me know it was really helpful  :o

Studio 42

  • Contributing Developer
  • Sr. Member
  • *
  • Posts: 3334
  • Joomla & Virtuemart addon developper
    • Studio 42 - Virtuemart & Joomla extentions
  • VirtueMart Version: 2.6 &amp; 3.0.x.y
Re: Different Background for Each Product
« Reply #12 on: August 23, 2018, 10:25:31 am »
Jack, i think this helps you.
You have solution using virtuemart product id, this is set in all case when you show a product.
IF you need to use it in the template directly and not in virtuemart, you can get it from the input query.
see in general for joomla https://docs.joomla.org/Retrieving_request_data_using_JInput
in your case :
Code: [Select]
<?php 
$jinput 
JFactory::getApplication()->input;
$id$jinput->getInt('virtuemart_product_id',null);
if(empty(
$id)) $id='';
?>

<div class="color<?php echo $id ?>">




Jack Stiles

  • Beginner
  • *
  • Posts: 23
  • A beginner
Re: Different Background for Each Product
« Reply #13 on: August 24, 2018, 10:41:48 am »
Jack, i think this helps you.
You have solution using virtuemart product id, this is set in all case when you show a product.

Thanks! Works as a charm!  ;)