Author Topic: change the width of the add to cart popup  (Read 526 times)

ibnati

  • Beginner
  • *
  • Posts: 28
  • A beginner
change the width of the add to cart popup
« on: July 10, 2018, 04:16:23 am »
hello

i want to change the width of  the add to cart popup but when i change it, it effet the width of the images  zoom popup of the detail page because the both use fancybox

also is there any methode to change only the css of the add to cart popup like using a javascript cod that add a css class to the add to cart popup or any other method ?


thanks
amine

hellorain

  • Jr. Member
  • **
  • Posts: 95
    • Raincreatives - Virtuemart & Mobile Commerce Experts
  • Skype Name: support.raincreatives
Re: change the with and some css on the add to cat popup
« Reply #1 on: July 10, 2018, 06:47:25 am »
Hello,

If you are using virtumart 3.0 then you can change css from below path.

components/com_virtuemart/assets/css/vm-ltr-site.css

It will be better if you provide site details or screen shot of your issue.

Best Regards,
hellorain.
Raincreatives - Virtuemart & Mobile Commerce Experts

jenkinhill

  • UK Web Developer & Consultant
  • Global Moderator
  • Super Hero
  • *
  • Posts: 26973
  • Always on vacation
    • Jenkin Hill Internet
Kelvyn

Jenkin Hill Internet,
Lowestoft, Suffolk, UK

Unsolicited PMs/emails will be ignored.

Please mention your VirtueMart, Joomla and PHP versions when asking a question in this forum

Currently using VM..3.4.0.9935 on Joomla 3.8.12 PHP 7.0.31

ibnati

  • Beginner
  • *
  • Posts: 28
  • A beginner
Re: change the with and some css on the add to cat popup
« Reply #3 on: July 10, 2018, 16:09:42 pm »
hello

sorry also i use the latest version of vm and php 7

also the issue is as you look here https://www.screencast.com/t/oXyGKSIoA9

also i have changed the css of the popup using this cod
Code: [Select]
#fancybox-wrap {
 
    padding: 0px !important;
    padding-bottom: 4px !important;
width: 440px !important;
    #fancybox-content {
    width: 428px !important;
padding-bottom:9px !important;
    }
}

 
 
.popup-cart .item-wrap {
    width: 428px !important;
}
#fancybox-outer {

    width: 448px;
}

but the problem is the the zoom image popup in the right side  (https://www.screencast.com/t/eY2Lykp4a)has been changed too and it not look good because of the width of the popup

also for this i want change the css only of the add to cart popup not the other popups
 
also for example i have seen in one template they use this js cod
Code: [Select]
$.facebox( txt , 'my-style2'); to insert  the class "my-style2" into the add to cart popup and so they changed it width without chaging the width of all popups

how can do this please ?

thanks
amine


ibnati

  • Beginner
  • *
  • Posts: 28
  • A beginner
Re: change the with and some css on the add to cat popup
« Reply #4 on: July 10, 2018, 17:33:24 pm »
also i have added this js cod

Code: [Select]
if (Virtuemart.addtocart_popup ==1) {

  $("#fancybox-wrap").addClass('classname');

}  else { 
$("#fancybox-wrap").addClass('classname1');
}

but it add the class "classname" in both add to cart popup and in the image popup https://i.imgur.com/sRlnK8r.png

how can i fix this please ?

thanks
amine

jenkinhill

  • UK Web Developer & Consultant
  • Global Moderator
  • Super Hero
  • *
  • Posts: 26973
  • Always on vacation
    • Jenkin Hill Internet
Re: change the width of the add to cart popup
« Reply #5 on: July 10, 2018, 17:45:40 pm »
screencast requires me to install flash, so I can't see any image. This needs a URL to see the problem.
Kelvyn

Jenkin Hill Internet,
Lowestoft, Suffolk, UK

Unsolicited PMs/emails will be ignored.

Please mention your VirtueMart, Joomla and PHP versions when asking a question in this forum

Currently using VM..3.4.0.9935 on Joomla 3.8.12 PHP 7.0.31


ibnati

  • Beginner
  • *
  • Posts: 28
  • A beginner
Re: change the width of the add to cart popup
« Reply #7 on: July 11, 2018, 15:35:57 pm »
hello
have you any fix for this please ?

jenkinhill

  • UK Web Developer & Consultant
  • Global Moderator
  • Super Hero
  • *
  • Posts: 26973
  • Always on vacation
    • Jenkin Hill Internet
Re: change the width of the add to cart popup
« Reply #8 on: July 11, 2018, 18:09:46 pm »
Edit & override components/com_virtuemart/views/cart/tmpl/padded.php

Wrap the contents of that template file in a div which can be styled as appropriate.

Eg adding:
?>   
<div style="width:600px;">
<?php

immediately below  defined('_JEXEC') or die('Restricted access');

and closing the div at the end of the file would give the add to cart popup width of 600px and not affect anything else.

You should add a class to the div instead of an in-line style for responsive templates.    You probably already have an override for padded.php in which case edit that file.
Kelvyn

Jenkin Hill Internet,
Lowestoft, Suffolk, UK

Unsolicited PMs/emails will be ignored.

Please mention your VirtueMart, Joomla and PHP versions when asking a question in this forum

Currently using VM..3.4.0.9935 on Joomla 3.8.12 PHP 7.0.31

GJC Web Design

  • 3rd party VirtueMart Developer
  • Super Hero
  • *
  • Posts: 7994
  • Virtuemart, Joomla & php developer
    • GJC Web Design
  • VirtueMart Version: 2.6.22 & 3.2.14
Re: change the width of the add to cart popup
« Reply #9 on: July 11, 2018, 19:56:01 pm »
As Jenks says .. make use of files that are only rendered in the view you want

so e.g. in padded.php you could add any css u wanted and it would only effect that view

e.g.
<style type="text/css">
#fancybox-wrap {
 
    padding: 0px !important;
    padding-bottom: 4px !important;
    width: 440px !important;
    #fancybox-content {
    width: 428px !important;
   padding-bottom:9px !important;
    }
}

 
 
.popup-cart .item-wrap {
    width: 428px !important;
}
#fancybox-outer {

    width: 448px;
}
</style>
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

ibnati

  • Beginner
  • *
  • Posts: 28
  • A beginner
Re: change the width of the add to cart popup
« Reply #10 on: July 11, 2018, 22:53:42 pm »
ok , thank you very much it solved the issue