For example on hover I want to change small image to thumbnail is it possible please don't say to change any code on list.phtml
$j('.foo').hover(function(){
$j(this).attr('src','<?php echo $this->helper(catalog/image)->init($_product, thumbnail) ?>');
});
try that..
<?php Mage::getModel('catalog/product')->load($_product->getId()); ?>
$j('#product-collection-image-<?php echo $_product->getId(); ?>').hover(function(){
$j(this).attr('src','<?php echo Mage::helper(catalog/image)->init($_product, thumbnail) ?>');
});
Related
All i want to do is display an image if the image exist if not display blank but i cant seem to figue it out.
Im storing my image path file in my database, in the column called, file and path is stored like this:
/images/file_name
now if there isnt an image being posted it stores /images/
if ($news_item['file'] = '/images/11.jpg') { ?>
<img src="<?php echo base_url(); echo $news_item['file'] ?>">
} else {
echo '';
}
?>
If you need anything more of me let me know but just to give you an idea of what I'm achieving.
its a news post, if you create a post you have a title and description and you have the choice of entering in a file/image.. if you leave it blank it will enter in /images/ and if you enter an image in it will be: /images/file_name (this is inserted into a db)
Check like this:
if (file_exists($news_item['file'])) {
I would simply use the alt property of the image to show an alternative text:
<img src="<?php echo base_url(); echo $news_item['file'] ?>" alt="no image">
or, if you want it to be completely blank:
<img src="<?php echo base_url(); echo $news_item['file'] ?>" alt="">
EDIT:
To completely remove the image, you can conditionally generate the image or an alternative text:
if (file_exists($news_item['file'])) {
echo '<img src="'.base_url().$news_item['file'].'">';
} else {
echo "No image";
}
I suggest you to store the default.jpg in DB ( You can set this default in DB ). And store the default.jpg image in image folder. So that you don't need to change anything in coding.
I am using a custom magento template which has a lightbox on the product page. I can set the max width/height for the lightbox in the config as a percentage of the screen (ie 95%). The problem is it then uses this as the default value so even it is is a really small image it will stretch it out to 95% of the screen and cause the image to pixelate.
I would like it to use this percentage as a maximum only but if the actual image is smaller than this then it would use the actual image dimensions.
I have found a file with this code which I think I may need to edit but I am not sure how to go about this in Magento:
<?php
$maxWidth = $zoomHelper->getCfg('lightbox/max_width');
$maxHeight = $zoomHelper->getCfg('lightbox/max_height');
$cfg = '';
if ($maxWidth)
$cfg .= ", maxWidth:'{$maxWidth}'";
if ($maxHeight)
$cfg .= ", maxHeight:'{$maxHeight}'";
?>
Any ideas?
The way I've done this is to load up relatively large images as the base product image. When the product / view is rendering, build a js object that contains urls for large images, and any thumbnails you need. Your lightbox should then use the js object as a data source.
media.phtml
<script> var images = {};</script>
<?php $_images = Mage::getModel('catalog/product')->load($_product->getId())->getMediaGalleryImages(); ?>
<?php if($_images){?>
<?php $i=0; foreach($_images as $_image){ $i++; ?>
<img src="<?php echo $this->helper('catalog/image')->init($_product, 'thumbnail', $_image->getFile())->resize(108,90); ?>" alt="<?php echo $this->htmlEscape($_image->getLabel());?>" title="<?php $this->htmlEscape($_image->getLabel());?>" /><?php } ?>
<script> images.bigsrc = "<?php echo $this->helper('catalog/image')->init($_product, 'thumbnail', $_image->getFile())->resize(800,800); ?>" </script>
<?php } ?>
You then have a js object containing urls for whatever size image you would need. Pass that into lightbox / fancybox etc.
You will definitely have to tailor this to match your needs - mostly in terms of creating a js object that you can use.
Some info on resizing images in mage:
http://www.magthemes.com/magento-blog/customize-magentos-image-resize-functionality/
I've got a problem with my Magento installation. I'm using the upsell feature to provide some more interesting products. The output works so far but I've got a big problem with the product url.
The url links to my-shop.com/product.html and not to my-shop.com/category-1/category-2/product.html. That's bad because I'm calling a special sidebar navigation for each top category. And so nothing is shown...
I'm using the standard upsell output:
<img src="<?php echo $this->helper('catalog/image')->init($_link, 'small_image')->resize(115) ?>" width="115" height="115" alt="<?php echo $this->htmlEscape($_link->getName()) ?>" title="<?php echo $this->htmlEscape($_link->getName()) ?>" />
<h3 class="product-name"><?php echo $this->htmlEscape($_link->getName()) ?></h3>
<?php echo $this->getReviewsSummaryHtml($_link) ?>
<?php echo $this->getPriceHtml($_link, true, '-upsell') ?>
(I can't post the whole code, the editor will delete most of it)
I've tried it with $_link->getProductPath(), but the output was empty.
I also checked the settings in System->Config->Catalog->Search Engine Optimization. Use Categories Path for Product URLs set to Yes.
Does anybody has an idea how to get the full path url for the products?
Thank you for your help.
You may use the below logic to get the product url. Update the variables accordingly.
<?php
$_prodcats = $_product->getCategoryIds();
$_cat = Mage::getModel('catalog/category')->load($_prodcats[0]);
$produrl = $this->helper('catalog/output')->productAttribute($_product, $_product->getRequestPath(), 'request_path') ;
if($this->getRequest()->getModuleName() == 'catalogsearch') {
$produrl = '/'. basename($_cat->getUrl()) .'/' . basename($_product->getProductUrl()) ;
}
?>
I found a solution on the web which works for 1.9.2.1.
The upsell products become a link with category link.
$d = $_link->getData();
$id = $d['entity_id'];
$_product = Mage::getModel('catalog/product')->load($id);
$_categories = $_product->getCategoryIds();
$_category = Mage::getModel('catalog/category')->load($_categories[0]);
$cat_url = str_replace(".html","",$_category->getUrlPath());
$_url = Mage::getUrl($cat_url).basename($_link->getProductUrl());
And then use this url
Link
I still have the problem that the created sitemap.xml just added
www.website.com/product instead of
www.website.com/category/product
even if "Use Categories Path for Product URLs" is set to YES
I am trying to replace the default lightbox 'modal' to 'slimbox', because 'modal' doesn't have the navigation arrows.
Demo of slimbox with navigations
Demo of modal without navigations
I am using these paths to modify the calling of slimbox
[templatename]/html/com_virtuemart/productdetails/default.php
components/com_virtuemart/productdetails/default.php
Joomla v2.5
Virtuemart 2.0.6
Slimbox2
The following is my attempt:
//Enable Slimbox2 plugin
$front = JURI::root(true).'/components/com_virtuemart/assets/';
$document = JFactory::getDocument();
$document->addStyleSheet($front.'js/slimbox/slimbox.css');
$document->addScript($front.'js/slimbox/slimbox2.js');
$js = 'jQuery(document).ready(function($) { $("a.lightbox").slimbox(); });';
$document->addScriptDeclaration($js);
//output thumbnail
echo $this->product->images[0]->displayMediaThumb('class="product-image"',true,'class="lightbox" rel="lightbox"'.$this->product->virtuemart_product_id.'"',true,true);
//unset first image not to be show amont additional ones
unset ($this->product->images[0]);
?>
But its still not working I wondered what's wrong?
[Reference][3]
You aren't applying the slimbox class to the image reference, your applying it to the container of the image aren't you? You need to deal with the image file url directly in my opinion.
// get the file_url of the first image
$imgPath = $this->product->images[0]->file_url;
// output the image
<a class="slimbox" href="<?php echo $imgPath; ?>">
<img src="<?php echo $imgPath; ?>" alt="" />
</a>
Hi everybody: i had define a new content type that have:
a title, a link field, and a image field.
So, i want to make that image comes to be the background of the content type when i show it. How can i do that?
Thanks in advance
A very quick way to do this would be to add a custom node.tpl.php to your theme and do this:
<?php
$url = file_create_url($node->field_image[$node->language][0]['uri']);
?>
<div style="background:url(<?php echo $url; ?>) left top no-repeat;" id="node-<?php print $node->nid; ?>" class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>>
// Rest of node.tpl.php here
I wanted to comment on Clive's answer, but do not have the "rep" :(. Wouldn't it be best with a check for node-type?
<?php
if ($type == 'MACHINE_NAME_FOR_YOUR_TYPE') {
$url = file_create_url($node->field_image[$node->language][0]['uri']);
?>
<div style="background:url(<?php echo $url; ?>) left top no-repeat;" id="node-<?php print $node->nid; ?>" class="<?php print $classes; ?> clearfix"<?php print $attributes; ?>>
<?php } ?>
// Rest of node.tpl.php here
If you use Field Group module, check Field Group Background Image.
Steps:
Go to the Manage Display page of your content type
Create a div (background image) field group as a wrapper of the node
Select the image field you want to use. Optionally, you can specify an image style
Do not output your image field